Identity Guard Web Experience

Roles  I  Lead UX/UI, Shaped Product Vision & Roadmap

Identity Guard was an evolution in personal identity protection.

Leveraging Watson AI (to watch large data sources, and natural language detection), Identity Guard's goal was not to merely detect, but to look forward and anticipate threats and vulnerabilities. We realized that there was much much more to a person's identity than just a credit score: social media, accounts at online retailers, online banking, a proliferation of digital devices, all meant more exposure.

Up till then the protection approach had been focused on a user's credit file and score, and more often than not, by the time the credit file and score were impacted, there was very little a person could do to undo the damage. 

View Information Architecture and Interaction Design Artifacts

View Visual Design Artifacts (WIP)


Project Overview

The product experience you are viewing was the fifth attempt to create a new vision for the company. The first four were faced with challenges: execution and/or design, all of which proved fatal to the experience.

This experience was lagely built from the ground up. The only "pre-existing conditions" dictated by a four month design/development target for MVP were architecture related: the structure of the Alerts, for instance.



Our initial insights were based on two sources: demographic data gleaned from a legacy product (same space, but different audience, experience and business objectives) and a Kano chart of potential product features, the result of a study conducted by an outside agency.

We knew our audience skewed older, and from there we could derive some assumptions about device usage and preference, and consumption habits. We also had some justification for feature prioritization. Also, executive agreement that the release would be a MVP helped us bring better definition to the roadmap and plan for a lot of user feedback and metrics analysis post launch.


Information Architecture and Work Flow

Below are some of the wireframe explorations in the early phase of UI definition. There were hundreds of these. These explorations helped Product and Development to discuss feature direction and gauge level of effort. Since we had a hard date for MVP release of four months out (a hard date not being ideal), we had to be very aware of the tasks at hand.

These were created in Sketch. I'll occasionally explore via hand-drawn sketches if I am exploring with a group, otherwise I do my sketching in my head.


GUI Design

Below are some artifacts from the visual design process. I'll be adding more detail and organizing these mocks shortly (9.4.2020)

The mocks I am showing here were created for MVP. I do not believe they are fully successful: they look heavy, noisy and the design dated. Even for an MVP, it felt like we were aiming to do too much at once.

After release we were able to address some of the heaviness by removing superfluous color, lines and drop shadows, by simplifying button design, and being more subtle with some of the shades.

I felt strongly about retaining the zebra striping for alerts. The bright colors and diagonals were an instant reminder that the user needed to pay attention. I also thought the zebra striping would make a strong element for use in marketing.

The site was a coded as a responsive design for display on mobile browsers. The mobile view was more successful. 



©2020 by Sunmonkey Design / John Clarkson