Talking to the people in the store
This was a class project in General Assembly’s UX Design Immersive: propose a redesign for Emerald City Comics, a local comic book shop. It wasn’t commissioned by the store.
Like most projects, this one started with conversations. Comic book fans are an audience I happen to belong to, so I drove down to Emerald City Comics and informally interviewed the patrons who were willing to talk about what they needed from a comic shop’s website.
Most of them said they preferred the trip to the shop. For them, the visit is a social thing. But a fair number could also see the need to shop online in a post-COVID world.
A tale of two experiences
With a sense of the audience, I needed to understand how well the existing site served someone trying to buy online.
A heuristic evaluation confirmed the biggest problem: the contrast between the Shopify cart and the blog-style WordPress site that made up the rest of the experience. Moving from reading news to buying a comic felt like leaving one website and arriving at another.
Who else sells comics online
Among Emerald City’s local competitors, Nerdout and Coliseum of Comics, none were selling comics online. That put Emerald City in the lead locally.
But having a basic cart isn’t enough. National retailers like Midtown Comics, and Amazon, are ready to take the same order and make it pleasant. The store’s real competition online isn’t down the road.
Designing for Lisa
My research came together in one persona: Lisa, someone who got into comics because the pandemic gave her something new, free time.
“I really got into manga during the pandemic. I’d love to easily buy them online, from a local store. Crowds are still an iffy thing for me.” Lisa, persona
She wants to support a local shop, and she wants to do it from home. Every decision after this point was checked against her.
One menu instead of two
I started by building a new, unified information architecture. With one structure behind both the store and the blog, the site could have one navigation instead of the separate menus each side had before.
The resulting mega menu gives visitors one efficient global navigation, and it’s far less chaotic than what it replaced.
Sketches, wireframes, and testing
To bring the two halves of the site together, I worked through sketches and wireframes until I had a layout I believed could make them feel like one site.
Once the wireframes felt complete, I turned them into a low-fidelity prototype and tested it with participants whose needs matched Lisa’s. I noted their frustrations and comments, then replayed the session recordings against my notes and adjusted the design before moving to high fidelity.
The high-fidelity prototype
What I learned
Unifying two sites is mostly an information architecture problem. What was clearly two sites sharing a domain, probably on two different hosts, became one site because the structure underneath became one.
Needs change. Before COVID, the website did its job as a place to share store news. After it, shopping online became something a local business needs in order to thrive, and the site has to be built around that.