This mobile 3M product selector takes the guesswork out of shopping

by: | May 22, 2019

You’ve probably been there: You’re in a store, gazing at a shelf full of products that all look like they do the same thing, including multiple versions from the same brand. The products are priced differently and the packaging is ever-so-slightly varied. But you aren’t able to easily discern which product best suits your needs and solves your specific problem.

So what do you do? You might ask someone for assistance, but that means tracking down a store employee who probably won’t understand enough to help you anyway. You might pull out your phone to start googling for answers, but who knows how long that will take. So, you take a guess. It might work out. But you might end up realizing it’s the wrong item when you get home — after you’ve opened the packaging. Then you need to return it.  And the store needs to process the return and send it back to the manufacturer. Returns are painful (and expensive) for everyone — shoppers, retailers and manufacturers alike.

3M, the global manufacturer of business and consumer products, has put a lot of thought into this problem. The company has many product lines with varying feature sets, and aims to provide a great experience by helping consumers choose the right product.

That includes investing in tools to help in the purchase decision, too — because the company knows that a great customer journey starts with choosing the right product — and makes for more repeat business and fewer costly returns.

On the heels of our Filtrete™ Smart app project, 3M asked ArcTouch to create a mobile-optimized self-service product selector to be used in-store at retail giant Walmart. Together, we built a solution that seamlessly blends mobile and digital technology with the brick-and-mortar shopping experience.

A mobile-optimized product selector

We’re happy to share that our first two 3M product selectors are now live.

These mobile web solutions are designed specifically to complement the in-store Walmart shopping experience. Each product selector provides a delightful mobile experience that makes it easy for customers to choose the 3M product that best meets their personal needs. QR codes for each product are prominently placed on the store shelf.

Customers scan these codes with their mobile device, which then launches the product selector in the phone’s browser. From the mobile-optimized landing page, the customer chooses the most important product features for their needs.

3M Filtrete product selector feature set

Based on those choices, the selector recommends the most appropriate products in a “Good, Better, Best” format.

3M Filtrete product selector recommended filters

The recommendations include thumbnails of the packaging so that customers can quickly identify them on the store shelf. Customers can also complete the purchase online (via the “Buy Now” button) if they don’t see the product they want on the shelf.

The key to this project? A proven and repeatable process

As the old saying goes, “practice makes perfect.” We have been able to create a repeatable process — a template of sorts — that has been successful in delivering all requirements on time and on budget. Two mobile-friendly retail product selectors have already launched, and we have more that are in progress (stay tuned!).

So, what does our process template for creating these look like?

All of our successful projects — whether mobile apps, blockchain, or mobile web projects like this one — begin with a product planning workshop to define requirements and align our team members, client stakeholders and domain experts. We establish guidelines for how we will communicate between teams. Additionally, we define the project schedule, address budget constraints, and discuss other details that aid in formulating the project plan.

From great idea to successful mobile app

For this retail product selector, one of the most important documents produced during the workshop was the decision matrix. This matrix represents the product features that customers can choose between and heuristics to determine which products to recommend as a result.

After the product planning workshop, ArcTouch’s talented design team took all the requirements and created basic wireframes for mobile and desktop versions. We used these wireframes to gain consensus on the overall selector flow — working closely with teams at 3M and Walmart — before any more design or development took place, ensuring we didn’t waste valuable time and resources.

Once our teams were aligned on the selector flow, we then built more complete wireframes and animations to prototype what the finished product would look like. And once the design phase was complete and the final product was fully refined, it was time to code.

During the development phase, we set up a staging site to allow for iterative review. Capturing ongoing feedback throughout development reduces the risk of rework and mitigates the possibility of budget overages and schedule delays. QA testing was performed as tasks were completed to ensure documented functionality was working as designed.

Once development came to a close, we conducted full QA regression testing against a comprehensive list of the most common devices and browsers. Any QA-identified issues were quickly addressed by the development team.

The client then performed a final walk through on the staging site before everything was packaged up and migrated to production.

A product at the intersection of digital and physical

One of the most important stories in technology today is the convergence of digital and physical experiences — sometimes referred to as omni-channel experiences. Retail giants like Amazon/Whole Foods and Walmart are using digital and mobile technology to augment the physical shopping experience, from how products are purchased to how they are delivered, and even how they are manufactured.

Mobile experiences like the 3M product selectors that ArcTouch created have enormous potential to improve that shopping experience by giving consumers the information they need, right when they need it. These self-service tools can help all of us avoid the scenario where analysis paralysis prevents us from making a simple purchasing decision as we stare at products on the store shelf.

In fact, a recent Microsoft report found that two-thirds of all customers prefer to solve issues on their own first, and that “self-service should be a cornerstone of any omni-channel strategy.”

Early data for 3M’s product selectors certainly confirms the potential for self-service tools. More than 10,000 visitors have used these since they launched. Given that success, you can expect more mobile-friendly product selectors from companies like 3M, along with other digital self-service tools that help bridge augment the physical shopping experience.

What do you think?

While it’s designed for in-store use, 3M’s mobile product selectors can be used anywhere. Try them (Filtrete HVAC filters, Filtrete Room air purifiers) today and let us know what you think! And contact us if you’d like to create a product selector for your own products – your customers will thank you.