Nowadays, a store’s online presence is just as important as their physical presence. While Rocket Fizz’s physical chain stores are whimsical and inviting, their website was gaudy and difficult to navigate.
Rocket Fizz is a US franchise that specializes in soda, candy, and novelty items. Their stores sell a diverse variety of candies and produces its own line of soft drinks with wacky flavors.
This case study will walk through a conceptual redesign of the Rocket Fizz website. Namely, adding e-commerce functionality to make their wealth of products easier to navigate.‍
This was a project assignment from a UX bootcamp.
I was personally not a fan of novelty candy stores, so this research was especially important to me as a designer. Truly, who are the customers that keep these businesses running? That curiosity guided my research.
I couldn’t get in contact with Rocket Fizz, so I visited my local Sugar Factory, a small kiosk that sells unique candies. An employee generously spent some time sharing her observations about her customers. I also did mini guerrilla interviews with 3 of Sugar Factory’s patrons, asking them what they bought and why they bought it at Sugar Factory.
Sugar Factory's employees and customers helped me get an idea of who goes to novelty candy stores, their goals, personalities, and preferences. This helped me establish my user interview questions and criteria.
I conducted 6 user interviews to build user personas and to inform the design.
‍Interviewee criteria: They have bought or would buy novelty candy and items.
‍Goal: Identify their personalities, problems, & motivations when purchasing novelty goods.
By affinity mapping the results into a cartesian plot (seen above), I was able to identify two main personas. Making an assumption that a user with casual shopping tendencies wouldn't just happen upon a site like Rocket Fizz, both personas became intentional shoppers.
From the research findings above, I created Javier & Jenny to represent Rocket Fizz's main customers. During ideation, these personas helped me verify that each feature in the design addressed user needs. Check them out below!
Since Rocket Fizz's site didn't have an e-commerce feature, a card sorting exercise was crucial to establish an intuitive information architecture that aligned with user expectations.
I had 13 remote card sorting sessions using Optimal Workshop. The data confirmed 4 main categories for Rocket Fizz’s products and 11 subcategories total.
To maximize effectiveness and time, I used the Crazy 8's exercise to sketch out each page from the established user flow. I reviewed my work and highlighted the features that would best serve Jenny and Javier. Those features made up more robust sketches that would inform the low fidelity wireframes on Figma.
Using Figma, I translated my sketches into low-fidelity wireframes. Based on 3 tests, I’ve made a few alternations and moved on to creating high-fidelity prototypes.
‍I did 3 usability tests to understand how intuitive it would be to navigate the site.
Once the usability issues were resolved, I moved on to design the final screens in Figma. My goal was to create a visual identity that’s aligned with the brand’s whimsical personality, but also not overwhelming.
For future iterations, I would want to do more research! I didn’t get to interview that many people who have specifically gone to Rocket Fizz, and I think that interviewing more direct customers would have eventually led to a more informed visual brand.