Event Registration
Background
- Was in dev for over a year before it was completely scratched
- Started over with a 3 month deadline
- I was brought in at end of the dev cycle
- Launched February 2013
Problem
Structure, layout, front-end output was already in place, which meant I couldn’t do much in terms of workflow
Solution
Focus on UI – typography, hierarchy, contrast, color, etc to improve usability and help guide the user
Problem
Front end layout was designed to fit within a very wide container and wasn’t flexible
- “We designed this for pages with no sidebars”
- This is not possible to control – over 1000 schools using this
- We give our clients complete control over the content and layout of their site
- The left side bar houses the second level navigation
- We are selling more responsive sites than fixed-width sites
Solution
Change layout based on screen-size, container size, and side bar presence
News Manager
Background
- Allows admins to write news stories, assign categories and user permissions
- One of our oldest products
- Was brought in toward the end of the dev cycle
- Launched November 2012
Problem
In the News Post Manager screen, admins see a list of all news posts, from which they can filter and only see drafts, those awaiting approval, etc. The filter buttons didn’t stand out and they looked like other action items on the page
Solution
Created new filter button styles
Social
Background
- Internal private social networking where admins can post updates, attach files and links, comment and message other students, faculty members, and parents.
- I was brought in after they were unhappy with the design
- Launched July 2012
Problem
There was no visual hierarchy – everything was given a similar treatment
Solution
Added icons, altered type, added whitespace, introduced color in order to visually group together the different elements on the page
Problem
Relies heavily on avatars/profile pictures. We can rely on teachers and admins to upload their own photos, but what about classrooms & groups?
Solution
Created 13 default icons for admins to choose from
LMS
Background
- Currently in Development, set to go live in June 2013
- Huge project involving the entire dev team
- Redesigned 9 of our products and fit them into one
- Started with Photoshop files – initially to WOW the board, then used it in stakeholder meetings to sell the concept
Problem
Too many levels of navigation/information (4 levels at the top plus an account bar at the bottom)
Solution
Visually group classroom level navigation according to function
Take account bar and move it to the top right in the form of a drop down
Problem
While this new layout so far is clean and easy to use, people will not be happy that they are losing the customization they once had
Solution
They can update the top header with their school logo and choose a background color
We implemented themes so that each teacher can pick one to customize their class
To provide customization on top of just a school logo, admins can choose from ten themes to apply to their classroom or group space.
Problem
Many schools now have 1-1 iPad programs
- icons will be fuzzy on Retina displays
- needs to properly display on all size devices
Solutions
Retina icons!
Responsive!
Problem
Current Discussions are not user friendly and posts are buried 3 levels deep
Solution
Pull out the first 2 levels on the main page