Redesigning Suzanne Collins Site Case Study

Project Information

This project was focused on the famous author, Suzanne Collins. She has her own site revolving around her history, her works, and awards. However, her original site is not the greatest. This case study focuses on how I can redesign the overall user experience and navigation for her site, while keeping and recognizing her works as an amazing author.


Problem

In this case study, I have pretended that Suzanne Collins is a client, and she is seeking a redesign for her current website. She wants to keep key point information surrounding her famous works such as the 'Hunger Games', and her awards. With the current site, it is not in the best shape for user experience. There are a lot of text throughout the site, and it is difficult to navigate and view her famous works. Her original site can be viewed below.


Vision

Throughout this process I plan to create multiple simple mockups that could satisfy her needs. I then would go into more details with the design and wireframing. I wanted to create a site that was minimal and straight to the point. The site while focus on ease of navigation, redesigning the over color scheme, and improving the user experience of viewing Suzanne Collins’ works and who she is as an author.

Design Problem:

"There is a need for young adult readers to help them navigate Suzanne Collins' website. A redesign is needed to help visualize all her works, and the general navigation interface around the entire site."


Design Process

User Research

First I have navigated through Suzanne Collins' site to see what needed to be improved. Based on what I have seen, it seems that her site is needed to find a way to reach out to her viewers for all ages. There were some noticeable design features that needed to be improved for the site.

Issues:

  • Text heavy

  • Lack of user experience

  • Site navigation

  • Overwhelming

  • Too many focus points

After navigating throughout the site, I have created personas to represent a users needs for what is needed when entering and viewing the site.

I then proceeded to create key features of what I will be focusing on throughout this case study

Design Process Features:

  • Make the site more minimalistic to view, and simple to the touch

  • Minimize the amount of text used and spread out the works in different pages

  • Focus on the books itself and enhance its purpose

  • Make the site straight to the point, therefore the viewer knows the sites call to action

  • Change the layout of the site to make it easier to the eye, and its colors

Mockups & Wireframes

Proceeding the case study, I have created mockups of what the new site will be viewed as, as well as a mobile mockup. I have also created a simple navigational wireframe and user flow map to show the accessibility of the site.


Final Product

The final product was created through Bootstrap templates, HTML/CSS, and JavaScript. In the end I was able to create a site that incorporates proper user navigation around Suzanne Collins' work. There are designated pages for her works and awards, as well as a simple layout. I have focused on the key points of who Suzanne Collins is, and what she is known for. It is important to focus on key aspects for a certain site, and I wanted to create a site that is pleasing to the eye, and that the site is approachable to readers of all ages. The Final Product can be viewed below.