UI UX Redesign Planning - YaleSTC/reservations GitHub Wiki

Hey team!

This wiki page is for the planning phase of our Reservations redesign! We'll constantly come back here to reference things as we work.

Goals

  1. We want Reservations to be used by groups outside of Yale.
  2. Reservations should be easy to maintain and customize by admins.
  3. The UI should be clear and navigable. It should be easy and simple for users to find what they're looking for.
  4. Reservations should have a unified look and feel, instead of a piecemeal, "one person worked on this part and somebody else worked on this other part" UI.
  5. Reservations should feel fast and responsive.
  6. Reservations should feel like a modern website - designed with current technologies, and reflected in the design itself.

Solutions (tentative)

  1. We should replace Yale-specific references and terms with more generalized terms (if there are any left).
  2. Add a bunch of admin options for customizing site functionality and layout. This may mean adding a new model for LayoutSettings or something.
  3. Most users use Reservations to search through the catalog and then, of course, make a reservation. So we're going to want the Catalog and Cart to be the most prominent UI elements.
  4. We're (most likely) going to use Twitter Bootstrap.
  5. Integrate AJAX for page / element loads when possible.
  6. We will be making extensive use of widely supported HTML5 and CSS3 features when they make sense

Notes

  • We're going to minimize the number of images used in the layout. Current web practices promote, as much as possible, all-CSS layouts.
  • We're going to start using SASS to precompile our CSS. Check it out here: http://sass-lang.com/

If you want to join Team UI, talk to @mnquintana!

STC Dev Survey 6/20/12

Likes

  • Cart is in a good location

Dislikes / Changes

  • "Home" link in sidebar is confusing - it doesn't actually link to Reservations index, but instead to some random link the admin sets. Same is currently true of the header, but since that's pulled from the CLC's CSS that's gonna change anyway.
  • We should have a new color scheme
  • Replace Find It Quickly w/ a real search (hopefully one that searches as you type or autocompletes) [feature][behavior]
  • Ability to remove all of 1 item in cart (currently you must click the X button repeatedly on each item) [feature][behavior]
  • Ability to enter # of items in cart (maybe) [feature][behavior]
  • Header is too damn big

Other

  • Replace contact link with full-fledged contact form
  • Clearly communicate to user that Catalog is filtered by cart dates
  • Gray out equipment_models when there are 0 available (or some analogous convention to show they aren't available)