Project Type: Team Project - App Redesign
Team Members: Stan Sujitno
Time Frame: 3 days
Role: UX / UI Designer
Skills: Heuristic Evaluation, Research, Sketching, Wireframing, Prototyping
Tools: Dot Paper and Sharpie, Sketch, InVision
Result: App Redesign
We identified an app with usability issues that would be a good candidate for a redesign.
Stan and I decided on the Vancouver Public Library app. The app aims to help people search for and reserve books along with viewing information on books checked out. People can access products, locations and other services that VPL provides. Essentially it’s an extension of their website.
We began the process by choosing 5 usability heuristics and then evaluating the VPL app based on these. We would use:
Aesthetic and Minimalist Design
Consistency & Standards
Visibility of System Status
Recognition Rather Than Recall
Match Between System & the Real World
Each heuristic would be given a score out of 5, then a final percentage score was determined.
We gave the app a rating of 40%
We focussed on one task to be redesigned:
Search for “Lean UX”
Place a hold on the book
View your hold
Our main inspiration finding came from the VPL website. The website has superior UI to the app and an overall better experience. We felt that it was important for VPL to stay consistent across platforms, and so took elements from their website and incorporated this into the mobile redesign.
It was essential for us to get our ideas down on paper before digitising.
Introduction of a nav bar to improve the ease of navigation
Carousel extended to include the other sections
Logo changed to match the website
The area around the search bar has been tidied up
Refine button has been changed to a more widely recognised filter icon - “Scan ISBN” button is now within this
Search results load automatically as users type
Search Results Screen
Using a grid has improved the padding and spacing of elements and text
+ button has been removed and the most important features from this button (place a hold and add to shelf) have been added next to the title
“Place a Hold” button and “view details” is now consistent with website
Cleaner with better spacing and hierarchy
+ button removed and adjusted as before
Ratings have been removed as the majority of books don’t have ratings - therefore redundant and take up vital real estate
Reduced cognitive load for the user
Libraries displayed as a hierarchical view - locations that are nearest to the user show first
Modal is more aesthetic with the background blur
Done button removed as it’s unnecessary - streamlines process
Hold success modal remains - it’s useful feedback for the user that their request has been processed
Information has been condensed into 1 page
Language is conversational and is consistent with the library
Hierarchy of most useful information to the user has been rearranged
Again the confusing + button has been replaced and the option to cancel the hold is easily accessible
2 screens that were part of the original flow have been made redundant due to our redesign. Excluding these screens streamlines the process for the user.