Competitor Analysis
Purpose : Review the design concepts of other companies and analyze their information architecture
For this project, I had to build the website almost from scratch. To do so, I researched how various companies, from small businesses to large corporations, present their information and extracted elements that would best fit the needs of the client.
Evaluate previous website
The design is simple, well-organized, and easy to navigate, but it gives off a slightly dark impression and lacks sufficient information, which raises some concerns.
Key points
Clarify what the company does
Add elements that emphasize a human touch
Wireframe
To make future adjustments easier, I started by creating the wireframe for the mobile version of the website. I focused on using plenty of images and icons to create a design that is both intuitive and approachable.
Style guide
Typography
Line height and paragraph spacing for heading is 1.5 x font size
A
a
Heading
HEADING AND SUBTITLE
Mona Sans
A strong and versatile typeface, designed together with Degarism and inspired by industrial-era grotesques.
Colors
At the client’s strong request, the brand color was set to turquoise blue. Since they also wanted the overall look of the site to be extremely simple, no other colors were used, and it was unified with grayscale
Brand Colors
Primary
#5E5EFF
Secondary
#D9E3EA
Tertiary
#232323
Accent
#FFB55C
Blue Colors
Blue1
#27286B
Blue2
#4343B5
Grey Colors
Gray 1
#333333
Gray 2
#666666
Gray 3
#CCCCCC
Gray 4
#EBEBEB
Icon
Final design
First, we created a map based on their hypothetical situation to find out where they might fall into mental illness. We then interviewed people who have experience working remotely to improve the reproducibility of the map and identify the causes.
Key point
Although there are many causes of mental illness, I realized that the underlying problem is that people do not notice changes in their health.