Just Vertical
UX/UI Design
Vision & Scope
Just Vertical’s simple yet clean idea of their state of the art ZipGrow FarmWall can grow anything, anywhere, anytime. The goal for the company was to bring this unique concept forward in the most effortless and straightforward way possible so that people get it the minute they land on their page. The goal and the plan was to change their existing text savvy layout of the website into a more visual one, also to better structure the information architecture so the user is able to easily navigate through the website without getting lost.
Design Approach
User Survey:
48% were interested in growing their produce at home.
40% were not familiar with the concept of vertical gardening.
Most people feel eating local and organic produce is important.
Reasons for not gardening at home: No Space, No Time.
User Interviews (insight)
Schools were interested but weren’t sure to include this in their curriculum.
Most important features are: Value, Ease, Clean Eating (Organic, Local).
Restaurant owners liked the idea but didn’t find it beneficial to their restaurant because of their high volume of customers and large scale servings every day.
Maintenance and taking care of it was a huge concern but they were open to exploring and experimenting with the idea.
RESEARCH
Comparative / Competitive Analysis
User Story
When I’m ready to place an order, I want an easy way to select and review my items, so I can purchase them.
When I go to Just Vertical, I want to understand the product, so I can decide how it relates to my needs.
When I consider a vertical garden, I want to see a cost/benefit analysis, so I can make an informed buying choice.
When I consider purchasing a Just Vertical Garden, I want to understand the setup and maintenance process, so I know what to expect.
Persona
User Scenario
SETUP
Sarah (23 year old / Grad Student) loves local, organic and sustainably grown produce but she spends too much money on food -- especially for the healthier options she prefers. Maintaining a garden in her tiny apartment annually is not an option and she loathes walking city blocks to go grocery shopping when it’s 5 degrees outside. Sarah looks online for alternatives to the grocery store or a CSA (Community Supported Agriculture) and she lands on Just Vertical.
HOME SCREEN
Sarah sees a photo that shows a Just Verticle’s product in an ideal context with a tag line explaining what it is. Sarah is elated. She thinks this might work for her but wants to know more. She scans the Home Page and reads about the features and benefits. Sarah is so impressed with the information she sees and goes to the...
ORDER PAGE
Sarah reviews her many options and chooses a product that best fits her needs. Finally, Sarah reviews and places her order with her Credit Card.
Customer Journey Map (existing website)
Users got confused about the product and kept referring back to the FAQ page.
Users also weren’t able to learn more about the product because they kept skimming through the info.
The check out section was a comfortable process except when it came to filling out a long form.
PLANNING
UX Design Goals
To create a simple and navigate-able site like Thistle.
Clarify and define the product/service of Just Vertical.
Educate buyers to the benefits of Vertical Gardening.
Create awareness of the social good of Just Vertical’s goals.
Use of less text and more pictures/icons.
UI Design Goals
Design Inception
Mood Board
Style Guide
DESIGNING
Mid vs. High Fidelity Wireframes
Home Page
Easy 3 Step Process
Order / Delivery Section
Choose Your Plan
Company Mission
About Page / Social Proof
Testing
Login
JustVertical
projects.invisionapp.com
Summary
We conducted the data and contextual inquiry from our user research to figure out the best suitable design for Just Vertical. Both UX and UI collaborated together to transform the existing website, our goal was accomplished by creating a simple MVP (Minimal Viable Product) for our client and by organizing the information architecture of the overall website. The next steps after this would be to keep testing the final prototype to see how easy it is for the users to navigate through their website, and then bring the changes and improvements onto version 2 high-fidelity prototype after A/B testing.