Review Creation

THE PROBLEM

How do we allow users to create and manage their own review cycles within their own company?

At the time, users of this tool would have to contact customer support or sales to set up a custom review cycle. As Reflektive gained more users, it was clear that this method wasn't goin to scale.

THE USERS

Managers, HR, Admin

that need facilitate review cycles for their team and/or company.

Employees & Peers

that need provide feedback during review cycles for their team members.

With traditional review cycles, it's usually a manager or someone from HR that facilitates the review. With the 360 reviews, anyone can provide feedback to anyone. We expected managers, HR, and admins to be our main "creator" user for the review creation tool, and the employees/peers would mostly be secondary users (participants of the review) - but our design goal was to make review creation easy to use by anyone.

THE TEAM

UX/UI Designer (That's Me!)
Product Lead
Engineering Lead

I worked primarily with the product lead on creating new features and improving existing ones. Occasionally, the engineering leads would join mock-up review sessions to provide input on technical constraints.

ASSUMPTIONS

  • Users would be familiar with using Relketive

  • No new styling will be needed - user existing styles to match the platform

  • Users may have limited understanding on review types

SCOPE & CONSTRAINTS

  • 1-2 sprints (or as soon as possible)

  • Could only meet in person 2x a week.

  • Would have to depend heavily on product lead for guidance (taking words for face value)

Define

RESEARCH

To understand this feature better and to define "best practices", we compared various quiz and survey creation tools (Survey Monkey, Google Forms, Typeform). We found Google Forms to be too simplistic in their creation tools, though it was very easy to use. Typeform was the most aesthetically-pleasing, and while it was also easy to use, it still didn't offer as much functionality as Survey Monkey. We studied how Survey Monkey provided deep levels of customization, and took that with a grain of salt when thinking about how to build our tool. 

For our review creation tool, we decided that we needed these types of questions for decent customization:

  • Yes/No questions

  • Freeform questions

  • Rating scales

  • Numeric dropdown

  • Single option questions

  • Multiple choice option questions

Mocks

ITERATION 1

Since the Reflektive platform already existed, I had a style guide I could reference. My correspondence with the team happened through email, with a few office visits for reviewing requirements and mock-ups. I received some high-level sketches from the product lead that gave me a good starting point. To start, we focused on the first few steps of the review creation tool.

 The first version mimicked TurboTax - separating distinct parts of the process into steps. The second version combines the first version's steps two and three into just one step, and features a more traditional breadcrumb navigation. To reduce total number of clicks, we went with the second version, so our users could complete their task faster.

creationtool-1.png

ITERATION 2

The second round of mocks included creating different content for different types of reviews. For example, for 360 reviews, users would need a way to choose specific participants and an option for anonymity, so that the 360 review can be done with the utmost honesty and that the right people can review or be reviewed.  I decided to update the style by bringing it more inline with their general aesthetic because I felt the orange in the first iteration was too bold. By sticking to Reflektive's color palette of blues and greens, we limit the visual noise and bring focus to each step.

​Notable Changes:

  • Replaced warm colors (red and orange) with cool colors (blue and green)

  • Moved progression breadcrumbs to the top of the wizard for better visibility

  • Added a step to select participants for the review cycle

  • Tailored the "Settings" step to pertain to either 360 reviews or Performance reviews

ITERATION 3

After a few weeks, we reached a "shippable" version. This was the final iteration for my part. Stylistically, we decided to make the breadcrumbs green to distinguish the interface elements used for creating questions from the interface elements used for navigation. I also added disabled button states to ensure users understood they could not proceed to the next step until necessary information was filled out.

The previous buttons had a subtle gradient to them - we felt this felt dated and opted to simplify by going with a flatter style. While time constraints ultimately dictated how much we could restyle the interface, the overall impact was worth it - users now had control over their reviews. This feature is essential in making Reflektive stand out from other employee engagement platforms, and is one of four major products offered in their suite.

ref-3.png

Step 1: Configure

  • Introduced a third "premium" feature for goals review

  • Added a video tutorial to teach users how to create reviews

  • Changed breadcrumbs from blue to green, since blue will be used mostly with the creation interface

ref-4.png

Step 2: Settings

  • Added disabled button states to improve clarity for users

  • Changed buttons from a gradient style to a simpler "flat" style

ref-5.png

Step 3: Participants

  • "Add Employee" button will open a modal to add employees - this was a pre-existing element

  • "Only Some Employees" provides additional filters to quickly add certain departments, locations, and employees

  • Employee table is paginated instead of vertical scrolling to decrease development time and potential load time

Step 4: Create Questions

  • Decided on textual buttons over icons for editing and deleting for consistency (icons weren't being used much in the platform)

  • Designed tooltips to help users understand usage of certain elements

  • Designed for advanced options for creating multiple choice questions

Impact & Conclusion

The Self-Creation Review Tool launched and we continued to make improvements on it. Other features I helped design include advanced options for certain questions, and premium feature states to market the full potential of the tool to our users.

While it's been a few years since I've worked on this project, I'm happy to say that Reflektive has grown considerably - and so has their suite of products. The bones of the original design still exist, but many stylistic changes have occurred.

Some changes from the original include: re-purposing the icons I designed to fit their needs, updating the colors to match their evolving brand aesthetic, and structure as to where this specific feature exists in their product. To learn more about this feature, Reflektive | Performance Review

 

Case Studies

A SHOWCASE OF MY WORK AT REFLEKTIVE
Review Creation
Agenda Items

To help our users facilitate product 1x1 meetings, we created an agenda tool to integrate with their email client and the web app.

Goal Tracking

To help our users manage their teams, we created a way to track both individual goals and team goals.

  • LinkedIn - Black Circle

Connect with me on LinkedIn!

© 2019 Toni Chen. All rights reserved.