Design Requirements
SlideWiki workflow: https://drive.google.com/open?id=1yEveNOybYDEJMWLS8utuSUXNvz5NjDPp
Update Semantic UI theme
SlideWiki uses Semantic UI for UI components. Styling is controlled through a custom theme. So far we have only changed the default colours and added a specific class for hidden text. Details about themeing in Semantic UI https://semantic-ui.com/usage/theming.html
We have a custom version of semantic ui in https://github.com/slidewiki/slidewiki-semantic-ui - the SlideWiki theme is at https://github.com/slidewiki/slidewiki-semantic-ui/tree/master/src/themes/slidewiki b
We also need to support some accessibility requirements through updating the theme:
- require a focus indicator - SWIK-1338Getting issue details... STATUS to indicate when buttons, links and form fields have focus. (https://www.deque.com/blog/give-site-focus-tips-designing-usable-focus-indicators/ may be useful)
- contrast of disabled toggle switch needs to be at least 4:1 - SWIK-2387Getting issue details... STATUS
Want a really nice clean theme and styling, following SlideWiki colour palette https://drive.google.com/open?id=0B-oEnszZrEaMdk5VaDFlMzdrdkE
We use the following components at lot:
- basic buttons are used through out the UI eg but also standard buttons for critical functions such as Save
- segments with secondary segments for headers which have a grey background
- Card, used to display a deck with buttons and links when listing decks on a number of screens
- also looking to implement a horizontal version of the card for displaying decks. Currently only available as a mock up
Full page layout for static pages
Currently static pages use a central column and have no design components. We would like to have a responsive layout that uses the full-width of the screen
Example page https://slidewiki.org/terms
Home Page
We have mocked up a new home page based on feedback from users
We also wish to have a Welcome page that users will see when they are signed in instead of on the home page. Before implementing this we need to create a component for horizontally scrolling through thumbnails.
Icons on SlideWiki
List of icons currently used in SlideWiki