KitePull Logo

My Role

UI/UX Designer, Presenter
Product ideation

Interaction design

Prototyping

Visual and graphic design

Presentation to stakeholders

Overview

KitePull* is a professional network and compensation tool that allows employees to assess their workable skills, and know the salary expectations and progression paths within their industry through the site’s ML tools.

This allows the user to get a realistic range on their compensation value in the market; this is an especially important part of this product’s very identity – because even though other platforms on the market have a similar concept, there is a market gap to tailor salaries to each individual by considering a multitude of variables to suggest the best-fit job opportunities to them.

This product’s the brainchild of an ambitious startup in Europe, and a project as big and scalable as this requires the work of many passionate people! I created the concepts you’ll see on this page as a volunteer UI/UX designer alongside my full-time job and studies.

Background

I wanted to join a startup environment to contribute to the creation of a scalable project with less executive constraints and bureaucracy normally found in larger corporations. Upon finding and applying to the UI/UX designer position, I was interviewed and asked to provide possible concepts to one specific functionality - enabling the user to quickly and easily compare their salary potential and growth with others across an industry field’s spectrum.

Due to the global restrictions at the time, it was not possible for me to join the startup full-time, but I was very fortunate to be given the opportunity to take part in the early design process.

  • Ideation and early prototyping. Brainstorming to make the project’s concept a reality is both thrilling and scary. It’s a near-inevitability that a designer will second-guess deep down if they’d truly settled on the best idea that delights target users. That’s why creating a prototype and testing it is crucial. We can always go back to the drawing board if something needs to be improved or updated as the world advances faster than ever.

  • Wearing many hats. I communicated with the co-founder to understand the core functionality they were looking for, then went on to do my own secondary research to better understand other relevant sites and digital products. I worked on the sketches and determined the basic pattern library and visual themes to be followed, including possible typefaces and branding. Afterwards, I creating a prototype in Figma and presented the concept via online meetings and videos.

 Defining the Problem

Millions of people struggle to find jobs that are well-paid in proportion with the nature of the work, and the years of skill and education accumulated for it. Burn-out, mental fatigue, absence of work-life balance and exploitation by some employers has become the sad norm amongst my friend groups and colleagues across different industries.

And even for a fresh college graduate looking for a chance to prove him/herself and gain experience, it is imperative that they know the going range for the job they are seeking to go into their interviews informed.

In addition to the requirements provided by the co-founder, I used the findings of my secondary research online and casual discussions with colleagues to arrive at some common concerns:

  • Lack of transparency. Due to societal and institutional shaming of sharing salary with others, many people – especially new professionals – enter the workforce blind, not knowing their rights or value, thus falling victim to predatory practices.

  • Skill gap. There is a learning curve that fresh graduates and career shifters go through when taking on the new job, and in many cases, they are not fully aware of the skillsets they need to build or knowledge needed to gain in order to progress their careers, be it vertically or laterally. They don’t understand why a colleague who seemingly does their same job is paid much higher.

  • Exploitation and unrealistic expectations. Most entry level jobs today demand such a level of skill, education and experience that is near-impossible for a fresh graduate or career shifter to have, especially at the kind of salary provided. Some of these jobs even expect the employee to handle managerial-level responsibilities but receive neither salary nor title.

  • The trap of ‘absolute’ factors. A lot of the confusion that surrounds job search also stems from the fact that data found online is framed in absolute terms, usually stripped of important variables necessary for the job seeker to make an informed decision. Factors such as geographic location, language, gender, degree, skillset, positioning and many, many more play a crucial part in finding a good fit.

 User Personas

Julie T. User Persona
Mikal J's User Persona

 Proposed Solution

I conducted an interview with the co-founder and created several preliminary sketches to explore possible solutions for the salary comparison functionality, and plotted the shortened version of the typical user journey to get there. 

KitePull Early Ideation Note Samples

