Sugar Spoon Candies
Creating an eCommerce website for a local candy store
Sugar Spoon Candies is a small mom and pop candy and ice cream store located in the heart of downtown Castle Rock, Colorado. Owned and operated by a husband and wife team, the shop specializes in bulk candy, international candy, and (most importantly), homemade ice cream sold for $1 a scoop.
Three weeks from ideation to high-fidelity wireframes for desktop and mobile
While the in-store offerings abound, Sugar Spoon does not have a website. Further, there is no way to currently order any of Sugar Spoon’s bulk candies or snacks online.
With the end goal of providing customers with an easy-to-navigate online store, I began with a detailed inventory of Sugar Spoon's offerings. I then looked at online sales options, quantities, and categorization.
As Sugar Spoon is surrounded by many competitors, this research was beneficial, as it helped maintain the priority of keeping Sugar Spoon competitive in a small community.
What do users look for in an online shopping experience?
"Sometimes I like to look at the related or recommended products."
"Make it as easy and simple as possible."
"Easy to navigate."
"I like to be able to use reviews."
"Detailed description of products."
"Safe and secure payment."
"I like to compare products."
"I want it to be easy and secure."
Competitive Research & Comparative Analysis
Within two blocks of Sugar Spoon, two different competitors sell their stock: Mountain Man Fruit & Nut Company, and Rocket Fizz.
Neither location has a website with an online store. Three additional small treat shops, still located within 15 miles of the store, were used for feature analysis.
Simply having a website would be beneficial
Having a functional online store would bump Sugar Spoon above the direct, extremely local competition
The online store, along with its functions (cart, filter, search), need to be obvious when users first land on the homepage of the website
A competitor's website was used for the purpose of usability testing.
GOAL: Testers were given the task of shopping for two different treats, adding them to their cart, and proceeding to checkout.
Ensure all pages and features of the website are accessible
Maintain consistent styling across all pages of website
Provide a simple and obvious filter option
After researching and testing, I created two user personas and a user flow that show how customers could navigate through Sugar Spoons' website.
“Sugar Spoon is my favorite candy shop, but I don’t always have time to go into the store and browse for what I want.”
same selection online as in store; quick and easy checkout
chocolate covered gummy bears
“I can always count on Sugar Spoon for high-quality products that make great gifts for everyone on my list.”
gift wrap options; ability to ship anywhere
the Original Goo Goo Cluster
How Might We...
Provide both shipping and pick-up options for customers
Ensure this website is both usable and enjoyable, to include search, filter, and sort options
Maintain a consistent style across all web pages; make this style reflective of the vintage atmosphere of the store
Understanding user behavior
As with the majority of online shopping, both users begin at the home page. From there, their paths diverge, as Braden uses the search feature and Gail uses the navigation options to browse products. She also uses the sort and filter functions to narrow her results. After looking at their respective product description pages, both users add the product to their cart and complete the checkout process.
Ready to bring ideas to life, I began with hand-drawn sketching and quickly moved to wireframing. A second round of usability testing was completed before making small adjustments and creating a prototype.
Using the Sugar Spoon logo as the “home” button
Providing five or six primary navigation categories to enable users to shop right away
Including a large hero image or slideshow, to include specials, events, and interior/exterior photos of the store
Large sections for news, specials, and top sellers for each category
Product Listing Page
How to display the category as a header
How many products to list and how to shape their images
Where and how to list the filter and sort options
Whether to include breadcrumb navigation at the top of the page
Braden gets his gummy bears
Moving to High-Fidelity
Adding color, branding, and product images