Lystr is an IoT device and companion mobile app that helps people create grocery lists. The smart home device, which plugs into a kitchen outlet, incorporates a barcode scanner and voice recognition technology where users can swipe barcodes or speak to Lystr to add grocery items to their shopping list. The supporting app allows users to manage and share their lists.
When the client approached us, she was a few months away from launching the product. The physical device was an advanced stage prototype, and a previous UX designer had created the Lystr app. The client wanted us to validate her assumptions about the target user and refine the usability of the existing product ahead of the launch. The client also wanted to hear our recommendations for future development of the product. I was excited to explore how machine learning could enhance the grocery shopping experience.
In many ways, the whole design team came into this project as subject matter experts. After all, between us, we had thousands of grocery trips under our belts. Still, it was important for us to look at the bigger trends associated with grocery shopping and related digital products. As we dug into the domain literature, we learned:
Our client had three initial thoughts about who her competitors were:
This last point was a question we returned to over the course of the project as we analyzed the viability of our solution. Was there enough of a pain point that shoppers would use Lystr, or would they be content scrawling their grocery list on scraps of paper?
We discovered a plethora of grocery-related digital products. We looked at grocery-specific apps such as Grocery Gadget and Grocery IQ. We investigated general list-making apps such as Wunderlist and iOS Notes. We also looked at couponing products, meal planning apps, grocery delivery services, and connected home devices. We analyzed both smart kitchen devices such as GeniCan and Hiku as well as general smart home devices like Nest to try to understand some of the trends and possibilities associated with these kinds of IoT products. We found that GeniCan and Haiku offered very similar features to Lystr, with both barcode scanning and voice activation. We could not see a way to differentiate Lystr at this point, so we turned to the users.
Our client assumed the main frustration for users was a lack of organization which resulted in forgetting items at the store. She believed her target user was a somewhat affluent female aged 25-45 who was not price sensitive. The client was open about the fact that she had based many of her assumptions on her own personal experiences. We needed to figure out who the users really were and build the client’s empathy for these users.
We conducted usability testing of the current app to see how easily users could complete basic tasks like creating news lists; adding, categorizing, and crossing off grocery items; and sharing their list. Upon testing six participants, we found:
We now knew there were some usability issues with the existing product, but we also wanted to understand if there were other user needs that Lystr did not currently meet. We conducted extensive interviews with couples, families with children, and people living alone. We heard things like:
Although we yielded valuable insights from our interviews, we wanted a full picture of people’s mental model and behavior. Since grocery shopping is such a repetitive, habit-driven activity, users may not realize their behaviors are atypical and may not report them. For this reason, we decided to conduct contextual inquiry and ethnographic observation. We accompanied three individual shoppers on grocery trips, asking questions before, during, and after the process. During ethnographic research, we visited three grocery stores in an affluent part of the city to target the types of users our client desired. Our observations allowed us to form a broad overview of the habits of a large volume of shoppers.
Some of our key takeaways:
After conducting user research we saw a big difference between the assumptions our client had made and who our users actually were. Since building the client’s empathy for the true users was crucial, we developed personas.
Mary is similar to who the client initially identified as her target customer, with a crucial difference being that she is price-sensitive. Our co-shopping couple was a demographic we believed could benefit from Lystr, based on our user research. Although Mary, Carrie, and Dan all had different circumstances and attitudes towards the grocery planning and shopping process, we noted a common trend of disorganization. This led us to the core problem:
After identifying the core issues, we began defining our approach. We used the following principles to guide our designs.
We came up with three divergent concepts to answer the problem. One of my teammates explored a personal shopper grocery delivery service to help people like Mary save time and frustration. My other teammate designed an app to provide health and nutrition information about the products in the user’s grocery list since the majority of people we spoke to were very health-conscious.
As I ideated and designed my own concept, I took several factors into consideration:
I reimagined the Lystr device as a portable product that users could take grocery shopping. For the companion app, I designed a grocery list management system that would learn and adapt to an individual user’s shopping patterns.
I knew the device redesign was a long term consideration (since the product launch was imminent) but since the client was eager to explore the possibilities, I wanted to provide options for future iterations of the device. I was also concerned about the viability of the other two concepts. The personal grocery shopper concept catered to a very limited demographic of affluent users. Additionally, it would be challenging to compete with Instacart on price (a concern given that Instacart already loses a significant amount of money on each order). I also had reservations about the health/nutrition concept because it’s difficult to provide detailed nutritional breakdowns without knowing which household members were eating which items, or how many servings they were consuming. Ultimately, I believed a smart list management system met user and client goals, and was feasible for the MVP.
I envisioned a device that could strap to the handles of the grocery cart. Having learned the route a user takes through the store, Lystr would have already organized the shopping list to match the route, thereby preventing backtracking. A perpetually lit display shows the next three items on the users’ list. The shopper can check off items by tapping on the screen or swiping a barcode.
I advised the client to change the device and phone pairing process. The current setup caused the phone to emit a series of flashing lights with no warning. This had the potential to trigger epileptic seizures in customers.
My imagined pairing technique involved generating a barcode or QR code on the user’s phone which could then be held in front of the Lystr device. In addition to eliminating the danger of the strobe light, this pairing method would add delight to the setup process.
My concept addressed many user pain points.
Though the client liked the ideas behind the personal shopper and health concepts, she felt they were future considerations. She wanted to focus on the list management system for her upcoming launch. Our client also outlined some budgetary constraints and asked us to help determine the priority of features. We would need to create a pared down version for the MVP and mimic the current state design patterns as much as possible.
In order to figure out which functions were critical, we created user scenarios which in turn allowed us to map out the app.
Since the app would automatically categorize grocery items for users, we wanted to ensure our taxonomy matched users’ mental models. To get a better sense of users’ organization of products, we chose to conduct an open card sort.
The card sort didn’t produce the outcome we hoped for. Participants created such a broad array of categories that it wasn’t useful for the intended purpose. However, it did validate the “baskets” feature of the Lystr app.
We conducted several rounds of testing as we worked to streamline the list-making process. We made many changes, some of which are below.
My concept prototype featured bottom navigation, however we reverted to a hamburger menu because the client was concerned about the cost of making major changes to the current state. During testing, users had trouble discovering the options hidden in the hamburger, include key features. Based on this, we reincorporated bottom navigation into the final prototype.
In initial research, we found many shoppers used iOS Notes to create their grocery lists. Wanting to replicate the ease of typing in that app, we created an express list feature. This allowed users to type or scan items in fast succession. While we believed that the more advanced list management features would interest Mary, Carrie, and Dan, we also wanted to cater to the plug-and-play user such as Mary’s husband.
The current state showed favorites as one long master list that users would have to sift through each time they created a list. The first prototype we created showed basket items pre-selected for easy addition to lists. However users didn’t find this intuitive and wanted to tap an item to select it. We changed the layout to a tile pattern to match stylistically with other screens in this section of the app and remove confusion between a list and a “list starter” (the new name we gave this feature after testing).
Most users had difficulty scanning items through the app, and weren’t sure how to position the phone. In our final prototype, we provided instructions and visual cues to guide the user.
View all the key user flows here.
Many features did not make it into the MVP due to financial constraints. Here are my recommendations for future work on the app and hardware.
Considering multiple contexts for use. I thoroughly enjoyed the challenge of thinking through all the different touchpoints users could have with Lystr. For example, people use the device in their kitchens, but they could conceivably use Lystr in other parts of their home too (e.g. in their bathroom to add toothpaste and toilet paper to their list). Users may also access the app from work, and of course at the grocery store when they are in the process of shopping. Consideration for each context affected the final design.
Helping the customer figure out what they want. I enjoyed working on a project where target users were so accepting of the pain points associated with a task that they didn’t even bother to seek out a solution. It was challenging to find ways to combat the status quo and create a solution that was just as easy as writing a list on a scrap of paper. The entire project was a rigorous but rewarding design challenge.
