Patch's mission is to connect people with the right plants for their space and lifestyle, and a support system to care for them properly. They know that many people buy plants to make their houses a home, or to increase productivity in the workplace, but the joy the plants bring is short-lived as they often die. This can happen because of lack of education on how to look after them, or that they were never going to be a good fit for the space people have put them in.
I worked with Patch when they were about 3 months old to refine their original MVP. They had created a questionnaire to understand people's needs and had assigned manually-created collections to people who then were invoiced if they were interested in buying them. Patch had proven there was value in their idea, but now needed to scale it, fast.
These are snapshots from my Sketch files for this period of time. We wanted to create collections based on light levels, amount of space and what people said they wanted in terms of style. We also needed to make the website fully transactional, to take the pressure from team members pushing every sale over the line via phone (a tough task when your start-up is only 3 people!). This meant it needed to conform to some traditional e-commerce patterns to make it feel familiar and safe for customers and be a quick build, but also tackle some fresh problems. For example, teaching users about the language of gardening, assigning plants to particular pots and discovering if they need help with compost and watering were areas of focus.
We also had to make sure that what we built at that point could be re-used in other circumstances, for example when they sold Christmas trees or Valentine's collections. I kept a modular approach that allowed product, collection and information cards to be swapped in and out of the same space. We used Flexbox to create responsive cards.
After spending a lot of time reading through Intercom messages and finding patterns in user's interactions and frustrations, I also advised the founder, Freddie Blackett, on things like consistent shipping messages on all pages, natural human language to set brand tone, easy-to-locate contact information and omni-present terminology cards to help customers get their answers, fast.
I was part of a product team formulated to help Freddie's start-up get off the ground. I worked closely with front- and back-end developers to test assumptions and deliver results at pace. Visual designs are by Seth Matisak and photography is by Ross Brind.
Arcadia houses 7 international fashion brands, which all have both a digital and physical brick-and-mortar presence, selling in over 3000 stores worldwide (including concessions). Getting people to span across channels is hard enough, but it's significantly hindered when they can't locate stores - Needless to say, an easy-to-use store-finder tool is absolutely paramount.
Knowing many of our users will be searching on-the-move, we needed a mobile-first locator which uses the Google API for the most seamless navigation integration, dynamic opening times and accurate directions. It spans the whole world, and for users who don't have a store in their country, it doesn't dead-end the journey, but has images, CTAs to shop and a Spotify playlist of what is playing in-store right now.
We knew from testing and customer feedback that users aren't just searching for their nearest store, but often seek a shop that houses specific lines, amenities or a collect-from-store option. We allowed for users to search however they want, to get them the result they need with the least amount of friction.
This project spanned the requirements of all the Arcadia brands, which meant there was a lot to combine. Using native functionality and leaning on familiar behaviours meant that all devices and all browsers embodied an optimised experience, and therefore delighted a wider audience.
UX | Journey Maps | User Flows | Store Finder
Each season, Topshop.com houses a hub that's packed with all things Fashion Week - including their own high-end collection, Unique, and a live-stream to the Unique catwalk show.
Making sure that this hub is full of interesting content to pull users in, and has an intuitive way of navigating between sections is essential to hold their interest. This hub uses a modular approach to allow the insertion of any type of fresh content, and swiping features to keep readers on-site.
UX | Fashion | Campaign | Wireframes
A complimentary and bespoke Personal Shopping experience sets Topshop apart from its competitors, but booking an appointment was an arduous experience when users couldn't see availability and had to wait for a response to their request via email, which could take days.
We worked with Clientela to plan, design and build a responsive live booking tool that not only enables users to book immediately but also allows them to add personal style information, like their sizes and tastes. This means the Personal Shopper spends less time on the shop floor and more time with the client, having prepared a range of outfit suggestions before the appointment even begins.
Users can book for themselves, for a group, on behalf of someone else, and for someone as a surprise, and can choose between in-store or Google Hangout appointments, and full or express sessions too.
UX | Journey Maps | Booking tool | Responsive
See the original pitch prototype here
The purpose of this brief was to highlight relevant information and features to showcase the property on the booking page in the best way possible. Particular focus was placed on making sure the user understood they were dealing with a host and not booking from HouseTrip directly, to help solve an on-going business complication.
It was important that the guest can see different prices as well as any special deals available. It was integral that images were tagged so that users could determine different spaces within the property.
I used some previous experience I had from working with customer reviews to highlight key phrases which would help users skim and quickly conclude whether this might be the place they want to stay.
UX | UI | Booking tool | Website
Flags! is an educational app built with my friends Edwin Bos and Chris Patuzzo - our first project as The Making Collective. It started when we were thinking up how people might draw a flag to represent the whole world, and then moved on to competitive flag drawing, and testing people to draw flags in a quiz format.
Eventually, this app will be just that: A way to improve your knowledge of all the flags of the world and play games and quizzes by drawing and colouring flags. My role in this project was journey mapping, wireframing, branding and creating the visual assets.
UX | UI | App | Quiz
The Topshop Gift Edit is a way for people to find the perfect present. Complimented by beautiful studio shots, we created a card-based grid that could be populated by video, image or text to showcase the Christmas range. Users can add things to their 'Want List' and export the list as a shareable GIF to drop heavy hints about what they want this year. Clicking on a shared GIF link takes a new user to a product listing page of all the items the sharer wished for.
UX | Journey Maps | User Flows | Personas
See it in action here
Topshop's bread and butter is the range of jeans it sells, but what if people don't know the difference, or which ones to get? Getting something that fits and suits you is hard enough, but throw into the mix that you're buying it online, and it seems almost impossible.
With no development budget but a large amount of information to get across to help these users, I created a flexible hub that includes imagery, video, fit guides and social proof to help consumers make the best choice for them. Working with data from the Analytics team, I created personas, journey maps and wireframes to capture the most useful (and SEO-friendly) information to help match people with the jeans of their dreams.
UX | Journey Maps | User Flows | Personas
See it in action here.
Uscreates are a strategic consultancy who deliver social value; Their objective is to empower people to create positive social impact.
I worked with them to collate all their wealth of knowledge into an interactive toolkit, which includes case studies of brands they've worked with and a pack of assets to help measure social value within your own business.
Interactive PDF | Toolkit | Social value | Multimedia
Working with an ecologist and some copy writers, under the management of Anya Dimelow, I created the original style and templates for a project which endeavours to educate children on the impacts of their actions, and the wonders of our planet.
We tested the sample magazine with children between 7 and 11 years old. The magazine contains workbooks and puzzles to encourage them to learn and engage.
We got funded through Kickstarter to produce the first issue, which I designed and illustrated. You can track the project's progress on the website (designed by Katy Carlisle), Facebook and Twitter.
Print | Fundraise | Magazine | Layout
All seven Arcadia brands are undergoing a big change, with a renewed focus on customer experience. Each brand was given the same functionality and wireframes to follow, but had the freedom to create their own graphical interfaces to apply to their brand. The designs covered product listing pages, promotions, product description pages, mini-bag, wish-lists and bundles.
I worked with Aron Jones to create fresh, user-centric, touch-friendly designs to bring Topshop into the present.
UI | Branding | Refresh | Website