My role
UX Design/Research
UI Design
February - April 2021
Quick peek of whats to come....

Video recording of hi-fi web prototype

Video recording of hi-fi mobile prototype

The problem
Dublin city has over 70,000 apartments and growing, people with little or no gardens can feel that growing vegetables is not an option for them.
The opportunity
The seed lab is a place users can browse a variety of seeds that can be grown indoors or on balconies with an interactive visualisation that allows the user to visually see when, where and how to grow the chosen seeds.
The Goal
To create an accessible and immersive e-commerce experience for inexperienced planters with an easy to grow guide for indoor growing.
The process
Lean UX Cycle - Think, Make, Check
User Survey Results (All participants aged 25-35)
Key Findings from user survey 
Online Lab Book
No one from the survey uses books to find out information… So instead of selling books on the website like some of the competitors, I will offer the users an online Lab Book to answer their planting questions. 
With 81% of the targeted audience not having a garden it is essential that the seed lab targets this audience ensuring that all the seeds sold would be able to be grown indoors. With the option of buying customised seed boxes that provide the user with compost discs and biodegradable pots so they can get started straight away!! 
72% of the participants either have never tried to grow seeds or else tried and failed, 100% of these people said they would like to try to grow their own vegetables if they were shown how to. For this reason, it is important that the seed lab does everything they can to make this a successful experience for the user.
Competitive Analysis
Competitors Site Maps
Feature Prioritisation
User Journey
Make / Check
Experience Map
Business and user goals
UI Patterns for e-commerce
1 Have a flexible sign in. 
By providing the user a “lazy sign in” option via Facebook or Google this allows the user to buy products quicker and therefore meaning and increased likelihood of the user completing a purchase. 

2 Browse by product category. 
This method reduces cognitive load and helps the user to find what they're looking for within a very short period of time.
Instead of showing all products at once I have separated them into fruit, veg and herbs, and on the app a further category of sun, shade and both have been made available so that the user is informed of what environment to grow the seeds in.

3 Having different CTS at different user stages 
Call to action buttons for example add to cart and buy now allows the user to either buy a handful of stuff or if the user wants to buy one specific item immediately. It is also important to give these buttons different hierarchies to guide the user to make the default action. 
4 Providing top tabs for specific product screens
According to material design top tabs should be scrollable with the same level of hierarchy.

5 Check out progress disclosure 
Progressive disclosure is about showing the right amount of information at one time it reduces the cognitive load and complexity of the users tasks. A progress bar is a great way to show the user the sequence of steps of a check out it shows them where they are and encourages them to continue till the end of the task.
Mobile (Design for mobile first)
Information architecture for mobile
Site map for mobile
Sketching / paper prototyping for mobile
Low fidelity prototyping for mobile
First round of usability testing for mobile
Further Research After feedback
UI tab principles & bottom nav menu 
App onboarding
Final Information Architecture
Second round of user testing for mobile
Hi-Fi Mobile:
Access prototype below:

Designing for Web
Information architecture for desktop
Site map for desktop
Sketching / paper prototyping for desktop
Low Fidelity prototyping for desktop
First round of user testing 
Changes make after user testing
High fidelity prototype for desktop
Final Information Architecture
Second user testing on desktop prototype
Hi-Fi Desktop
Access prototype below:

This prototype was also partly built by me, using css, html and javascript, it can be found here:

You may also like

Back to Top