Overview

This project was a study on atomic design based off of Brad Frost. I learned how the smallest parts of a website can link together to become a cohesive component throughout the site. How brad frost described it as is atoms, molecules, organisms, and templates, which in the simplest way I can describe it, are the smallest component which become a bigger unit, which becomes an even bigger unit and eventually forms a webpage.

The Challenge

The 88rising website is currently only a merch store. The website needs to be much more interactive and engaging to keep fans happy. There is no way for fans to learn more about their favorite artists or to listen to their music. Previously, their website used to have information on upcoming concerts, which will be incorporated into this design.
Roles:
Web Designer
• Created sitemaps, mid and high fidelity wireframes in both mobile and desktop
• Created style tiles
Web Developer
• After designing the pages needed, I developed the website using WordPress and Divi on a localhost server (MAMP).

Sitemap

Personas

Allison Jones
“I want a powerful computer for my post-production work
but I don’t know the first thing about computers.”

Pain Points:
• Doesn’t know how to research for parts.
• Doesn’t know how to assemble a PC.
• Feeling overwhelmed with all the PC terms.

Jerry Smith
“I’m confident enough to assemble a computer, but I don’t know
where to begin when it comes to researching for the parts.”

Pain Points:
• Doesn’t know how to research for parts.

Wireframes

Visual design