Suzanne Collins Books - UX/UI Design
Project Type -
Student Project
Client -
Southern New Hampshire University
Date -
February 2023
Scope -
UX/UI Research
UX/UI Design
Software -
Adobe Illustrator
Adobe XD
Brief -
Create user personas so we can get into the minds of the target audience and understand their needs and wants.
Create scenarios with several tasks to complete on the website to understand what can be fixed.
Create low-fidelity wireframes to map out new website structure.
Create high-fidelity interactive prototypes for user testing.
Goals -
Solve the primary problems in the original website and design prototypes that represent the brand -
Make main structure of the website and information in the website organized in separate sections and easy to scroll through.
Add clear call to action buttons on the website.
Add contact information like the author’s social media pages so consumers can make a connection and join a community.
Provide direct purchase links so it is easy for quick transactions to take place.
Solution -
The high-fidelity prototype was created using Adobe XD and the wireframes were created using Adobe Illustrator.
The user personas and scenarios are based on research of the target audience and there wants and needs; they lay the foundations for the structure of the project and understanding what design works best and meets usability principles.
The brainstorming of the project was done through wireframes and used the low-fidelity prototypes/wireframes at the beginning to block out where the elements will be placed. This brainstorming and ideation process helped greatly with producing a cohesive, creative and original final product.
Regarding the high fidelity prototypes - the same color palette (light green, cream, orange, and dark grey) has been used throughout the different pages of the prototypes, different sections are separated with different colors, and there is hierarchy with the use of different fonts and font size for titles and paragraphs so the viewer can easily identify the different elements in a section. The elements within each section are also arranged in open space and isn’t crowded together.
