Daytime Craft Shop
Daytime Craft Shop is an online store that sells handmade jewelry, accessories, and decorations. The owner previously used Etsy to sell her items, but with the growth of her company and increased sales, she wanted to have her own platform.
Problem Statement
The owner of Daytime Craft Shop had previously been selling her products on Etsy. However, with increased sales and a growing business, she wants to start her own website to make selling easier. The owner wants to make sure her website can easily be accessed from a web or mobile browser.
Process
Interviews
A series of 5 interviews were conducted to discover the target audience's current pain points. The users chosen to participate frequently shop online. Interviews were used as the method of research because they allowed me to gain greater qualitative data than other methods would. This type of information gathered was especially useful in the early stages of the design process.
Do they prefer shopping in-person or online?
How often do they shop online?
Do they typically access websites from a desktop or mobile device?
How often do they shop locally?
Questions Summary
Findings
Goals
The goals of users were obtained during the interviews and the goals of the business were based on goals of similar platforms found during the discovery phase of research.
Sitemap
Features
Easy navigation to reduce confusion and time consumption for users
➜
Simple layout to assist with ease of navigation
➜
Clean layout to help users focus on necessary content
➜
Responsive design to optimize experience for both desktop and mobile access
➜
Sketches and Wireframes
I began by sketching the desktop pages which included home, shop, product, cart, checkout, and confirmation pages. Then I sketched the mobile pages which included the home, shop, and confirmation pages. I then showed these to the client for feedback on what kind of layout she would like to have for each page and to get a better understanding of the kind of style she was interested in.
Desktop Wireframe Sketches
Homepage
Shop
Cart
Checkout
Confirmation
Mobile Wireframe Sketches
Homepage
Shop
Confirmation
Style Guide
The UI design choices were made based on the logo the owner had already created.
Baskerville was used as the font to match the text in the logo
The owner’s existing logo was used.
These colors were chosen based on the colors from the logo and the preferred colors the owner chose.
Prototype
A prototype was created on Figma and UsabilityHub was used to conduct remote user testing.
Responsive Design Screens
The home, shop, and confirmation pages were chosen for creating mobile versions of the wireframes.
User Testing Results
100% task completion rate
Testing time < 3 minutes
All successfully navigated to appropriate pages
No users had difficulty navigating through the task flow
Final Thoughts
Results Summary: My findings from the interviews showed the habits and preferences of online shoppers. Additionally, I was able to discover what users were looking for when using an online shopping platform and what features may be beneficial to them.
Challenges and Assumptions: Because only 5 people were interviewed, there were some limitations on the results of the research since those interviewed may not be completely representative of the entire target audience. Another consideration was ensuring the company’s existing brand guidelines were followed throughout the site.
Future Iterations: In the future, I would like to explore options for adding more features and expanding on existing ones, such as adding a search bar with results and improving the shop and product pages.