Leaf Me
Leaf Me is an e-commerce website for new and aspiring gardeners. It provides easy-to-care-for plants, modern and sophisticated planters, and simple tools to help create a beautiful home environment, without requiring heavy maintenance.
Company sells plants from native flora and planters from local artisans and aims to introduce people to the joy and relaxation involved in the art of gardening.
view prototypehere
Role
- UX Designer
- UI Designer
- Branding
- Coding
Team
- Daria Ershova
- Isabel Kelemina
Tools
- HTML/ CSS
- Adobe Suite
Problem space
Our team of 2 was challenged to create an e-commerce website for a web design class at SFU. We conceptualized, researched, designed, and coded a website that helped gardeners choose and order plants, pots, and gardening tool. We created an imaginary brand, Leaf Me, a zen inspired plant retailer that promotes gardening to offset the stress and hassle of daily routines and aims to create a community of loyal customers by holding regular workshops and events.
Brand statement
Unique plants for unique experiences
Brand Value
Local
Easy
Unique
Brand Mission
- Inspire people to create gardens and green spaces from native flora
- Introduce people to the joy/relaxation involved in the art of gardening
- Help create beautiful environments that they can enjoy year round
- Make gardening more accessible to everyone
- Promote respect for the environment
Layout
I intended from the beginning to have a lightweight and clean grid system that gives us the flexibility to work with a wide range of categories and make text comfortable to read for our audience.
Responsive view
We aimed to create design that would look good across different browsers and devices.
As the user switches from their laptop to mobile device, the layout should automatically switch to accommodate for resolution, image size and viewport.
BRANDING
In terms of branding, I wanted to create a visual style that can be replicated on different mediums, from the UI to physical print.
CORE EXPERIENCES
Based on our audience’s needs, values, and goals, we decided to focus on three core elements within the platform:
- Landing page
- Item view
- Checkout flow
Landing Page
To address the discovery of projects, we decided to limit a number of categories shown on the landing page. This way of organization lowers the cognitive overhead for beginners to browse projects as no prior knowledge is required to get a sense of what’s in the platform.
We wanted the discovery experience to be very minimal, in which it could entice our audience’s curiosity through beautiful imagery.
Item view
When looking through the catalog, you can view more details about a specific item by clicking on it. The item's detail page will load with more information about it and a purchase option.
Item pages also allow you to explore items in-depth in a variety of ways. For example, it integrates a photo gallery of visually related items. Customers are also allowed to provide feedback, thereby creating a social environment where they can share the best plant care practices and learn from each other.
Checkout flow
For the e-commerce checkout flow the key goal was to display cart contents well and make every step visible. We wanted to make it easy and obvious to understand what’s in the cart and what’s the final cost including shipping and taxes.
Progress trackers displays progress through a sequence by breaking it up into multiple logical and convenient steps.