TurboHire's Chrome Extension
TurboHire Connect
Revamping the TurboHire current chrome extension to a design that is more user-friendly has a clear flow of information and is a tool that users want to get addicted to whenever they think of extracting candidates to their hiring portal.
Role: UX/UI Designer & Researcher
Timeline: 1 month (Implemented)
Team Involvement: With Product Manager
Project Status: 🚀 Launched
Navigate to -->
![Frame 2152 (1).png](https://static.wixstatic.com/media/aa2d36_96be616de250487c95e9ee3ba92ff763~mv2.png/v1/fill/w_489,h_444,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/aa2d36_96be616de250487c95e9ee3ba92ff763~mv2.png)
About
Talent Connect is a chrome extension and web application that improves the recruiting process. Talent Connect uses machine learning technology to help recruiters find, contact and add candidates more easily. Main possibilities include smart search, storage of candidates and providing information about candidates from different sources.
Benefits of TH Connect
-
AI Technology helps find better more suitable candidates
-
Search in several sources simultaneously
-
Quick access to candidate contacts
-
Possibility to see candidates statuses in the hiring process
-
Comments to share opinions about a candidate added
Research Findings
A comparative study on TurboHire's chrome extension and current chrome extensions that help users extracts candidates from different job boards and social media websites to their platform. Listing where our company's free tool lacks and which features can be better represented both in terms of UX and UI.
![1.png](https://static.wixstatic.com/media/aa2d36_3890606d7ad54ed5aa1b15d9e08a876a~mv2.png/v1/fill/w_980,h_639,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/1.png)
![2.png](https://static.wixstatic.com/media/aa2d36_92791edc71be4550aad09925df86af39~mv2.png/v1/fill/w_974,h_635,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/2.png)
![3.png](https://static.wixstatic.com/media/aa2d36_806a8a34fe9c448ab97ae117c96c43ef~mv2.png/v1/fill/w_933,h_608,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/3.png)
User Persona
After the first level of research, a user persona helps in defining the target audience to encapsulate all the necessary touch points within the product. It creates a boundary and gives direction to plan and design a tool personalized for the target audience.
![4.png](https://static.wixstatic.com/media/aa2d36_7dcdb7a7d9c94583bbbc764ae595f9a3~mv2.png/v1/fill/w_1192,h_672,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/4.png)
References
The following references helped in understanding us that full side panel design can be utilized for a chrome extension, as it showcases information better.
Our Top Most point of references were :
-
Lusha
-
Zap Info
-
Hiretual
-
Zoho Vault
![5.png](https://static.wixstatic.com/media/aa2d36_8a9d7b1014e84ca19de68ec419c4fc21~mv2.png/v1/fill/w_488,h_443,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/aa2d36_8a9d7b1014e84ca19de68ec419c4fc21~mv2.png)
Conclusion
Onboarding process should be a major issue to address while redesigning, along with navigational issues mentioned above. To include helpful features better, we should improve users flow in the extension and application, create an experience that guides users and informs about every step that they take. Previously done interviews and journey map will help us in creating that process close to what recruiters used to that will help them
navigate better on the system.
Implementation Plan
For a successful product launch, it is important to be in sync with all teams involved in the process. Many a time a situation arises where a design might be great but the feasibility to implement it by the engineering Team might lack due to various factors like timeline and level of difficulty. Problems could also arise in terms of business requirements at the given time or marketing planning. Hence, discussions with all teams is imperative to have a realistic goal setting and work accordingly.
![6.png](https://static.wixstatic.com/media/aa2d36_6b3e253ad1034ab8aebb03134bb7a9fc~mv2.png/v1/fill/w_746,h_335,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/6.png)
![7.png](https://static.wixstatic.com/media/aa2d36_dac537097b4f4eadae7e96f0186da775~mv2.png/v1/fill/w_1017,h_692,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/7.png)
Version 1 Plan
Login Screen
-
Welcome Message
-
Sign In
-
Sign Up
-
Sign Up with google
-
Remember me
-
Terms of Service
-
TurboHire Connect
-
Heading
-
Sub- Heading
-
Forgot Password- In case of error log in
About
-
Quick Steps on how to use the tool
-
User Id
-
Settings
-
Add Candidates
Candidate Interaction
-
Show contact details
-
Add to job
-
Activity/ Already Added Feature
-
Add multiple candidates
User Journey
Mapping a User Journey to understand all major touchpoints helps in building an organized flow and helps the designer understand the length and breadth of the work involved.
![8.png](https://static.wixstatic.com/media/aa2d36_ebb277f130e94a61ae3f0cd8be201ac5~mv2.png/v1/fill/w_1304,h_365,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/8.png)
Initial Designs
Initial attempts at creating a basic design flow of the chrome extension.
![Frame 1920.png](https://static.wixstatic.com/media/aa2d36_815b0aa7b6b44cc5a547408a164ea98a~mv2.png/v1/fill/w_1384,h_271,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Frame%201920.png)
![Frame 1919.png](https://static.wixstatic.com/media/aa2d36_e19fbf5cf2c444d0a23c786e5fdcfa01~mv2.png/v1/fill/w_1388,h_263,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Frame%201919.png)
Final User Flows
The following flows are detailed step by step instructions of a user journey experience with the chrome extension. It is divided into two major sections- Sign In and Sign Up flow and the second is the Adding Candidate Flow. The Following designs have been curated to meet two user needs - Individual or Bulk schedule candidates. Individually through LinkedIn or in bulk through Hirist, or IM Jobs.
Sign Up/In Flow
Chrome Extension Download--->Sign Up/In-->Account Creation--->Go to LinkedIn/Visit Portal
![Frame 2152.png](https://static.wixstatic.com/media/aa2d36_aebffd6a2f5441bcb0424288f05bc5bf~mv2.png/v1/fill/w_1165,h_1167,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Frame%202152.png)
Complete Screens
*Hover over images to see the name of the stage*
![Signup](https://static.wixstatic.com/media/aa2d36_59c83a2e01c7483fb83c622bb08a81ec~mv2.png/v1/fit/w_980,h_549,q_90/aa2d36_59c83a2e01c7483fb83c622bb08a81ec~mv2.png)
![Welcome](https://static.wixstatic.com/media/aa2d36_c5b0a0f36e8f4feb98cb0ac993397482~mv2.png/v1/fit/w_980,h_549,q_90/aa2d36_c5b0a0f36e8f4feb98cb0ac993397482~mv2.png)
![Browser -Sign In](https://static.wixstatic.com/media/aa2d36_088bd72a3e0a4d8cbf1040ed1b2582a8~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_088bd72a3e0a4d8cbf1040ed1b2582a8~mv2.png)
![Disabled State- Candidate Card](https://static.wixstatic.com/media/aa2d36_5066dbc8249147f08e2e5147990f6d8c~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_5066dbc8249147f08e2e5147990f6d8c~mv2.png)
![](https://static.wixstatic.com/media/aa2d36_dfe1adc8e2c740dd9e82fd6d6c34737e~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_dfe1adc8e2c740dd9e82fd6d6c34737e~mv2.png)
![Disabled State- Candidate Card-5.png](https://static.wixstatic.com/media/aa2d36_2e88cde1f37c42788eb77e5f5e31ba23~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_2e88cde1f37c42788eb77e5f5e31ba23~mv2.png)
![Disabled State- Candidate Card-6.png](https://static.wixstatic.com/media/aa2d36_55ba7b8d55064aa78e3188112742cd3c~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_55ba7b8d55064aa78e3188112742cd3c~mv2.png)
![Disabled State- Candidate Card-7.png](https://static.wixstatic.com/media/aa2d36_a2c3eb565e8e4640b978f13c84669601~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_a2c3eb565e8e4640b978f13c84669601~mv2.png)
![Disabled State- Candidate Card-8.png](https://static.wixstatic.com/media/aa2d36_4778c7de3aab4d1a9d93688c8b029f13~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_4778c7de3aab4d1a9d93688c8b029f13~mv2.png)
![Disabled State- Candidate Card-2.png](https://static.wixstatic.com/media/aa2d36_909029303fa247289b98e55083107450~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_909029303fa247289b98e55083107450~mv2.png)
![Disabled State- Candidate Card-3.png](https://static.wixstatic.com/media/aa2d36_b65eea7be5864ec980e617d0178297c1~mv2.png/v1/fit/w_980,h_561,q_90/aa2d36_b65eea7be5864ec980e617d0178297c1~mv2.png)
Adding Candidate Flow
Open Profile--->Extract Candidate--->Candidate Detail--->Additional Details--->Add To Bank--->
Candidate Added--->See profile in portal
1. Single Candidate through LinkedIn
![1.png](https://static.wixstatic.com/media/aa2d36_956e50f049b641b78c0eda37356c1603~mv2.png/v1/fill/w_1084,h_364,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/1.png)
![2.png](https://static.wixstatic.com/media/aa2d36_54c4a2bf9eab4ce3a57754ce4ae098a8~mv2.png/v1/crop/x_0,y_0,w_13898,h_4959/fill/w_1057,h_377,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/2.png)
![3.png](https://static.wixstatic.com/media/aa2d36_918f5a6b336d4d51b1e3e075c8d2794f~mv2.png/v1/fill/w_1074,h_236,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/3.png)
![4.png](https://static.wixstatic.com/media/aa2d36_3be1020fbf8341fbb510cc53d12cda0b~mv2.png/v1/fill/w_1074,h_236,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/4.png)
![5.png](https://static.wixstatic.com/media/aa2d36_8a7e69bb02704e958e1da8c1fc00ed82~mv2.png/v1/fill/w_1096,h_425,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/5.png)
2. Multiple Candidates through Hirist, IM Jobs
![1.1.png](https://static.wixstatic.com/media/aa2d36_2efb2b1f31fc4f68bd0be02a2ae90b4d~mv2.png/v1/fill/w_1104,h_801,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/1_1.png)
Product Walkthrough Video
Created a video from a Product Marketing perspective to help users understand the flow of the Chrome Extension and ease them in the process
![](https://static.wixstatic.com/media/aa2d36_855a199e624046dfb6eb3b23cf5ede74~mv2.png/v1/fill/w_1115,h_558,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/aa2d36_855a199e624046dfb6eb3b23cf5ede74~mv2.png)