real colors virtual instrument
Elevating Real Colors into the digital space with a brand new virtual assessment tool.
00
tl;dr
When COVID-19 halted Real Colors’ in-person personality assessments they had to pivot and an online option was now critical. I led the end-to-end design of their first-ever virtual product — a complete digital transformation of their flagship offering. This meant reimagining a highly tactile, facilitator-led experience as an intuitive, self-guided tool while preserving the scientific integrity of the assessment. I collaborated closely with stakeholders, led product discovery, crafted the UX/UI, and guided development to launch under an accelerated timeline. The result was a high-impact product that quickly became one of Real Colors’ best sellers, driving over 50% of their English-language assessment sales.
my role
Lead designer – product discovery & research, wireframing + designs, assisting with project management, product strategy, collaborating with development.
01
Some Background
What is Real Colors?
Glad you asked. Real Colors is a personality assessment that enhances communication and the understanding of others. In-person assessments and group workshops are facilitated by Real Colors certified facilitators and are commonly held at large organizations with small teams attending together.
Not just for the participants
Our project's scope extended beyond simply designing a virtual "instrument" (as it’s called). We needed to grasp the participants' unique goals, expectations, and challenges, of course. But we also had to consider the facilitators, who play a crucial role in delivering and administering these assessments.
A quick clarification we get too deep: despite the term "instrument," there's no music involved here. It's simply Real Colors' chosen nomenclature, to help give it a more scientific flair. “Instrument" and "assessment" are interchangeable in this context.
Where I come in
At the core, I was the lead designer on this project, but I was also tasked with wearing many other hats throughout the project’s life. The team I worked with on this project was small; 3 people in total. A designer (me), developer, and a project manager/creative director. After about a month our project manager went on maternity leave which subsequently added more responsibility to my plate. All in all, I was responsible for communicating timelines and priorities to the lead developer, determining MVP functionality on the final deliverable, creating timelines for client meetings and check-ins, presenting project progress, collecting stakeholder feedback in an effective way, leading and executing on the first round of user testing, interpreting and prioritizing this feedback, and pretty much everything else that goes into getting a project across the finish line.
02
The Challenge
Before COVID-19, Real Colors conducted all of their personality assessments through in-person, paper-based group workshops. But when shutdowns swept across the country, our team was tasked with transitioning this fully analog process to a digital format. The Real Colors assessment follows a highly specific methodology, so it was critical for us to accurately recreate the scientific approach behind it. Our goal was to provide participants with an intuitive virtual testing experience that didn't require an in-person facilitator, while still maintaining the integrity of the assessment.
Need it done, like yesterday
This project not only had an insanely tight deadline, but also a fairly strict set of requirements that simply had to be met. A combo that will induce a certain degree of anxiety on par with the most stressful projects. It was a welcome challenge and was something the team and I were ready to tackle.
Let's dig in!
year
2021
timeframe
3 months
tools
Figma, Wordpress, React
category
product design
03
Kickoff & Research
Overcoming Client Concerns with Digitization
Before we could do anything we had to understand why our clients wanted (or really needed in this case) to complete this project. We needed to discover why it took a worldwide pandemic to spark the digitization of their decades old paper flagship product.
Critical Insights
Afraid to lose personal instruction during the assessment
Facilitators are a key element of the secret sauce. They’ve gone through extensive and expensive training to make sure a workshop is effective for all participants. We needed to figure out a way to replicate that.
Afraid to taint the efficacy and reliability of the instrument
There is a rhyme and a reason to this instrument. If a question is read out of order or the positioning of an image isn’t just right the whole assessment could be deemed invalid.
Virtual tool means virtual everything else
Previously, facilitators had their own methods for managing their workshops, largely done offline. Now we needed a tool to allow facilitators to manage their workshops online.
Getting to Know the Material and Its User
Next it was time to study up. If we were going to recreate this instrument we needed to know it front to back. We analyzed every section and identified the key actions for each. To help us fully understand how people used the paper version we conducted some user interviews. Our budget was basically non-existant for research, but thankfully my whole organization had both observed and participated in an in-person workshop within the past year. We asked questions about their experience, how they used and approached each section, and what parts of the assessment provided the best guidance to help them answer accurately.
What We Learned
The paper is a huge part of the experience
Participants loved to pick up, shuffle, arrange, rearrange, and slide the individual color cards on the table in front of them
Small decisions along the way made the final decision much easier
Almost all participants made notes on their cards before determining what order to place the colors in. The approach varied, but a majority of participants used some form of highlighting/circling/underlining or removing/striking through. These micro-decisions made along the way allowed the participant to confidently order their color cards at the end.
The manual calculation of their final score felt clunky and did not instill confidence in the accuracy
While we wanted to replicate the experience of the paper instrument as best possible there was one thing shared by all past participants we spoke to: calculating the final score was tedious, awkward, and left too much room for error.
04
Making a Plan
Once we had learned all of the above we needed to determine what that actually meant for the project. We documented all project requirements and goals. This gave us something to work backward from.
Responsive? Mobile-Friendly? Maybe Not.
Typically designing mobile first would be our standard, but we started to realize all of the complications it would cause. These far outweighed the complications of not building it. I feel a little dirty writing that, and it was a difficult decision for sure, but one that made increasingly more sense when we thought through it.
The format of the paper instrument lends itself nicely to the screen size and ratio of a tablet, laptop or desktop. The book itself was roughly 14” x 7” when open.
Nearly all participants are taking the assessment at work on company devices like laptop and desktop computers. Maybe most importantly, we needed to get this live as soon as humanly possible.
This felt like a "nice to have” not a "need to have”. By tucking it away for later we were able to speed up the project timeline and ship sooner.
Helpful messages were put in place to reduce frustration and instruct participants how to proceed with their assessment.
These Guinea Pigs Don’t Squeal
We knew that all of the strategizing and theorizing wouldn’t ensure a successful product alone. We had to get real participants involved. We worked with the client to identify a group of people we could run our first virtual workshop with. It would be low risk and provide invaluable insights on what we needed to do to get the final product ready for primetime. To best gather participant feedback, we implemented the following:
At the end of each assessment each participant was asked to fill out a form asking about their experience to share specific information about any issues or confusions they encountered.
While there wasn’t a facilitator present there was still a facilitator assigned and they personally discussed the experience with the participants. This is how most of the feedback was acquired.
If We Build It How Will They Come?
Building a bang-up virtual instrument was obviously top-of-mind, but that was only half of the equation. The instrument is for the participants, but how the facilitators would manage and distribute the assessments was a significant piece of the puzzle. We had to ensure this experience was top notch or they would be less inclined to use Real Colors in the future. We crafted a set of requirements for this system, creatively called the Virtual Instrument Management System or VIMS for short. These requirements, just like the instrument itself, were inspired by the process and workflows that real life facilitators implement.
05
Execution: Design & Development
It’s crunch time. We’ve done our research, talked to our users, and created a plan. Now it’s time to create our screen designs and flows for what will be the new standard at Real Colors. It needed to meet the requirements and solve the problems discovered in our research, all while continuing to be a simple and easy to use tool. We did just that.
What the Feature?
A lot was discovered in our conversations with the product stakeholders and past participants. Now we had to figure out how to convert those discoveries and requirements into user friendly features.
Interior screenshot of the Virtual Instrument that provides the participant with an interactive method to interact with the picture cards.
Hope you’re taking notes
Like the picture cards, the text cards could be enlarged and flipped through. Since participants often took notes during this section, we built in the ability to highlight or strike through text, inspired by Medium.com. The tool also tallied these interactions, giving users helpful stats to guide their final decisions — something the paper version couldn’t easily provide.
Bringing it to life
The paper instrument allowed participants to sort cards based on what felt most and least like them by physically moving them — a key part of the experience. We replicated this in the digital space with drag-and-drop functionality and flexible viewing options, letting users interact with cards one at a time or all at once.
Who needs a stinkin’ facilitator?
Well, it’s actually pretty important to the process so providing guidance along the way was a must. There was also the stakeholder fear of losing this personal instruction. To combat both of these, we started off each section with a short video.
Error-free score calculation
Another bonus of moving the instrument to the digital space is the ability to offload all calculating and math from the participant and onto the robots inside the computer. No more errors. No more frustrating invalid scores.
Behind the Facilitator Curtain
As a key component alongside the virtual instrument, the VIMS played the all important sidekick to the Virtual Instrument. The aforementioned VIMS empowered facilitators to manage the entire lifecycle of licenses including distribution and tracking. Once a good understanding of the instrument design & experience took shape, we dug right into the experience from the facilitator side.
An example of the experience for a facilitator managing seats for their participants
Participant Filtering
Many facilitators are managing dozens or hundreds of participants at one time. The ability to find and select the right participants is crucial for a good facilitator experience.
Individual & Bulk Management
We added in the flexibility to add one participant at a time or hundreds. This way, the needs of both small and large operations were met.
Fine Adjustments & Broad Strokes
Modifying participant information is commonplace for facilitators or for those that manage the participants. Things change and they need the ability to swap one person for another or to change an entire workshop in one fell swoop.
Streamlined Actions
All actions a facilitator would need to take on a participant and quickly available with the click of a button.
06
Results
We were able to launch the virtual instrument in about 3 months and it was a huge success. It quickly became the second best selling product for Real Colors, behind only the paper version. Since its release it has accounted for 52% of sales for the english version of the instrument. But, most importantly, it allowed Real Colors to stay relevant and ride the wave as the world transitioned to remote work both during and long past the COVID-19 pandemic.
