About me
My Work
Say hi
Wish ATL
The Details
01.
A new kind of
e-commerce

Any general search for online consumer shopping habits and you’ll quickly note 
the frustration referred to as “tab hell”. A buyer browses an online store, opening up each item that catches their eye in a new tab to sift through later, a pattern that isn’t optimal but something that most of us still do. The online marketplace is also inundated with products and a simple Google search for Nike sneakers will yield millions, if not billions of results. Right from Google, before a customer even opens your site, they’re opening up several other websites simultaneously and browsing that same product across many other stores. Our first challenge, how do we keep customers engaged in Wish ATL and focused on the products on Wish’s site? How do we give them exactly what they’re looking for here and now and allow them to forget the other seven open tabs?  This is a challenged faced by many retailers today yet most stay true to the tried and tested patterns followed by all online stores, Wish ATL was trying to change the norm and lead the way to trial a new way to shop online, willing to learn and iterate as we went.

*

"This happens every time. I have never encountered an online shopping site that effectively deals with the issue of having to open products in separate tabs."

*

An audit of the current website experience

Knowing that we had an engineering team ready and waiting, I did an audit of their current site taking into consideration our goals for this project and improvements we’d need to make along the way, providing both short and long term adjustments that we’d need to make. For example, customers could only purchase a single pair of sneakers, however there was a quantity field on the item that allowed them to check out with multiple, regardless of the design direction this was one of the many interactions we needed to update. This helped prevent both our customers from feeling frustrated that their order was cancelled and saved employees time in having to cancel an order and explain why to the customer.

Existing experience
The existing experience lacked the uniqueness and creativity of the brand and it's in-store experience, repeating information and layouts between every page and quickly becoming static and losing a customer's interest.
How do we keep customers engaged with wish atl and loyal to the brand?

In parallel with the designs, Wish ATL was also trialing a rewards program to keep customers returning to the brand. Events themed around the next sneaker drop tend to attract celebrities and influences from across the country, meaning they were the place to be seen at for customers but also, events were sometimes the only way you could guarantee yourself access to the product being dropped too. Given the exclusivity of these events, part of the loyalty program planned to reward customers with tickets and presale options for future sneaker drops, keeping them returning to and purchasing from the store. Since rewards were becoming increasingly important for the brand, we explored ways to highlight its importance online too.

*

Where we brought traces of the physical store into the digital experience

Early on in the process I met with the team to walk through the store and experience all the intricies they’d weaved throughout. The blue wave in the carpet was a subconcious path that customers walked along and followed, flowing past the shiny metalic surfaces contrasted next to the overly fluffy display cabinents, the store was previously a library so the staircase is made entirely of books that were once there to be read, going down the stairs is as if you’re going through the books into another realm. There are also subtle illustrations in the wallpaper and a not so-subtle wall decorated with thousands of shoelaces, hiding the entrance way to the back office but also reminiscent of a tv screen and the pixelated view you’d see once the signal was lost. All these hidden elements (and more) the team had asked to be incorporated into the site, however I trusted my gut and working with them, realised they wanted this experience of finding small easter eggs throughout, with connections to the roots of the city and it’s customers, not a carbon copy from the physical to the digital.

The fitting room & custom backgrounds
We wanted this to feel like it belonged to the customer, that this was their corner within the company. We created a space for them to graffiti or paint the background on top of the illustrations and texture inspired by the physical store.

The blue path is represented in the navigation, the blue colour highlighting where you are and your next step (CTAs) and the various textures throughout the store translated into background patterns, utilising the same illustrations and a peg-board like appearance with both rigid outlines and free form graffiti pens. (The graffiti also paying homage to their physical location, where graffiti artists regularly paint over the side of the store). We had planned for the page to load in pixels too, replicating that of the meaning behind the shoelace wall and when customers navigated between the pages, we’d zoom out, weave through a “story”, and then hone back into a new area of the site, almost like passing down the stairs into that new realm.

*

“You wouldn’t immediately go try on the first item you like in a store without looking around at the other things you may want to try on.”

*

Where we brought traces of the physical store into the digital experience

The fitting room concept was an idea the team was drawn too and committed to trying, with a belief that in the future, this could evolve into an  AR focused experience with customers digitally trying on the products from home. My challenge was how to make this work in a world where AR isn’t quite as accessible just yet. The result was a place where customers could collect and share the items, rotating and resizing items to look at the details of the product and compare and contrast them side by side before adding them to the cart. An experience we hoped could replace the idea of opening multiple tabs to complete the same task. We also wanted this to be personal to the customer, so we introduced the ability to customise/graffiti the background, snapshot items or outfits to share to social media and to pull in previously purchased items to get a sense of how their wardrobe could look. There were multiple closets available too, for example Friday Night, Wedding Attire or Summer 2021 depending on the look or style the customer was going for and these could easily be accessed by an in-store salesperson to help curate and advise customers on new pieces if requested.

