A/B Testing Platform

Summary

Measureyes is an A/B testing platform, which allows retailers to track the success of their storefront window displays by utilizing collected data based on head-turn rates (HTR) and facial recognition. In an online environment, the placement of artifacts, colors, typography, etc., can all affect the rate of conversions. We hypothesize that the same is true for brick and mortar display windows, so we wanted to create a way for retailers to improve their conversion rates in a way that mimics the online environment.

The project was born at Globant’s Hack the Now: The Future of Retail hackathon event. The team came away with a first-place win and has carried on to develop the product post-hackathon.

My Role at Measureyes

UX/UI Designer

  • User Research

  • Competitive & Comparative Analysis

  • Persona Development

  • User Flows

  • App Architecture

  • Wireframes

  • Visual Design

  • Prototyping

Tools Utilized

  • Figma

  • Sketch

  • Invision

  • Zeplin

  • Pen & Paper

Project Length: 1 year working with this team on the project
Team Size: 5 - UX/UI Designer, Developer, Project Manager, Data Scientists (2)

Research

As a UX designer, I first began to look at what other products were already in the market. We performed a Competitive Analysis to learn what features were common while trying to find the gaps in the competitors’ services.

Credit: Melissa Kaiser and Sunny Lee

We found that there was a high level of in-store monitoring happening within physical stores. Companies are tracking a myriad of things, such as when someone enters and exits a store, which parts of the store they spend their time in, whether they’ve made a purchase, how often they visit the store, and more.

This research showed us that few companies were not as interested in what was going on outside the store. Although some companies were vague about their products, we found that even the leading products do not focus on head-turn rates or A/B testing of the storefront windows. This research gave us confidence that our idea was worth pursuing as a new path in retail data collection.

Continuing Research

Our team met with business owners of various sizes to gather information on how they'd want to use our product and what features they found valuable.

During this research process, we were working on the MVP. We developed this for demonstration purposes and designed and developed the webpage to allow interested parties to contact us.

Synthesizing the Data

We went over the data and prioritized the features of Measureyes based on our research and gaps that we found in the marketplace.

Since many companies were already focusing on the interior of the stores, we kept our focus on the exterior. We selected features that would address the needs of the user based on our hypothesis.


User Pain Points

We hypothesized that the pain points of our user would be:

  • User needs business intelligence of outdoor store displays in real-time - actual metrics to inform foot traffic outside of their store.

  • Gathering, accessing, and interpreting the data.

  • Different stores have different sales or displays for cultural norms.

  • Understanding how the environment affects sales (weather, local events, etc.)

We also created a User Journey focused on what a client without Measureyes would go through, realizing that there were both pain points and moments of success. The user would find a pain point in hardware set-ups and learning to use the systems. Success would come from in-store metrics and findings, but then pain points again relating to the lack of exterior knowledge, thus generating a need for the Measureyes product.

Credit: Melissa Kaiser and Sunny Lee

Based on our current prototype and research, our end-user has yet to be determined. We have considered that our user base could be broad and interest many like:

  • Small businesses

  • Large retail chains

  • Marketing companies

  • Real estate companies

This portion of my case study will evolve and include user flows and personas as this project moves forward.

Creating the MVP

Moving forward with the product post-hackathon, I needed to know what our product could accomplish to create a good design for the dashboard.

Steve and Nguyen have been working on the code to track the Head-Turn Rates and other metrics for our MVP. To test the code, we needed video samples outside a storefront.

To achieve this, Sunny and I arranged a cast of volunteers. We choreographed a scene of people walking past a downtown storefront in Seattle and created the footage to assist with our product testing.

Dashboard Design

Based on the code results, the team decided that the product needed to include:

  • Live video feed

  • Adjustment sliders: YAW, Dwell Time, and Break Time

  • Graphs: Live HTR, and Daily HTR v. People

  • Widgets: Weather, Local Events

  • Location Selector

  • Camera Selection

  • A/B Comparison

  • Toggle Tabs: Live Feed, Past Data, and Future Predictions

To go over ideas for the design, I met with Claudia, our developer, to discuss her capabilities and how we could display the metrics needed. Many sketches later, we arrived at the design shown here.

Dashboard Wireframes

After reviewing the sketches with the team, I created the wireframes for the dashboard. At this point in the project, we are focusing solely on the product’s Live Feed. What you see here is the design for the live feed portion of the MVP.

Homepage Design

We have been presenting our product idea at lightning talks in Seattle. We've also had meetings with marketing managers and businesses. There's been a good deal of interest in what we are doing, so the team decided to create a web page for Measureyes. The goal is to provide visibility and gauge interest by allowing people to contact us or subscribe to our newsletters.

To design the site, I again met with Claudia. We decided to keep things simple and opted for a single page that includes our product information, contact, and team info. The sketch below shows our final design layout. I created the wireframes based on this design.

Hi-Fidelity Designs

The hi-fidelity dashboard has been created and was used to help illustrate our product and its features at the Puget Sound Programming Python (PuPPy) lightning talks held at Starbucks headquarters in Seattle.

 

Here is a look at the hi-fi webpage developed for our product. It's a modern design containing information about our product, what it does, info about the team, and a way to contact us.

The images are from our test footage. I created customized graphical elements to give it more visual interest.

Next Steps

The project has gone on pause but may continue in the future. Our next steps are to test the MVP in a few downtown Seattle storefronts. We will then go on to refine the dashboard and do more user testing. The goal is to get this system in some smaller shops, to begin with, possibly via a subscription service where we monitor the data and provide reports to the business owners.

Learning Points

This project has been an exciting piece and has grown into an unfunded startup of sorts. Our team feels as though this is a viable product so, we have continued to work on it diligently. At the Globant Hackathon, we all met as strangers. It was the first time I’d worked with Data Scientists. I found it fascinating to hear how they spoke about data related to our project. I learned a lot about data collection from both Steve and Nguyen. About a month in, the team decided that we needed to get structured. We found Tim, a Project Manager, and he took on the PM role. We’ve been working in Agile design sprints ever since. Tim is very organized and keeps us communicating and on track. We’ve been producing our work more quickly and effectively. I’m learning from each member of the team. We are constantly collaborating and sharing ideas, talking through our work, and deciding the path of this project. It’s been a great experience so far. More to come in the future!

Previous
Previous

Automation Native Mobile App

Next
Next

e-Commerce Responsive Web