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 the users to track their health data in real time. We collaborated in defining the key features for the app, its general behavior and 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 services 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 apects of eyewear and eye care, to build a mobile application for both Android and iOS.
The Shop created Project Genesis. Genesis was 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 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, hearth rate, posture, gait, and more) over a period of time. Through that data, the individual then has the potential to start identifying trends and behaviors that could create a more proactive healthcare model.
This technology required an accompanying app that users could deploy to track their health data in real time.
This application would have an extra layer of social engagement and 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 people in need in the US.
Project goals and objectives
Our objective as a UX agency 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 measurements of success were:
Direct Feedback: For the first launch, the application would be available for a selected group of 200-400 influencers in the dashion 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. “By seamlessly integrating an activity tracker in eyewear that is fashionable and attractive, comfortable to wear, not easily lost, and durable, consumers will use the product longer than other activity trackers.”
- 2. “The principle of ‘helping other 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 a secondary measurement of success, the amount of times users came into the app and the amount of time they spent within the app would be evaluated. If users were not using the app, the reasons behind this behavior would try to be found. These metrics would be approached from a purely experimental discovery process.
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 included their target audience and their expectations for the product in terms of behavior and look and feel.
The app was originally targeted to women and men generally between the ages of 23 and 45 that possessed the ‘millennial spirit’ and valued being fashion forward, high quality and workmanship, unique experiences, and the ability to connect and share and helping others.
From the requirements we created:A design brief
A design brief is a document that serves as a guide and as an agreement between two parties involved (the hiring company and the service provider). This guide stipulates the aims, objectives, milestones and timeline of a project. It is an useful tool that guides all design efforts.A positioning statement
A positioning statement is a concise description of the target market and your justified (and verifiable) point of differentiation among your 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 @ VSP Glocal 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 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 delived 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 idea board.
An ideaboard 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 moodboard. The moodboard 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 determinig 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 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 we were always on the same page. The team seamlessly managed large changes midway through the project and worked around a multitude of potential road bocks. The UX Department played a major role in the success of our pilot test”