"Everyone deserves a second chance"

Overview

Context

Academic

Group Project

Fall 2023

Role

UX/ UI Designer

Graphic Designer

Timeline

12 weeks

Tools

Figma

Adobe InDesign

Adobe Illustrator

Where it started

With the rise of electric vehicles, many oil and gas workers face job insecurity. In fall 2023, our class worked on a three-month project to develop a web app aimed at supporting these workers through career transitions.

Cocoon uses AI to analyze resumes and job data, providing personalized career paths, timelines, and recommended courses to help oil and gas employees smoothly transition into new industries.

First Challenge

Understanding the Problem

The core challenge we faced was understanding the specific needs of oil and gas workers transitioning to different industries, and how best to provide personalized, actionable guidance.

Competitive Analysis

To address this challenge, we conducted extensive market research and competitive analysis. By examining platforms like LinkedIn, Indeed, Coursera, Jobbank, and Canada.ca, we identified gaps in existing services and opportunities for Cocoon to provide a more tailored solution.

Key Insight

Uncertain about how their current skill set could transfer to other industries.
A need for clear guidance on career paths, including recommended courses and timelines to successfully transition into new roles.
Lack of Personalization: Many workers expressed frustration with generic job search platforms that didn't take into account their specific experiences and skill sets.

Second Challenge

Our second challenge was ensuring the app's design and functionality would align with the needs of users like Drake Edwards, our user persona—a typical oil and gas worker looking to switch careers.

Problem Statement: How can we design a web app that offers a personalized, smooth, and supportive career transition journey for oil and gas workers, while using technology to break down complex data into easily digestible insights?

Key Insight for design

We adopted the Atomic Design methodology to ensure maximum flexibility in our design system. This approach allowed us to break down pages into smaller, reusable elements ( "atoms”), making it easier to update and maintain the app as it grows.
We selected a bluish-green color palette to evoke trust, clarity, and a sense of calm, helping users feel confident and reassured in their career transition journey. The Roboto and Ubuntu font were chosen for its modern and approachable look, reinforcing the app's friendly and professional tone. Here's the style guide:

Third Challenge

We had to ensure that Cocoon would fit into the already-established job-search ecosystem, yet stand out in terms of its personalized, career-focused approach.

Creating the MVP

We developed a Minimum Viable Product (MVP) for Cocoon, keeping it focused on providing essential features: AI-powered career paths, recommended courses, and career transition timelines. The MVP was designed to test the core functionality and collect user feedback for future iterations.

View Prototype

Boosting the MVP: Branding & Visual Identity

Logo Designing

The branding focused on the idea of transformation. The name "Cocoon” represents changing careers, like how a caterpillar becomes a butterfly. The logo shows this process, with the cocoon representing the journey and the butterfly symbolizing new beginnings. Here's from initial design to the final one.

Marketing & Collateral

While designing the business card and brochure, I focused on creating a simple, yet elegant and professional design that effectively conveys the product information in a clear and visually appealing way.

Madhu