Motorola Mi-Card

Posted by on Jan 31, 2011 | No Comments

Enhancing the specialty store shopping experience.

Project Brief
Time: 10 Weeks | Work Force: 2 Designers
Role: Lead designer

In this project we were approached by Motorola Solutions to develop new devices that would enhance the customer shopping experience at specialty stores. Though this was in some ways a blue sky project we did have the constraint that our clients are largely a physical device manufacture and our solutions had to be device centric in nature, keeping with our clients strengths and limiting the amount of overlap with their development partners.

Tools Used
We used passive observation, participant observation, in context staff interviews and shopper shadowing to gain an understanding of the shopping experience and behaviors. During the ideation phase of the project we used bbodystorming, rapid paper and physical prototyping, scenario generation, storyboarding and video experience prototyping to communicate our ideas to our clients. For one the final deliverable I also created a Flash Catalyst prototype of the UX of the kiosk.


We conducted passive observation, participant observation, in context staff interviews and shopper shadowing to gather insights into the shopping experience. The research was carried out at several local specialty retail location, two local and one large retailer, with the following items as our focus.

  • The interactions that occur between the shoppers and sales people.
  • Understanding shopper behaviors when purchasing specialty products.
  • Discovery of what the value exchange is between the consumers and the service representatives.

Following our research we synthesize our observations in to patterns and themes that became opportunity areas and design criteria for the concepting phase of the project.

Our research findings included customers having difficulty comparing products, a lack of information on product use, shoppers leaving to think or conduct research before purchasing and a desire to handle products while shopping.

Based on these findings we created a shopping scenario where Ted–our intrepid shopper–took a shopping trip which included all of our major findings. The use of a shopping scenario helped us quickly summarize our findings to others, keep the shopper in mind while designing and provided us with a quick research reference tool for later in the design process.

Concept generation

To jump start our concept generation we conducted two rounds of bodystorming where we quickly ideated and enacted multiple concepts. This allowed us to maximise the number of concepts while weeding out interaction methods that wouldn’t work. We then took the best concepts from bodystorming and created concept sketches, scenarios and storyboards for further refinement.

Three of the storyboard were chosen by my partner and I to be developed into experience prototype videos to share with the Motorola design team. The chosen concepts were:

  • One-card, an RFID enabled loyalty card that allowed shoppers to collect and compare products.
  • A near field communication based tracking system for providing item locations and inventory logistics.
  • Customer tablet device, allowing shoppers to scan items and retrieve  detailed product information and rich media.

Concept Refinement

Based on Motorola’s comments and feedback we combined the One-Card and the customer device into the Motorola Mi-Card shopping system; Where shoppers can collect product information with the card or customer device, review information on the kiosk or customer device and compare products on the larger screen of the kiosk.

To gain a better understanding of the customer journey through our concept and the support processes that would be necessary we created a service blueprint. This blueprint was later uses as a bases for generating user flows and specifications for the various touchpoints.

Wireframes and Physical Development

I generated wireframes for both the customer device and the kiosk UI of a primary user flow and alternative paths to be used for paper prototyping and further concept refinement. To speed up this process we conducted rapid ideation with sticky notes and cardboard mockups.

While I worked on the UI my partner started to generate further sketches to refine the physical design of the kiosk and the customer device.

Gestural Testing

After completing the UI wireframes  and taking a moment to reflect, we felt that the UX of them was to similar to a web experience. As a result we conducted a round of gestural testing where we constructed store mock-up where participants could interact with the collection points next to products as well as the kiosk and customer device.

Our testing brought about several key findings. Firstly, participants preferred a tap gesture for collecting product information this was partly do to the specificity of the gesture which enabled participants to feel like they had more control. We also found that participants would rather use a different gesture for depositing the information they collected into a kiosk and that gesture was the act of inserting the collection dongle into a slot. Lastly, participants felt that the customer shopping device was more of a nuisance than a help and it got in the way of their shopping experience. As a result we cut the customer device from the touchpoint line up, feeling that if in the future a tablet device could be added to the system if it was required by future shoppers or employees.

Final Ecosystem

Our final ecosystem has three major components that enable our enhanced shopping experience. We have a customer loyalty card that contains an embedded RFID tag that holds their customer account info(top). Next to major products in the store there is a product collection point that scans the customer card when tapped and bookmarks the product on a central server that the customer would like more information on that particular product(left). There is a customer kiosk where the shopper can insert their card to review the products they have collected, receive product information, view media for the products, read product reviews and compare collected items side by side(right). Lastly there is the shopper database where all of the customer shopping information is housed(bottom). This database creates shopper profiles that contain detailed information on consumer preferences, a record of past collected items, and generates product suggestions and recommendations when customers use the system.

Graphical User Interface

The welcome page displays featured products while not in use. To log in the customer can either enter their account information or use their mi-card to automatically log in. Once the user inserts their card the items that they have collected that day appear on the right side. Users can drag items onto the background to view more information, reviews, and media. When a customer drags a second item onto an already open item they can compare the products side by side, allowing them to clearly see the differences between the two items. To add an item to their cart or to throw an item away all a user has to do is flick the item into the upper left or lower left corner of the interface. Shoppers can also review product recommendations based on their past shopping preferences and current collected items. Once a shopper it ready to review their cart and check out they simply drag the shopping cart icon towards the center of the screen and it expands to show its contents. When a customer checks out the items are brought to the front of the store where they can be collected and paid for on their way out.

Future System Extensions

In addition to providing the control that users wanted, the tap gesture for collecting products also allows the Mi-Card system to be expanded to support smartphone applications and 3rd party development in the future.

As customers use their Mi-Cards to shop the system is constantly learning more about how these people shop and what their consumer preferences are. This information is extremely valuable to various industries and offers Motorola an additional source of revenue that could be developed in the future as the Mi-Card system grows in popularity.

What this project means to me

This was a great example of what applying the rapid ideation tools that I learned for service design can produce when applied to a more traditional UX and interaction
design projects.

Leave a Reply

You must be logged in to post a comment.