Tools used:

• Adobe Photoshop

This project was a study in UX, web design, and accessibility. Back in 2017, I performed a heuristic evaluation on the site (www.suzannecollinsbooks.com) to determine the severity of the UX problems. Usability tests were conducted and my redesigns were based on the results from those tests and evaluations.
Several users claimed the original home page felt chaotic and had no flow or one thing to focus their attention on.

The original home page in 2017.

For this project, I redesigned four pages: the home page, list of works page, an informational page for one book, and a biography page. I chose to display information found on suzannecollinsbooks.com by putting her most recent (at the time) book up at the top of her home page, and having the rest of her more famous books arranged neatly below. I designed the navigation bar and quick links similarly yet distinct to give the reader a sense of organization. There was no sense of branding that matched the author's most recognizable works so I went with a typeface that closely resembled both The Hunger Games and Underland Chronicles series. For the body copy of the site, I used a serif font in order to not drastically change the finer details of the original.

I first created wireframes using the artboards function in Photoshop CC 2018 for each of the four pages, keeping it contained in one file. After my wireframes were completed, I created a low-fi mockup to get a sense of the color scheme and white space. I finally completed the mockups using high-res photos found through the author's publishing website.

This project was not affiliated with Suzanne Collins or Scholastic Corporation, nor were they involved with any aspect of it.

← Back to Projects