Interacting with items in the fitting room
Items in the fitting room are being added to the cart, noting the preselected size. Where we could we tried to streamline checkout, preselecting previously purchased sizes, suggesting colour ways based off order history and saving cart information and preferences.

Given how quickly sneakers can sell out, it was also important that we weren’t creating an additional required step before checkout, meaning adding an item to the fitting room was optional. Alongside this, we also created a more seamless buy now button for customers signed in to their loyalty accounts to allow them to  purchase an item with a single click.

*

Engineering implications and Halting the project

In the end, this result was too large of a project for the engineering agency that had been contracted from the beginning to be able to deliver. Based on early conversations and their portfolio, I had raised concerns to the team but was assured they'd signed a contract and promised they could complete it. We held weekly syncs with the team and documented updates and new requirements regularly, however ultimately the engineering team backed out, stating it was beyond their skillset and they couldn't outsource it further. Unfortunately this placed the project on an indefinite hold which is where it still stands today.

Sneaks

"This is what the future of e-commerce is all about. Breaking away from static web2 experiences to engage the user in new ways & bring them along in the journey". — Linkedin Review
Creative direction
UX & UI design
AI image generation
Video & motion design
Working on an API first product, we often ran into challenges with how we show and explain what our product is capable of, especially to those new to web3 where it can feel like you're learning a new language, or those that are more product focused and not as familiar with developer docs. We wanted to provide a better solution for our customers, and alongside marketing, we designed and pitched this concept, pushing the boundaries of what our team had done previously and taking on a new product build to deliver something truly unique.
Overview
Alongside crafting the brand, I designed the end-to-end flow for customers across both desktop and mobile. Above highlights a few core screens, from our landing page, viewing campaigns, levelling up your membership, viewing and bidding in an auction through to the end, where we recap everything we've done and highlight the connection between web2 and web3 throughout the experience.
Objective *//
Abstract The web3 tech, make it engaging but feel Familiar
Build a brand that is relatable, but that also Embodies the essence of surprise & delight
Create an experience that educates customers on our APis [show, don't tell]
Campaigns
The first part of any rewards journey usually asks customers to complete a task & to participate in the community. We kept this simple, providing 3 campaigns customers could opt to complete that mirrored our API capabilities at the time.
Animated campaign claim
Once a customer has completed a campaign (e.g. connected their X account), they're eligible to claim $NEAKS. We wanted to keep this fun, in-line with the brand & something that didn't feel out of the box. (We also needed something to distract customers from the potential long on-chain load times)...
NFT rewards
At the end of the journey, customers can trade in their $NEAKS for a digital collectible (NFT). This is minted on-chain and sent directly to the customer's wallet that was auto-generated on sign-up. Each collectible was generated through Mid-Journey, and layered over a few different images in Photoshop to create the final composition.
Rewards
Once customers had earned their $NEAKS, they could opt in to enter either our raffle, or our auction and be the winner of a digital collectible. Both rewards utilised our APIs again (with a third coming soon) and all actions were completed onchain.
Personal
reflection *//
This project was great to a part of and inspiring to see what a small team of us could achieve in a short space of time, it's probably one of the quickest project turn around times I've been apart of (in terms of ideation to design to dev to test and launch), but also one of the most exciting! I think this was reflected in the data we saw too, with high-participation rates and campaign completion (~60%) and reviews across social media highlighting the experience and the joy it bought a few people.
Launch video
We created a launch video to coincide with the general release of Sneaks, continuing to highlight the experience, whilst still connecting the product back to the APIs and contracts we used throughout. (Since this video was posted by Co:Create and it's purpose was to showcase their APIs, we maintained their brand consistency for the cover).
With this project, we were fortunate to have creative freedom to craft and build our own brand, one that could tell a story, be something others relate to and want to see more of. Overtime, our goal was for this to scale to other industries and brands to help better tell the story and carve a path for other brands too (e.g. a sunglasses brand or a financial institution). Overall, this was received well both internally and externally, and we managed to design a brand and build a unique experience that feels fresh, but that achieved it's goal of helping to tell the story of our APIs through a new lens, and from a different perspective for our customers.
Impact & outcomes *//
Created a brand & experience that others wanted to Highlight & share across their own social medias
A 60% campaign completion rate and over 65,00 $neaks minted on-chain
From ideation to Launch, we completed this in under 6 weeks
What we launched & how we did it ** //
View the experience
Try it yourself →
API notes
Throughout the experience we included a drawer at the bottom of every page that revealed what we did, how we did it using our APIs and how others could get started to build their own experience.
Sneaks landing page
Right from the beginning, we wanted to create an experience that felt fresh but familiar to customers, something with instant appeal that felt easy to pursue.
Next
Microsoft teams
View project →