Virginia CDPA Opt-In
Case Study | 2023
Project Overview
Under a new Virginia Data Privacy Law, consent is required to process “sensitive data” which includes racial or ethnic origin, religious beliefs, mental or physical health diagnosis, sexual orientation, citizenship or immigration status, biometric data, personal data collected from a known child, and precise geolocation data.
This law is similar to California’s CPRA and Europe’s GDPR, and similar in other states —
although this is the first to require affirmative consent instead of simply an opt-out prompt.
I was tasked at short notice with designing a new flow for this opt-in message, and in-turn define an updated look & feel for important in-app messaging.
Important Considerations
Must be given at signup or sign-in, but minimal disruption to the signup experience is crucial.
Must communicate details of the law which reduces ad relevance, a metric that is important for user satisfaction.
Must be able to surface to existing users in Virginia — using ZIP self-reported at signup to determine general user location.
With similar laws in more states imminent, the design must be extensible to apply in future contexts.
Previous User Journey
Log In
Drag to explore
Previous User Journey
Sign Up
Drag to explore
Design Process
Competitive Analysis
Shape Study
Layout exploration — placing multiple circles within a square tile ensuring minimal overlap to maximise visual legibility
Colour Study
Pandora currently uses dominant colour picking in various situations, particularly within the Now Playing experience for users subscribed to our Premium tier.
Initial work explored generating gradient backgrounds automatically built based on an input image’s dominant colour.
Common colour algorithms would be used to determine complimentary values for appealing gradients.
Various gradient types were tested, with consensus landing on Angular Gradients.
Further exploration uncovered inconsistencies in our algorithm’s ability to accurately identify skin tones within an image - especially when post-production had been applied.
Cross-team feedback was solicited to ensure designs maintained care and sensitivity towards depiction of skin tones within artwork.
I noticed that regardless of skin tone, our algorithm trended towards picking values almost exclusively within the orange hue range — with low saturation and brightness levels.
A decision was made to avoid all skin tones within gradient generation, and to push saturation & brightness values above 75% when the dominant colour lived within the orange hue range, but with low brightness or saturation. This allows all skin tones to be represented with fairness and equity in any artwork.
In an effort to simplify the gradient generation process, a set of 12 predefined variants were built, and a ruleset developed to assign each to a station based on the primary image’s dominant colour.
Each gradient has 3 colour stops, with a defined radial point to ensure consistency from design to production.
Atomic Elements
A simplistic set of atomic elements were defined to allow for adaptation based on the number of artists or songs in a given station
Layout Explorations
Colour Variations
After additional rounds of feedback and refinement, the following designs were agreed upon for production.
Circles represent artists, and squares represent songs.
In-Situ Mocks
Revised Palette and Gradients
Due to a leadership request, the variation of colours used was minimised and a new set of gradients was developed.
More Mocks
Notes from UX Research
As a part of a broader study, notes were captured on participants’ comments regarding the artwork updates.
Project Status
Roadmapped
After receiving leadership approval, this update is being developed for rollout alongside a broader Pandora update in the upcoming future.
Please feel free to reach out with any questions,
and thank you for taking the time to explore my design process.