Some key features include:

  • Profile Crafting. In order to give the AI enough to work with for the recommendation and comparison system, users will be encouraged to fill out their work stats and history to enrich their profiles. This involves many indicators that can be used to create data visualizations and infographics, allowing the user to choose specific indicators they want to work on and compare with others in similar roles.

  • Career Search. The user enters a job position and 3 types of results appear:

    • Job listings adjusted to the user’s own profile

    • Statistics and salary ranges relevant to the job title

    • User Cards, also called ‘Kites’. Each user has a unique card/kite created out of their profile, and depending on whoever is viewing the card, it is color-coded to indicate the similarity index between both professionals. This enables the user to quickly select the users whose skillsets, experience and workplace they want to research to make an informed decision about their next step.

 Early Sketches

KitePull Early Sketches01
KitePull Early Sketches03
 
KitePull Early Sketches02
KitePull Early Sketches04

 Product and Design

KitePull aims to be the No. #1 product in Europe for accurate salary comparison and career plan design. My job was to provide concepts for the salary comparison functionality, then present the best idea as clearly and concisely as possible to the founders and other employees.

I created the sketches, followed by the wireframe and prototype. I also designed the placeholder logo and overall visual look to bring the hi-fid prototype closer to life. Afterwards, I created a short video to demonstrate the idea and discuss suggestions.

During the earliest iterations of this product, usability testing was limited to other non-designer employees. Feedback was collected and iterations were made to improve and address issues, from navigation all the way to color choices.  After changes were made, I would test again and re-send for further evaluation.

For the visual identity, I went for a minimalist, light UI to prevent possible cultural biases, and increase familiarity and trustworthiness.

Landing and Login Page
In line with keeping things simple and straightforward, the landing page has a simple call-to-action (CTA) to log in/sign up, and a short statement indicating to any newcomer what it’s all about. It only takes a couple seconds for the user to decide to give the product a shot.

KitePull Login Page

Career Search

We skip ahead to the fun part! The user searches for jobs within their preferred field and location, and 3 kinds of results emerge: job positions, stats, and Cards of other professionals in the field.

KitePull UX Project Career Search

User Cards

Cards are color coded to let the user know in a split-second how close or distant they are in terms of specialty, skillsets, salary ranges and more. This lets the user quickly and confidently select the card most suitable to their search priority, and both their own card and the other user’s are laid out opposite each other. Relevant data is shown in infographics, skills and statistics can be selected for further reading, and information about the users’ respective companies can be easily compared. 

Basic colors considered for the cards were as follows:

  • Blue indicates that the professional the user is viewing is very similar in terms of work experience, compensation, skillsets, etc.

  • Green indicates that the professional is working the title considered the logical next step for the user, with some important skills and other factors

  • Purple indicates that the professional is working at a higher rank, with several specific skillsets, knowledge, etc. the user may not have built yet

After some thought, I added the Randomizer option. This allows the user to have fun exploring skillsets and other paths in their field they may not have considered!

Demo

 Conclusion

Working with an early-stage startup remotely was a much-needed learning experience! Such an environment requires you to give results very fast, but also allows you the flexibility to try new things that larger corporations may take longer to allow. Also, presenting the concept and selling stakeholders on it is much more important than the aesthetic details that can always be fine-tuned later.

Lessons learned:

  • Communication is half the work. A crucial skill every designer must have; gathering as clear information as you can from your source – and keeping channels open, will save you a world of rework later on.

  • Stick to the requirements. A project such as this requires professionals from several different fields, from artificial intelligence to machine learning to content creation. Several people were working remotely, and so clear task allocation was necessary. Sticking to your target and avoiding “scope-creeping” yourself will allow you to focus and produce fast results and fast iterations.

  • Fast solutions are the best solutions. In many cases, there are already existing solutions to the problem you’re trying to solve. But if these solutions are slow and tedious, then they still have not addressed the user’s pain point well enough. Making your solution fix the user’s problem as fast as possible whilst giving them a sense of accomplishment puts you ahead.

Several iterations of testing with target users as the prototype matures would’ve been very insightful, whether conducted in person or through online testing tools. So naturally, designing test case scenarios proved to be challenging, especially when trying to solidify quantitative metrics such as the number of times an employee compared themselves to another on the same career trajectory and how many times they’ve emended related skillsets over a period of time.

Metrics such as this can only be deemed relevant once the users’ priorities and behaviors have been thoroughly studied in the testing sessions to focus on what really matters to them.

*The name of the product has been changed to KitePull for copyright reasons, as it’s still a work in progress.

Next
Next

Pupperitos - Tinder for Pets