Role:
UX/UI Designer,
Design Team Lead
Year:
2024 (in progress)
Platform:
Desktop, Mobile
Creating a Mom-and-Pop Shop’s first website
Island Savoy Market (ISM) is a neighborhood grocery, deli, and café in San Francisco, CA. After finding local success, they are looking to expand their reach and improve their customers’ experiences by creating a website that will allow customers to learn about the Market, order from the deli, and more.
As UX/UI designer, I conducted competitor and user research, formed user stories and flows, created a basic design system and wireframes, and finally designed the website itself through Squarespace website builder. Designing this website is a unique challenge in that it must not only be easy for users to navigate, but also for the ISM’s owners to edit and update by themselves. Therefore, the final design must balance simplicity with the complexity of the business goals
Research & Architecture
Inspiration from competitors
User Goals
Competitor Patterns
clean, simple layouts
photo-first design
minimalist, professional color palettes
Learn what ISM is and what they sell
View ISM’s deli and café menu
See what groceries ISM sells
Conclusions
focus on use of photos to tell a story
create straightforward user pathways
Order from the deli Online
Find ISM’s address/contact info
Learn about upcoming community events
User Flows
As this was their first website, at this stage the client was not yet sure exactly how they wanted their website to be structured. After discussion, we created two flows to cover the three tasks that would most increase sales at the market itself: viewing the menu, ordering food online, and viewing upcoming events.
Design System
Design elements were chosen to match ISM’s physical branding as well as their business attributes: welcoming, responsible, and professional. Color contrasts and font sizes were established early to ensure accessibility to all users.
Wireframes
Landing page immediately includes links to sale pages and a short introduction to ISM.
The grocery page highlights products and brands being sold in the market.
The menu page includes both the deli and café menus as well as links to order from online from the deli or reserve a Thursday Night Dinner.
The Events page lists upcoming community events being held at the market and allows users to register.
The About page is a space for the owners of ISM to share their story and promote the local charities and businesses they work with.