The Project
For one of my class projects, I was asked to put together an interactive product catalog. The assignment was to work for a company that sells physical goods and has been tasked to design an interactive product catalog. We were able to choose a real company; I picked The Sill. The Sill is a company that sells house plants based in New York City that has locations all over the east and west coast. I wanted to create an iPad focused app that would surround the idea of purchasing the plants and use their beautiful plant photography to help educate and inform the consumer on house plants. Since house plants have become such a rage these days, a popular subject to talk about is how most can’t keep their plant alive. The first step, work through the overview and planning.
Overview + Planning
While planning out what I wanted to do, I did an in-depth search of the brand — mainly on their website, but also across all social media channels — to find inspiration, understand the brand better, and learn how they style their images, colors they consistently use, and photography that stood out to me.
From there, I was able to start sketching out what I wanted the app to look like. I took aspects and stylings from mobile to get the app feel rather than a website. I went through other stores with apps that I’ve always enjoyed using and found ease when shopping and checking out. The apps that stood out to me the most were Daily Harvest and Starbucks. Although I wanted to give the app a new look, I tried to keep it close to the existing website to keep consumers familiar.
Development
For development, I used Adobe XD. I started by bringing in my research, the existing website and created iPad sized artboards. I start designing and mapping out images and text I wanted to see when you first opened the app. I identified the colors that The Sill and tackled the home screen. Something I wanted to start identifying was the use of their green color. Since this isn’t a website on a desktop, I couldn’t use it as a hover feature, so I had to start getting creative using it. I want to include it but not overuse it!
After starting to map out the pages, I was then able to collect assets like images and text for each page. Once I was in a good place, I began to plug everything in. This part is my personal favorite because things start to come together, and an actual app exists. The app consists of 4 main navigation pages — shop plants, accessories, plant care, and weekly workshops. You also have the feature to go back to the main home page by clicking The Sill logo or logging into your account, or going to your bag.
Highlighted Features
A feature I wanted to include was the Plant Care page. This page is dedicated to informing and educating a consumer interested in house plants but doesn’t know how to take care of them or wants to find out more about the plant they just bought. The page is organized in alphabetical order with the most common and rare house plants. Not only is this feature helpful, but it also keeps the user staying on our app looking for information or coming back to our app to educate themselves.
Another highlighted feature to keep users educated and excited about The Sill is the Weekly Workshops that The Sill offers. These are paid workshops that inform users that are interested in getting and gaining help from professionals in a section that is interesting to them.
Final Thoughts
I was able to style each page to create a basic working prototype That could be handed off to a developer. I’m thrilled with how things came out, and I’m proud of the final product. I think it truly embodies the brand that The Sill is and allows users to purchase and educate, and excites the consumer.
Check out the working prototype
Plants Make People Happy
— The Sill
