1. Research
Problem Statement, Analysis, Interviews
2. Visual Research
Moodboard, color palette, typography & assets
3. Interface Design
User flows & visual design
4. Design Delivery
Style guide & prototypes
5. Development Process
Quality assurance through user testing
1. Research
A. Problem Overview
Tropical Treets is an established all-natural juice and ice-cream manufacturer in Toronto, Canada. With the success from their sister
company, Happy Pops Inc, Tropical Treets is looking to improve their online presence (website) and prepare for future ecommerce
opportunities.
company, Happy Pops Inc, Tropical Treets is looking to improve their online presence (website) and prepare for future ecommerce
opportunities.
B. Problem Objective
To better understand the competitive market, uncover best practices from similar companies and determine the best option for a website hosting platform. Research was conducted with the following strategies:
1. Platform Analysis
2. Competitive Analysis
3. Stakeholder Interviews
4. Customer Testimonials
5. Heuristic Analysis
2. Visual Research
Our inspiration(s) for this design project were organized into a Mood board that we though would wow our client and their users alike.
— Mood Board —
— Proposed Site Architecture —
3. Interface Design
We narrowed down our individual selections to three Shopify for our client to choose from. We presented our clients with the features of each as well as the pros & cons. Finally we asked them to make a final selection and set up a new Shopify account.T he Brooklyn theme was chosen.
— Template Options —
— Content Creation —
We were able to extract a high-res logo and other relevant assets from packaging vectors and pdf's. I was then able to create product shots for the ice creams using high-res commercial mock-ups.
Product Mock Ups
Header & Slider Images
4. Design Delivery
Post haste, we started on the site using the CMS. All things considered, I'm happy with the site we produced.
— Style Guide —
— High-Fidelity Wireframes (Screenshots) —
Home Page
— We opted for a traditional header structure with a menu to the left and pages to the right —
— A full width header slideshow showcasing our three main products types: Ice cream, Juice and Kulfi —
— Two product grids – one for the product categories and one for individual ice creams —
— An opt in form for our email newsletter and after this we list the company’s corporate services —
— A carousel displaying Google reviews —
— A google map showing the factory location —
— The footer itself contains a sub menu, social media links and methods of payment —
— Throughout the design we used tropical and fruit inspired textures, photos and patterns for artistic effect—
— A full width header slideshow showcasing our three main products types: Ice cream, Juice and Kulfi —
— Two product grids – one for the product categories and one for individual ice creams —
— An opt in form for our email newsletter and after this we list the company’s corporate services —
— A carousel displaying Google reviews —
— A google map showing the factory location —
— The footer itself contains a sub menu, social media links and methods of payment —
— Throughout the design we used tropical and fruit inspired textures, photos and patterns for artistic effect—
Product Categories
We tried to make our product pages as clean as possible:
—We generated our own high res mockups and used existing packaging to showcase
—Pricing is clear and so is the product info —
—Pricing is clear and so is the product info —
Ice Cream & Kulfis
Individual Product Page
Product Category
Tropical Splash Juices
Individual Product Page
Corporate Pages
We made sure that our corporate pages werre clean as well:
— Drop caps and blockquotes were used to break up text and emphasize important details —
— Our Story contains the company’s origin story as told by Rumi, the owner —
— About Us has an embedded a YouTube video —
— Finally, we have a page dedicated to store locations —
— Drop caps and blockquotes were used to break up text and emphasize important details —
— Our Story contains the company’s origin story as told by Rumi, the owner —
— About Us has an embedded a YouTube video —
— Finally, we have a page dedicated to store locations —
Our Story
Services
Store Locator
Contact
