Gail’s Design systems
Gail’s business change
During Covid Gail’s decides to start offering their products and catering services to individuals and small groups, in order to replace the services they provide to offices only.
My job is to bring this experience online and to create an accessible e-commerce service.
Creating categories
The first step is to understand how many products, prices and images need to be included in the website. I meet with stakeholders to address this and I create a large spreadsheet describing products and prices.
I categorise all of these as these are the products that most of the customers consume.
Understanding the customers
I visit several Gail’s bakeries and interact with customers to understand their needs. Offering free coffees and early bird access to special bundles, was a way to get customers involved in providing feedback and becoming participants in testing sessions.
Designing site architecture
Once I finish creating the categories, I am able to dive into the website structure. Menus, featured products and offers are positioned at the top to provide a clear hierarchy for better customer visibility.
NEW
components
There are several new components and styles that need to be introduced.
I create the Gail’s design systems to keep all information about assets and rules on how to use them well documented.
Easier implementation for devs
I use Figma to build the design systems as it is the best tool for documenting, sharing and managing the hand over process to developers.
NEW
features
Search is vital for several customers, so I design a search layout that is easy to use while displaying accurate results and suggestions
Results
I test the entire e-commerce flow with current customers and share it with stakeholders in order to get feedback.
Based on quantitative data I see there is a 13% increase in Click and Collect sales and deliveries of hampers and breakfasts are 33% up compared to Gail’s previous sales.