randrr

The client was looking to build a ground-up marketing site that targeted job recruiting and career guidance for the US market, expanding globally in a few years.


Role: UX/UI Designer    |   Agency: Telepathy    |    Client: randrr

 
 
R · 01.jpeg
 
 
 

The Project

 

While we did not develop the brand identity, our team was critical in refining the brand archetype from creator to sage— fundamentally altering the design tenets, overall UX, and supporting the engineering efforts.

 
 
 
Mobile First UX

For its MVP, randrr would launch as a web application with plans to expand to native iOS during future releases. With this in mind, we designed a fully responsive design with a mobile-first approach. The design of the application focused on introducing patterns and interactions that made it easy for users to set goals and get a clear career path to get to their dream job.
 
Responsive Design

randrr was designed to be used by a wide range of users, from college students, to people looking to grow within their industry, to people who want to change career paths entirely. The design of a responsive platform allowed us to cater to users from different ages, industries, and levels of web use.
 
Personalized Recommendations

Inspired by mentorship, sharer of wisdom and insight, we decided to leverage “The Sage” as the brand archetype for randrr. From the moment when users subscribed to a newsletter, to the moment in which they interact with the application, randrr’s goal was to provide information that was relevant, timely and practical. Introducing this brand archetype  unified randrr’s marketing, ux copywriting and messaging voice with one that was reflective of a trusted source of information.
 
WCAG Accessibility Compliance

In an effort to make the application accessible to as many users as possible, we created and tested a color palettes with enough text contrast and appropriate font sizes to meet the Level AA WCAG 2.0 text contrast standards.
 
Responsive Design System

Our visual design strategy utilized  a 4px grid to build responsive components that could expand across multiple breakpoints. The use of a 4px grid, versus the conventional 8px grid, gave us a greater range of flexibility to design for different pixel densities and prevent drastic changes on component and typography proportions across different screen sizes.
 
White-label Components

From a company perspective, users could join randrr to create customized profiles and post jobs on the market. In order to keep profiles focused, but informative, we provided a set of white-labeled components that served as modules companies could chose to turn on or off depending on their hiring needs and the amount of visibility they were looking to make public.  
 
Custom Iconography & Illustrations

In order to support content and add personality to the marketing site and application, we designed custom iconography and illustrations that were closely tied with the themes of skill improvement, moving ahead on a career path and finding a dream job.