VSP VSP is the largest vision insurance company in the United States. ln 2015 they created Project Genesis, the first wearable prototype to integrate health-tracking technology in a pair of optical frames. They chose to work with The UX Department to build and design a new mobile app that would accompany the wearable and allow users to track their health data in real time.
We collaborated in defining the key features for the app, its general behavior, and the look and feel. The goal was to create a simple experience that would allow users to seamlessly incorporate this technology into their lives.
- User Research
- Concept Definition
- Information Architecture
- Interaction Design
- Usability Testing
- Visual Design
- UI Animation
Context and challenge
Project background and description
VSP Vision Care (VSP) is a vision care health insurance company operating in Australia, Canada, Ireland, the US, and the UK. It serves about 80 million people worldwide and is the largest vision insurance company in the United States.
We worked over the course of six months together with The Shop, VSP’s innovation lab that focuses on developing technologies for the physical and digital aspects of eyewear and eye care, to build a mobile application for both Android and iOS.
The Shop had created Project Genesis, the first wearable prototype from a healthcare company to integrate health-tracking technology in a pair of optical frames. The prototype could accurately tracks steps, calories burned, and distance traveled.
The Shop’s goal with this project was to provide the wearer with contextualized health data about themselves.
Contextual health is the concept of tracking one’s health metrics (steps, calories, heart rate, posture, gait, and more) over a period of time. Through that data, the individual can start identifying trends and behaviors that could lead to a more proactive healthcare model.
This technology required an accompanying app that users could deploy to track their health data in real time.
The application would also include an extra layer of social engagement through giving. When the wearer’s fitness goals were reached, a pair of glasses and a comprehensive eye exam would be donated by VSP on the user’s behalf to someone in need in the US.
Project goals and objectives
Our objective as a UX design studio was to integrate this set of features in a way that was simple and clear, in a layout that would be appealing to the user.
Our measurement of success would be the collection of direct feedback. For the initial launch, the application would be made available to a select group of 200-400 influencers in the fashion and technology fields for use and evaluation over a 120 day period. The main objective was to obtain direct feedback from this group of users to learn how they relate with the app.
- 1. Consumers will use the product longer than other activity trackers because the activity tracker is seamlessly integrated into eyewear that is fashionable and attractive, comfortable to wear, not easily lost, and durable.
- 2. “The principle of ‘helping others by helping yourself,’ implemented as a charitable giving experience, fosters habit formation, social motivation, and goal reinforcement, which results in long-term and frequent product engagement.”
(Endeavour Partners, September 2013)
Discovery Metrics: As secondary measures of success, we would evaluate the number of times users opened the app and the amount of time they spent within the app. If users were not using the app, we would try to identify the reasons behind this behavior. These metrics would be approached from a purely experimental, exploratory point of view, since there were no specific goals attached to them.
During an initial discovery phase, we gathered information that would be used to establish the app’s audience, context, and objectives. We received documentation from the the client that described their target audience and their expectations for the product in terms of behavior and look and feel.
The app was originally targeted towards women and men between the ages of 23 and 45 that possess the ‘millennial spirit,’ enjoy being fashion-forward, and value quality and workmanship, unique experiences, and the ability to connect and share with others.
From the requirements we created:A design brief
A design brief is a document that serves as a guide as well as an agreement between the two parties involved (the hiring company and the service provider). This guide stipulates the aims, objectives, milestones, and timeline of a project. It is a useful tool that guides all design efforts.A positioning statement
A positioning statement is a concise description of the target market and a company’s substantiable, verifiable point of differentiation among its competitors. Its core purpose is to help maintain focus on the brand’s value proposition.
Interaction design phase
The application map, user flow, wireframes and other relevant project documents created by The Shop at VSP Global were reviewed by both The UX Department and The Shop to determine the key components of the application.
We drafted a few versions of wireframes that were polished after gathering feedback from the client. Then we created an interactive prototype and we performed the first iterative user testing session. Feedback from this session was incorporated into the final application map and wireframes.
At the end of this process we delivered the Information Taxonomy document (application map) and the wireframes for all the key pages of the site.
Visual design phase
The Shop provided samples of digital experiences with explanations of desired and undesired features, as well as comments and preferences on the look and feel for the app.
From these insights we first built an idea board.
An idea board is a “graphic brainstorming”; it was our first approach to the design of the application’s look and feel. We presented different aesthetic options: color palettes, font faces, animations for the app’s interactions, and imagery related to our target audience.
We used this idea board as a conversation trigger in order to get feedback that allowed us to produce a second board: the mood board. The mood board presented specific choices for the color palette, font faces, etc. and served as the guide for the design of the application’s look and feel.
Once the basic design elements were defined, we created a series of design options that served as conversation pieces for determining the look and feel of the application.
After the first design options were created VSP had to change the product’s brand and its target audience: we were no longer aiming towards young millennials, but to older adults with a steady income. At this point we had to double our efforts to create a new design based on the updated requirements while keeping up with the project’s timeline and VSP’s expectations.
When the new style was settled, we created mockups for each section of the app and performed remote user testing sessions to gather feedback. During a series of two-week sprints we iterated on the mockups to include the insights we gathered from the user interviews. In total, we conducted 60 remote user tests.
We also created animations to illustrate the app’s behavior and interactions and to guide the development efforts.
We delivered high-resolution mockups for each of the mobile application’s screens (iOS and Android) and the assets ready for implementation on each screen resolution.
“Working with The UX Department was like working with an extension of my own team. Agustina, the lead UX Designer for the Level project, went out of her way to make sure we were always on the same page. The team seamlessly managed large changes midway through the project and worked around a multitude of potential roadblocks. The UX Department played a major role in the success of our pilot test.”