Product Design Case Study
George Howell Management App
Today we have a prompt from Sharpen.Design to create a management app for a coffee shop in Boston. For this case study I researched the most popular independant coffee shops and landed on George Howell, which is a popular roaster in the area with multiple cafes.
George Howell Coffee has an online storefront, which I visited to borrow some basic colors and brading identifiers to align this app with their image. I'm also using the open source front-end framework PrimeReact, and their Figma design kit for this app.
DISCLAIMER: I am not affiliated in any way to George Howell, or any of his roasters or cafe locations. Any logos, products, or imagery shown all belong to their respective owners and are merely shown for the purpose of education and discussion. Any interface mockups that use imagery of the George Howell logo or other assets are done by myself without compensation as a personal project and not for profit.
Client /
Case Study
Role /
Product Design
Agency /
N/A
Year /
2026
Taking a look at the official George Howell Website, we can see their use of color, layout decisions, and what the customer experience would be like. To create a management app, I have to consider these ideas while creating an internally facing application. To do this, I created a site map with the sections I believe a coffee shop manager would need.
Here we can see I'm planning for the app to have 4 main sections.
-
A landing page section with a summary of the data from the other working sections, and a navigation element to connect the user to the following working sections
-
A staff management page with employee info, schedules, and shifts.
-
An inventory manager, with checklists, prices, and thresholds for when the user needs to order more.
-
And finally, a bookkeeping page. Which is essentially a ledger of incoming and outgoing financial matters.
Now with the basic ideas in mind, lets create wireframes of these pages.
In the above wireframes, I include both desktop/tablet size mockups and mobile sized as well to force me to make responsive UI decisions. I always do this so I can gurantee the UI works on a phone before I get too spoiled by full screen real estate.
The primary structure of the landing pages for all sections will be large clickable UI at the top like graphs or images of employees or products, followed by detailed lists that when clicked, will launch into a more detailed management UI. I will flesh these out in the High Fidelity Mockups, as well as begin to use the components from PrimeReact.
Now that we're adding prime components and colors to the UI, we can see the ideas start to take shape a little bit. I've included an inventory stock meter that shows the top 5 lowest stock items at a glance, and have color coded thresholds. The sales chart tracks spending to see how much we are over or under budget at any point. And the employee list shows all employees, their status, and what shift is currently working the cafe.
Here we have the Inventory Page of the app, where we have a list of retail and kitchen supply items. These also have settings for images, prices, and amounts considered Low and Critical totals during inventory checks.
On the Employee Roster page we have a LOT going on. At the top of the page we have a daily schedule table in a layout inspired by a teams/slack calendar, and for this I repurposed a deprecated calendar component from Prime, and converted it to hours instead of days. Below that we have 2 lists, one of the on duty employees and their status, and the other including off duty employees and their next shifts.
On the employee details screen we have their profile data, as well as their weekly shift schedule. Since these tables are quite data heavy, I have them horizontally scroll while centering to the current hour on load in the mobile sized UI.
Here on the ledger page, this is an automatically populated page showing outgoing and incoming sales. The budget is set at the corporate level, so thats not something the manager can control, but having this information can inform them how their cafe is performing, and where their money is going.
So, now that you've seen all of the apps sections do you think this would be a useful or effective tool for cafe managers? Do you think there should be more available sections for managers? Are there any adjustments you would make to the UI, or other components from the Prime Library that could serve the user better than what I chose?
If you liked what you see here, or have critiques, I'd love to hear from you!
Thanks for reading.