Good Market, a (fictitious) grocery franchise.
An increase in online shopping in the grocery market was causing Good Market to lose 8% of its market share annually.
Good Market's key customer base of busy, tech-savvy young professionals who would value the speed and convenience of online ordering.
My job was to design GoodMarket: an intuitive, convenient grocery shopping product that fulfilled both customer and business goals.
I then researched a variety of competitors in the online grocery market to understand their competitive advantages, what features they offered, and how they were meeting their customer’s needs.
I then conducted an in-depth study of the Thrive Market mobile app in terms of its usability: How easy is it to learn, understand, and use the product, and which features help/hinder the user experience?
Next, I used card sorting research to examine the existing mental models of three potential users who met the description of our target group: young, tech-savvy, busy professionals.
The results of the three card sorts generally mirrored the typical organization of aisles in a grocery store. However, this activity revealed the possibility of other categorizations, such as ingredients for a specific dish or cuisine. I also noted that many items fit into multiple categories and that each category could contain narrowing levels of specificity.
Using this information, I structured the products and important views to create a sitemap for GoodMarket.
Before designing the wireframes, I listed Product Requirements for each view in the app.
I aggregated all of the information I had gathered thus far to sketch wireframes for the app, and then built the wireframes in Sketch using atomic design methodology.
I designed a bright, image-focused UI to highlight the fresh food provided by GoodMarket. Item photos were chosen and edited to be consistent and free of any backgrounds.
Because Good Market didn’t have any existing branding that I should work with, I had some liberty in the visual design choices for the GoodMarket app. The primary color used in the design is a dark but vibrant green, meant to represent and emphasize the high-quality fresh food products offered. A lemon yellow-green is used as an accent, and is primarily reserved to highlight any sales or special deals. The font used throughout is Sofia Pro, with variations in size, weight, color, and capitalization used to create hierarchy between different pieces of text.