Snippt is a mobile shopping app that's driven by videos. With a central focus on storytelling of small to mid-sized brands and their products, the platform makes shopping from your phone a fun and engaging experience, by taking the modern day shopper from product discovery to check-out in just a few swipes.

My role.

  • User interface
  • User experience
  • Journey mapping
  • Prototypes
  • Wireframes
  • User research

Tools used.

  • Framer X
  • Adobe Illustrator
  • Adobe After Effects
  • Figma

Project Date

  • 2018

After working at Hudson's Bay for almost 5 years during my time in undergrad, I started to see some glaring problems in shopping ⏤ more specifically e-commerce.

As a sales associate your job is solely to sell, but when shoppers return more than they purchase in-store, you start to ask yourself, why is that happening?

Is retail shopping declining even more than we think? Is the comfort of online shopping greater than an in-store experience? More importantly, is there a problem with todays e-commerce experience that's making shoppers return their items? These few questions among the many I had led me on an unbelievable journey these past few years to uncover the truth about online shopping.

Problem statement.

Hudson's Bay isn't the only retail store that has an issue with returns, but with the increase in online shopping how can we help reduce the rate of online returns for brands while providing shoppers a meaningful shopping experience?

Solution.

A mobile shopping app that focuses on storytelling and videos to help shoppers save time, provide a faster check-out, and keep them engaged. On the flip side, the same platform providing brands and businesses a new experience in selling via content.

What came first, the chicken or the egg?

The first and biggest lesson I'd learn during the course of this startup ⏤ a marketplace is the hardest startup to do.

From a business standpoint, you have to cater to two markets, the shopper and the brand. You can't get the shopper without the brand, and the brand without the shopper.

From a design perspective, how can I bridge that gap between the two markets with meaningful design? Simple, find similarities that both markets share.

After conducting research to find the pain-points, a pool of almost 200 shoppers varying between 19 - 42 years of age and approximately 25 brands across fashion, tech, and accessories, were surveyed and interviewed.

"89% of shoppers are influenced by video to purchasing a product after viewing it."

Wireframes.

To make this plan work, it needed to center around two concepts: videos and swipes.

Videos allow users to be engaged via content. This gives a 360 insight on the products so that shoppers can gain complete knowledge of what they're buying (i.e size, colour, dimensions)

Swipes add a new dimension to the user experience. Inspired by the transition to infinite displays on phones, a full screen experience needs to be just that, full screen. With a video driven platform, excessive buttons and objects hinder the viewing experience. Thus, a swipe and gesture based interaction was key.

A platform heavily dependent on swiping comes with its challenges. The first iteration of the design involved only a handful of buttons at best. After user testing, it was apparent that users had gotten lost with navigating around the platform.

A balance needed to be struck between a flushed full screen design and traditional navigation.

The biggest challenge an online store faces is to keep the shopper engaged long enough for them to find the product and complete the check-out. If barriers and unnecessary states are added in the shoppers journey, it becomes a problem and the basket is left empty.

necessary screens only, less swipes, visible direction when required, and fluidity. 'bout to make some magic.

What changed + Key features.

The biggest change of the design was the inclusion of a card-styled feed. Inspiration taken from Snapchat Discover, this allowed for a story type interaction.

The Product Episode is a key feature in the snippt app. 4 panels stitched together to provide a "episode" like experience to give a product a beginning, middle, and end. Consisting of a video, livestream, gallery, and checkout this allows a shopper to fall in in love with the product versus just the description.

Swipe up to purchase is a significant feature on this platform as it allows for a simple gesture to add the item to the cart. In doing so, the shopper can thereafter access additional information about the product.

Learnings.

A startup adapts, staying ahead of competition and always pushing for innovation, similarly, the design concepts implemented within Snippt are a placeholder for the future mobile commerce.

1. Video is the future ⏤ to really help shoppers understand products online, videos are the best medium to communicate. With storytelling, you can share emotion, information, and engagement visually.

2. Design interaction should reflect the mobile devices ⏤ As technology improves, the design should mimic the displays of phones, adapt to the resolution of the screen, utilize the real estate provided to the best we can.

3. Satisfying everyone is hard ⏤ Snippt is a marketplace at its core, pick one side and build it out. The rest will follow.