Eleanor Kirk
Onlinebrary
For this project, I was tasked with redesigning and improving an existing website. I chose Goodreads, a website for tracking books, and receiving book recommendations.
About
Personas
In order to assess the existing website and new website, I created 2 personas that could be used for user journeys, cognitive walkthroughs, and more.
Low Fidelity Prototype - Version 1
The initial prototype was sketched on paper and was based on user feedback on the original website and evaluations of the design. The sketches can be seen below.
Low Fidelity Prototype - Version 2
The second low-fidelity prototype was a wireframe design created using Figma. This developed the initial prototype further based on potential issues and improvements that could be seen while transferring the designs to a computer-based wireframe.
Low Fidelity Prototype - Version 3
The 3rd iteration of the design involved improvements based on a variety of user feedback. Five users were asked to give feedback on the 2nd prototype,. Some examples of how the prototype was improved based upon this are:
-
There was no page to show the search results
-
There were no accessibility options
-
Suggestion of a random book selector to be implemented
-
Help page icon placed at the top of the page
High Fidelity Prototype - Version 1
The final low-fidelity prototype was then turned into a high-fidelity prototype, implementing functionality and colour into the design. These designs can be seen below.
High Fidelity Prototype - Version 2
The 2nd high-fidelity prototype contained improvements from a second lot of user feedback (based on the 1st high-fidelity prototype). Some examples of improvements made are:
-
Make the accessibility options clearer
-
Ensure the design is suitable for colour blind users - a colour blindness filter (for all types)was applied
-
Lack of consistency within icons (delete icons, progress bar, etc.)
-
Improved feedback on clickable buttons, such as changing colour when hovered over
High Fidelity Prototype - Version 3
The final high-fidelity prototype contained improvements from 2 cognitive walkthroughs (performed on the 2nd high-fidelity prototype). Some examples of improvements made are:
-
Implementing a log out option
-
Allowing users to view only the books on their 'Want to Read' shelf
