Linkedin Redesign

This project were made with the collaboraiton of Hyanca Moura, a Project Manager. We both were in the beggining of our carreers, and united to learn together, we are proposing here some changes on the tool we use the most, (and have problems the most): Linkedin!

The Problem

In times of pandemic and unemployment, the number of users has skyrocketed and because of that, filters to search for jobs are being used now more than ever and it's possible to notice some non-intuitive details that have great opportunity for improvement, besides the inconsistent UI and visual pollution in the users' feed and profile.

Oct 1 2020
Rating of 4 stars
When will dark mode be available?
Nov 17, 2020
Rating of 2 stars
A social network that seeks to connect professionals and help them look for a job, but when you register your data and apply for a spot, you are sent to another website that: either you have to pay to participate or you have to answer the same questions again.
Nov 8,2020
Rating of 1 star
Ugly design. Very white, without any contrast with other colors, it was difficult to use, and it made the experience worse. I will only use the app when I don't have a computer nearby.

Goals

The focus of this project is to study the main activities of users on LinkedIn, understand what the main pains are and implement improvements to make the tool simpler to use, more pleasant and efficient for the user.

The Process

During the process, we did some quantitative and qualitative research and managed to map insights, confirm assumptions and answer questions that we had raised right at the beginning of the project.

+700 Million

Members in 200 countries and regions worldwide

In the quantitative research, it was possible to identify what are people's main activities when using linkedIn. These results were essential to define the personas.

Update about the Job Market
59,4%
Improve my network
50%
Search a new job
37,5%
18%
Of traffic is Mobile
57%
Of users are men
59%
of users are between 25 and 34 years
40%
of users change their job every 4 years

Personas

Picture of persona 1. Young men with bear and long hear

Julian Martin

Graduated in Information Systems, he currently works from home as a programmer. He doesn't use social media often and is looking for new job opportunities.

Specialist

Curriculum, Networking, updating about the marketplace

Content Creator

Networking, content creation, updating about the marketplace

Young woman, with a short red hair, serious expression

Mariana Backer

Graduated in law but recently switched to marketing. She uses social media frequently and is always writing articles and generating content.

3rd persona - black woman, well dressed, with her hair tided up

Rafaela bastos

Graduated in Human Resources, she currently works as a recruiter and is always using LinkedIn to contact potential candidates.

Recruiter

Corporate, Account management, Networking, Headhunting,  Community human resources

Job Story

When

I'm looking for a job spot

I want/need

job spots compatible with my search

So I can

apply for the ones I'm interested in

Success Premise

Easily apply for jobs that interest me.

So i can

Compare which content my connections identify with the most

I want/need

to be able to analyze post engagement

When

I make a post

Success Premisse

Being able to analyze data to increase engagement

When

I look for a candidate

I want/need

to see their personal information and work experience in a clear and simple way.

So i can

Quickly filter to find the best candidate

Succes Premise

Agility in the search for the ideal candidate

Wireframe for mobile version with lines to simulate a dashboard
Wireframe with blocks and random text to simulate a feed page for mobile
Wireframe with blocks, text and numbers to simulate a profile page for mobile
Wireframe for web version with lines to simulate a dashboard
Wireframe for web version with lines to simulate a dashboard

Typography

Open Sans

14px - Body (REGULAR)

A
20pt - Header (BOLD)

Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

Colors

#0077B7
#333333
#557642
#0A66C2
#4F4F4F
#DD5919
#132B38
#828282
#CCE4F1
High fidelity wireframe, with random pictures of people. Feed page for mobile, with an example of a post.

Feed

The main changes in the feed were in the top menu, stories and like, comment and share icons. We also changed the position of the profile button that previously required two steps to access

Since the repost button is used less often, we left it at the top of screen

Access to the profile has become easier according to users who have tested this new model

Profile

We divided the profile into three tabs to prioritize information and leave a specific space for the main information sought by users when accessing a profile.

High fidelity wireframe for mobile, with random pictures and numbers. It’s an example of how many connections the person have, how many post.
High fidelity wireframe for mobile, that shows about how to display the work experience, study and more details about the person’s careers
High fidelity prototype for mobile that shows the posts that a specific person did. There is just random images and text displayed in blocks

On the “About” tab we have information about connections, location, social networks and a brief introduction

In the profile, we have experience, education, skills, recommendations and projects

And on the last tab we have all posts shared by the user

High fidelity wireframe for mobile version with lines and colors to simulate a dashboard

Dashboard

We've added a page that gathers some data about the last people who visited your profile. Below it shows where they work and what their positions are. These charts can be filtered by period and by region.

By dragging to the side, you can navigate through the other menu options

High fidelity wireframe for mobile that shows result from a a simulated search where also you can use filters by location, profile language, current company etc. to find people
High fidelity wireframe for mobile that shows result from a a simulated search where also you can use filters by location, profile language, current company etc. to find a job

It is possible to filter only by job spots that can apply within the platform, without being forwarded to another site

Jobs

We've made this page as simple as possible, just so the user can view the recommended jobs spots, save for later, see the details and apply

High fidelity wireframe for mobile that shows how to search a job. On the screen it’s possible to get job alerts

Desktop

Feed

In the desktop feed version we made bigger changes. The menu was located on the upper right corner and the user's personal information was located on the left side menu and they can be viewed regardless of the page the user browses.

High fidelity wireframe for desktop that show how the feed page would look like. We have a menu on top of the page where the user will be able to to move on the site

We have included a space for the main news being shared.

High fidelity wireframe for desktop that shows details about the sidebar, where it’s possible to see how many connections and views the user has.

Just like in mobile, here we have a space to add other social networks that make sense for the user to share with their network.

Profile

In the profile we keep sections similar to the mobile version, the left menu has the most basic information, in the first block we have experiences and in the second, shared posts

High fidelity wireframe for desktop that shows a sidebar menu, with the content in the middle. Content related to the user, with the work experience, study and other information. On the right side there is the 3 last posts from that user

Jobs

On the job spots page we enabled viewing the jobs details  right next to the jobs list, so the user can view all jobs spots, save or apply them, all in the same environment.

High fidelity wireframe for desktop that shows the jobs offered on the platform, keeping the consistency with a left side menu bar, the offers in the middle and the offer selected details on the right side.

Dashboard

The dashboard has a similar structure to mobile and is where the user will be able to analyze the access metrics on their profile and sharing posts.

High fidelity wireframe for desktop that shows the dashboard and filters where the user can use to see the historical of their profile. Examples would be number os vies, who viewed their profile, the companies, what are the roles those people work with.

Dark mode

Finally, we also brought the dark version that is much requested by LinkedIn users. We tried to leave the contrast colors with a lower saturation and the background darker with dark gray in some details