Website \ E-Commerce
"The opportunity to advertise the café, maintain a current catalog and handle delivery scheduling must all be acheived using human-centered interactions."
1\ Research
The purpose of this digital product is to bring the benefits of a corner coffee shop to an online experience. Due to the 2020 global health crisis, the e-commerce industry is more competitive than ever before.
However, Reuters reported that the National Coffee Association(NCA) surveyed 3,000 respondents in 2018. The study showed only 9% of Americans ordered coffee online. The remaining 91% of respondents preferred to buy gourmet coffee at their local cafe.
Why buy coffee at a café?
To bring the best parts of an in-store experience to the online market, it is first important to understand the reasons for purchasing coffee at a your corner shop, grocery store or supermarket.
Surveying occasional coffee drinkers, daily drinkers, baristas and roasters, we noticed some consistencies.
Delivery fees
An overwhelming 60% of people surveyed expressed the cost of online delivery to be a primary deterrent. If provided with an option for curbside pickup, they preferred it.
E-commerce industry leaders address this by offering monthly subscriptions to absorb shipping costs. Some consumers regard this expenditure as unneccessary.
Due to recent recent health concerns, the option for in-store pickup was excluded from the survey.
"If I can pick up my coffee from around the corner, I wouldn't subscribe to a monthly delivery fee."
Try before you buy
25% of those interviewed expressed the need for sampling before commiting to on a bag of beans or grounds. Purchasing a cup of gourmet coffee at their corner café allows customers to try a blend at its best.
Customers prefer smaller quantities or free sample sets to be made available online which could subsitute their walk down to the café.
"I know it's not as easy as sampling at a gelataria, but it would be nice to experiment with different roasts before commiting to beans."
Barista recommendations
The recent dependance on a handful of online retailers has 25% of our survey pool upset about limited options. These consumers prefer to recieve their coffee recommendations from their local barista or a friend.
With so many blends and flavor notes to choose from, personalized recommendations are critical to them. The same pool seemed hesistant to trust automated online five-star rating systems over what's freshly brewing in their own neighborhood.
"It's not just the flavor; my budget matters too. My local barista knows my limits and tailors to my caffeine needs accordingly."
Delivery time
Another 30% of consumers cited freshness as a prerequisite. Beans have their best flavor 2 to 10 days after being roasted and can stay fresh for up to 30 days. Given this limited time frame, shipping times are crucial. The option to verify the roast date of the coffee is rare when purchasing online.
Some consumers who are not habitual coffee drinkers prefer to purchase beans, grounds or brewed cups using curbside pickup over a 1 to 2 day shipping period.
"I don't want beans that have been sitting in a warehouse a month past their roast date, even before I order them."
Trying new flavors
Baristas, roasters and some coffee drinkers are not tied to one blend for a long period of time. Consumers see coffee as an opportunity to explore different notes and with limited third-party vendors selling on large e-commerce platforms, their choices tend to be equally limited.
This agility requires larger retailers to cut red-tape and leads locals to check out the featured menus at their corner cafés instead.
"I am, by no means, a connoisseur. I am an explorer. And so, you can't tie me down to one blend."
Is it just the coffee?
Restaurant recommendation platforms, such as the New York City based website, The Infatuation, caters to varying customer needs.
Outside of purchasing gourmet coffee, these include cafés as venues for meetings, dating, studying and food.
As cafés and restaurants struggle to reopen due to the coronovirus pandemic; we can also investigate how a platform could host future public gathering with social distancing in mind.
Who's the competition?
As we begin to think about the web precense of a local cafe, it's important to identify the coffee e-commerce competition and compare the features of their services. The categories we will use include:
Catalog, Product Information, Custom Subscription, Coffee Match, Shopping Cart, Company Profile and Samples.
Let's take a look at two of the leading competitors in the current e-commerce catered coffee distribution market: Trade and Bean Box.
While the shipping costs are disguised by Subscription Fees, Bean Box offers you some customization.
Trade follows a similar strategy but is far more effective in their Coffee Quiz.
2\ Define the user
With a better understand of the market's current climate, it is integral to filter possible design opportunities through the lens of the user.
Some features created by competitors are designed for mass market consumption. For our study, we will focus on digital delivery at a local level to maintain quality coffee distribution.
Empathy mapping
How many times will locals check-in for barista recommendations? How often will they cycle through a variety of roasts? How much customization can a subscription provide?
Without a human-centered design experience, a digital platform cannot function effectively. In the case of coffee, it is important to provide option sets that tend to the needs of a daily, weekly or occasional coffee drinker looking for fresh and local brands.
Let's meet our user!
Based on the research, a persona was mapped to illustrate categorical motivations, frustrations and ambitions for local coffee delivery.
Chloe misses her local cafe during these trying times, however as a working professional, she needs her caffeine to remain productive. She hopes to help her corner coffee shop however she can and is excited for it to return as a hub for events, meetings and her studies in the near future.
3\ Ideation
The intent here to is to bridge a host of coffee drinkers and café goers using a holistic website layout. It is critical to address e-commerce features with a platform catered to the neighborhood.
Site mapping
The goal for this product; to limit any interactions outside of a single page whenever possible. While subsidiary pages hosting terms and agreements may link to a third-party descriptor; the primary features will exist using a single interface.
Supplementary components, when overlayed, should maintain a curated customer experience, inline with the feeling of the small business café.
Keeping your data safe
During this period of uncertainty regarding the procurement of user data for distribution to advertisers, we must be cautious when taking Coffee Match Quizzes.
Applications such as 03 World, require access to your social feeds in other to refine a digitally simulated barista, which in-turn recommends roast flavors and strengths.
As data privacy laws become more stringent, it is critical to avoid designing a platform that is dependent on harvesting user information for an algorithm.
4\ Design
Identifying all the motivations, aspirations and cautionary tales from competitive products and user personas, we will begin building our product in two stages prior to user testing.
A low-fidelity mockup will serve to roadmap the user's journey. A high-fidelity prototype will animate the user's journey.
Wireframing
To choreograph this digital product with e-commerce and café culture simultaneously, it is important to provide both options sets at the introduction. The UI Kit will homogenize both instances that share the landing platform.
Leading into the events schedule, the hope is to keep the product compact with minimal use of overlays and same-screen interactions. The user should feel they are not clustered with a myriad of additional windows and tabs.
Agile Testing
Using Figma's built-in prototyping structure and graphics library, we were able to simulate the customer's experience from the landing page and cycling through the week's featured specials. The prototype further leads into the featured events for the week with an option to subscribe or upload art and music work for gallery consideration.
The coffee match overlay is currently being designed and tested. It will follow an overlay strategy similar to the shopping cart and checkout overlay.
5\ Prototyping
The agility of this product to adapt on a weekly basis for updates is an opportunity for DTUT Café to advertise sponsored products such as Irving Farm, Eli Zabar and other New York City based food retailers.
The updates to event schedules will also serve to keep the website current.
Hours and Location
At the hero image, one is introduced to the experience with several option sets. The subtle tabs lead to hours of operation and the address. A map will feature in a future update following suit with the pop-up animation theme.
Featured and Contact
One is able to cycle through thr Barista-approved products in a featurette themed catalog. This presents an opportunity for DTUT Café to highlight discounted prices and limited time products.
Shopping Cart
The minmal overlay provides drop-down option sets for each item, allowing for customization of the order within the shopping cart itself. Any items added from the full menu will automatically update as well.
Events Schedule
The intent is to exude a community pin-up board feel, as one would in a café or similar communal space. The organic nature of this layout allows for unlimited blocks to be added for upcoming events.
Upload your Art
To avoid a seperate window or tab to submit art to be featured at a gallery night, or musicians to showcase their talents; the submission dialog exists at the footer of the product. The equal hope is to illustrate DTUT Café's commitment to the creative industry.
7\ Meet the Team
Hi! This independent research study and prototype comes at a time when our global society is at an economic stand still.
In times like these designers and innovators need to come together to reinvent strategies to revitalize our communities.
Farhan Mian
Product Designer
Special Thanks
Corey Lopez-Thomas | Brittany Crowell | Emma Tax
FARHAN MIAN
User Experience Designer
User Interface Designer
Architectural Designer