Project Background
The AI world continues to grow as it offers efficient solutions to problems facing people and businesses, as well as quick ways of accessing relevant information. AI-powered Voice User Interfaces (VUI), in particular, have shifted the way users interact with computers or machines. Virtual assistants can access and analyze users’ locations and online activities, and they have become an important means for users to interact with other services and applications.
The Challenge
Design a virtual assistant/VUI for a company or organization in Pittsburgh where kiosks are available.
Details
Interaction Design Studio at Carnegie Mellon University
Duration: 8 weeks,
Fall 2021
Role
Tools
Team
Conceptual Design
Interaction Design
Motion Design
Visual Design
Project Management
After Effects, Premiere Pro, Illustrator, Procreate, Figma
Christina Ip
Himani Auplish
Eva Chung
Kate Guo
Zhuoneng Wang
The Outcome
Meet Spot!
Spot is a Virtual Assistant designed for Target guests to
elevate their shopping experience, in-store and at home.
What does Spot do?
Spot makes recommendations, answers questions and personalizes Target runs based on your shopping history.
Where is Spot available?
Spot is designed for iOS and Android smartphones and
is also available to use on Target's self checkout kiosk.
Getting ready for your next Target run?
See how Spot can help!
At Home
When getting ready, Spot organizes shopping lists, recommends forgotten items, and set reminders and notifications for promotions.
At the Store (Explore Mode)
You've made it to Target! Spot lets users know what promotions they may be interested in, gives reviews, and help out with any meal ideas.
At the Store (Rush Mode)
In a rush? Spot will let you know the fastest and best way to complete your shopping list, as well as how long it will take.
Checkout
Self checkout becomes a breeze when Spot adds items with voice commands. Spot also applies gift cards or saved promotions automatically!
Design Process
With eight weeks, our team moved quickly. Our process looked like something below:
Prototyping & Refinement
Exploratory Research
→
→
Concept Development
Future Steps
→
Research Insights
As avid Target shoppers ourselves, we were happy to start with field research for on-site observations. Afterwards, we conducted interviews with shoppers from various backgrounds to compare experiences. The interviews questioned the shoppers' habits and preferences when visiting Target. We synthesized our findings into the following three key points:
Unique target runs sharing common shopping patterns
Target shoppers are people of habit. People visited the clothing section first, downloaded coupons the day before you go, or picked up coupon immediately upon entering. These were just a few of several habits shared across all participants.
Countless options and
various distractions
Without a list, it was very easy to forget what you came for. With a variety of goods ranging from groceries, electronics and more, it was easy to get distracted. In addition, clearance and new merchandise was constantly rotating.
Target runs followed
a flexible schedule
Target runs ran on a schedule. For example, a mother of two would go weekly to purchase staples but when birthdays came along, they had to buy gifts. In these situations, the Target list were flexible and changed according to the circumstances.
Once we had a better understanding of Target shoppers, our next question was the following:
How do improve the shopping experience of Target shoppers?
Who would the VUI be most ideal for?
Target Audience + Persona
When considering our user group, we considered Target's most frequent users. We decided to go with parents and caregivers because they had to go the most often for their household. The following persona was written:
Meet Lily Lin, a mother of two.
She’s lives in the suburbs and shops at Target frequently.
While she loves to explore Target, she doesn’t always have time.
Concept Development
Once the user group was defined, we identified scenarios that occurred at Target and the VUI's role in assisting the user at home and at the store. Scenarios included reminding the user to return an item, adding items to their shopping list, suggestions when forgetting items, searching for reviews, and more. Shortly afterwards, we divided the Target run into four parts: before shopping, at the store (exploring), at the store (rushing), and at checkout. The scenarios were then drawn into storyboards.
Before Shopping
During Shopping
At Checkout
Simultaneously, we mapped out the interactions that happened during a typical Target run and when touch points would be necessary. While drafting our scenarios, we gained a better understanding of the shopper's needs and emotions. From here, we also could anticipate the user's action and how the VUI would respond.
Defining our Virtual Assistant
The VUI's purpose was to be an assistant and a personal shopper for the user. From our secondary research on Target, we had identified vital elements that represented Target such as the bold colors and logo. Their iconic mascot was also a prime contributor into our process. We wanted to carry over these traits to maintain Target's brand identity.
Target's iconic mascot
Spot's Four Main Principles
Bright
Spot matches Target's visual style.
Friendly
Spot invites users to interact.
Friendly
Spot cares about the users' needs
Efficient
Spot calculates results for users quickly.
Form and Motion
When designing Spot's form, movement and actions, we worked through several variations of Target's mascot and logo. Ultimately, we had landed on circles and a ring to represent Target's flat rings to meet somewhere between 2D and 3D.
We had also pulled inspiration from existing virtual assistants such as Alexa and Google Assistant. VUIs performed in a way in which they moved while conveying emotions. By studying their movements and sketching various iteration through Procreate, the personality and motion came together.
Spot's Final Eight Motion States
Activation
When Spot first appears on the screen
Standby
When Spot expects
a on-screen reply
Listening
When Spot expects
a verbal reply
Speaking
When Spot
answers the user
Processing
Error
Celebration
Exiting
When Spot proceeds with a request
When Spot leaves and the chat box collapses
When Spot doesn’t understand or fails
When Spot helps users complete shopping
Determining Spot's Voice
Voice is a vital attribute of our Intelligent Agent and we experimented with voices ranging from humanistic to robotic, feminine to masculine. We ultimately decided to choose a voice that leaned towards robotic to be more direct and reassert that Spot was an AI.
Incoporating Target Brand Identity
When designing our VUI, we introduced a secondary circle to assist in conveying emotions. This allowed the motions to be more fluid with the secondary ball shifting into different shapes and forms.
Deciding the secondary ball color came from studying Target's brand identity. Their core colors started with its iconic red and followed with yellow, blue and green. The style guide below led us to incorporate Spot seamlessly into the existing GUI on the Target app.
Updating the Graphic User Interface
Target had an existing app that was filled with multiple features. Our goal was to add Spot onto its interface without it taking too much space. Therefore, we decided on three displays for Spot to appear, depending on the user's needs at that moment.
Hidden Status
Short Commands
Conversations
To activate Spot, the user states "Hey Spot" followed by a command. Once activated, Spot appears in a small box to answer the user and provide feedback. When at the store, Spot would confirm the user's location and offer any ongoing and related promotions. If the user has commands that require more questions such as gift suggestions, Spot opens up a conversation mode. When completed and no longer needed, Spot lowered itself into the bottom of the toolbar so that the user could continue to use the app freely.
Spot's Available Commands
Spot's commands divides into three categories:
Utility (Short Commands)
These commands are short questions/actions where Spot shows up for confirmation. They are one-step actions that are short and concise such as adding items, scanning items, and viewing shopping lists.
Recommendations (Conversations)
Recommendations/suggestions open a conversation with the user to curate better results. Items that are chosen are then added to the shopping list if desired.
Map (Exploration & Rush Mode)
For shopping lists and an overview of the store, a landscape version of the map was designed to find the best route to navigate Target items and see interested promotions.
Spot's abilities existed past the mobile app. Getting there required us to first understand the user's pain points and intentions when using the self-checkout kiosk. The main goal was to check out quickly and efficient. The question became: How could Spot assist the user with scanning and payment?
Expanding the Ecosystem
After scanning your bar code or first item, Spot appears on the bottom left with helpful tips to let the shopper know it is available.
For grocery items, shoppers can verbally state what kind of produce and the quantity instead of flipping through several pages.
During payment, Spot remembers all coupons and promotions saved to your account to checkout quicker and more efficiently.
Similar to the phone, we modified the existing UI and placed Spot in an area where the shopper would be aware of its presence but not distract the shopper from the entire interface. At self-checkout, Spot is also available to use for non-Target members so all shoppers could share this experience.
Final Wireflow
Spot's functionalities were available from at home, while shopping, and ended at checkout until the next Target run. By first investigating the shopper's needs and actions, we were able to target pain points and opportunities to create a better shopping experience. The proposed utilities were mapped to a time frame and location.
.png)
The final wire flow demonstrates how we visualized this experience and identified when and where there were opportunities for Spot to be utilized. This was used in our proposal in how Spot would provide a personalized and helpful shopping experience for the Target shopper from start to finish.
Reflection
Spot's design was the result of studying Target and its shoppers and keeping true to their reliable one-stop neighborhood store. As we ideated and refined, we had reflected on the following:
Designing for Conversation
First and foremost, our team learned the nuances of designing with voice and various aspects of conversational design by studying human and AI speech. The dialogue played a large part of how emotion and personality conveyed, it was not just through visuals and motions.
Bridging the Gaps
Coming to service design, Spot bridges the gap between Target’s at home shopping experience and in-store experience. Though the goal was the same, a successful Target run, there were multiple scenarios and needs that were different.
Cross-Device Experience
By incorporating a kiosk, we thought about our VUI would travel through both devices and what it would need to retain. We had multiple discussions on how the system worked as a whole versus how individual parts worked.
AI Capabilities and Privacy
When thinking about Spot's functionalities, we learned about assessing and sorting data to give a personalized experience. How much and how little did Spot need to know? Spot was designed to be convenient without crossing any privacy lines.