styleguide
user research
persona
I researched fans of Japanese pop culture contents (comics, anime, movies, and games) and people who are into fashion to help me understand the interests they have that influence their purchase decisions online.
Eric Simon
Male, Age: 40’s
Eric is into cult films, music, comic books, and tons of nerdy stuff (he’s been a geek long before it went mainstream). He also has a big place in his heart for Japanese pop culture such as anime, manga, games, and monster movies. He pretty much only wears unique and funny T-shirts that he buys online.
Valerie Chu
Female, Age: Teen-20's
Valerie likes cute, stylish clothing with a punk-goth edge. She also goes to comic conventions in cosplay dressed as her favorite characters. She listens to music, watches Japanese animation constantly, and also draws her own artwork that is heavily influenced by Japanese manga. A digital native, she is very SNS savvy and is always updating her Instagram and other apps on the go.
Joseph Argent
Male, Age: 20’s
Mainstream type of geek who enjoys the latest superhero and science fiction / fantasy movies from Hollywood (usually on opening weekend), and binge watches new series on Netflix. He also identifies as a gamer and likes to show off his geek cred with branded shirts and lifestyle.
Iris Medina
Female, Age: 30’s
Iris works as a manager. She loves to shop online and is always looking for unique (but cheap) kind of products that she can’t get at the local mall. She often socializes with her friends and maintains a Pinterest board of images of things she likes. Several times a year (When she’s saved up enough money), Iris takes a big trip to either Asia or Europe, and enjoys the best of food, fashion, and culture she finds there.
user flow
After the interviews and establishing the user stories, I put importance on the fact that users want to see the artwork of the T-shirt and poster products, compare them, and find the work so that they can purchase to collect. I came up with a few user stories according to their needs and incorporated them into the site functions.
sitemap
After organizing the user’s online shopping flow, I translated them into the sitemap. Filtering function was one of the important factors for users so that they can easily discover a product they want to get.
wireframe
Responsive design
Users want to easily see artwork both on laptop and mobile, so I made sure to use space as much as possible on any devices to show the artwork, and to aim for a simple and clear responsive design.
mockups
web high fidelity
mobile high fidelity
