Credait

Context

Web design / Landing page / Concept

1st May, 2024 - 8th May, 2024

Credait

Context

Web design / Landing page / Concept

1st May, 2024 - 8th May, 2024

Credait

Context

Web design / Landing page / Concept

1st May, 2024 - 8th May, 2024

How can a junior UX designer use the 80/20 principle and significantly impact the user experience by tweaking the landing page and onboarding?

How can a junior UX designer use the 80/20 principle and significantly impact the user experience by tweaking the landing page and onboarding?

How can a junior UX designer use the 80/20 principle and significantly impact the user experience by tweaking the landing page and onboarding?

Overview

Overview

During the Indian General Election 2024, a frequently asked question to the government was about the rising unemployment rate in India.

While researching this issue, I discovered Credait.com on LinkedIn. Credait.com is an impressive concept that allows you to hire or get hired within a day. A friend has been working on it for a couple of years.

Approach

Approach

Summary
Summary

The current accessibility rating was 81, as a Google Lighthouse report shows. To enhance this rating and bring significant ROI, I focused on three key areas: contrast, readability, and spacing.

Project Goals
Project Goals

The primary task was to enhance the site's aesthetics by fixing contrast, readability & spacing.

Tools and Technologies
Tools and Technologies

Started with brainstorming using Figjam and ended up creating a fully functional prototype using Figma.

86

Major Contrast

Issues

By Contrast* plugin in figma.

81

Current Accessibil-ity Score.

Current Accessibility Score.

By Google lighthouse* report.

15%

Current onboarding experience

Mean of secondary research stats.

Part 1

Addressing Contrast Issues

Addressing Contrast Issues

Identifying Issues

Identifying Issues

The previous colour palette had major contrast issues. Using a contrast plug-in, I identified 86 places on the landing page that needed to comply with WCAG 2.0 guidelines.

Impact of Low Color Contrast

Poor contrast between text and background colours makes it difficult to distinguish the text, reducing legibility and comprehension. This is especially problematic for people with low vision, colour blindness, or other visual impairments, who may struggle to perceive low-contrast text.

The Web Content Accessibility Guidelines (WCAG) recommend a minimum contrast ratio of 4.5:1 for standard text and 3:1 for large text to ensure readability for most users.

Proposed Solution

I introduced a new colour palette and typography style that fully complies with WCAG 2.0 guidelines.

This new style enhances the overall look of the landing page, making it modern and creative while resonating with Credait's innovative approach to solving the hiring process in India.

Fig 1: Contrast 86 Issues by Contrast checker plugin

Fig 2: After applying the new colour pallet.

Fig 3: Contrast and Accessibility test of old colour pallet. Using Adobe color checker*.

Fig 4: Contrast and accessibility of new colour pallet.

Moodboard

Part 2

Enhancing Aesthetics and Onboarding

Enhancing Aesthetics and Onboarding

Creating a New Hero Section

I created a new hero section with the new style guide to encourage users to explore the platform.

This section introduces a new layout and concept, enabling users to explore the platform more intuitively without the traditional onboarding ritual.

Research Insights

52% of users who don't return to a website cite poor aesthetics as the main reason.

86% of users feel bothered when prompted to create new accounts on websites, preferring to fill out only a short registration form.

77% of respondents agreed that websites should offer social login options (e.g., Facebook, Google, Twitter). LinkedIn was chosen as the social login option for Credait.com, considering it's a hiring platform.

60% of users believe social login companies are more innovative and up-to-date.

65% of consumers are more likely to return to a website that automatically welcomes them through social login, creating a personalized experience.

Proposed Solution

I introduced a new colour palette and typography style that fully complies with WCAG 2.0 guidelines.

This new style enhances the overall look of the landing page, making it modern and creative while resonating with Credait's innovative approach to solving the hiring process in India.

Fig 5: Before

Fig 6: After

Results

Outcome

Upon evaluating the design decisions, a 50-80% increase in user satisfaction is expected. The process took about 5 days: the first draft was ready in 2 days, and after stakeholder review, it took 3 more days to finalize the version.

Metrics

A 50-80% prediction of ncrease in user satisfaction is expected.

Disclaimer

The design decisions and stats shown above are from secondary research. We will require heavy testing, such as A/B testing, user interviews, and heat maps, to ensure these results are expected.

0

Contrast Issues.

By Contrast* plugin in figma.

95

Expected Accessibil -ity Score.

Expected Accessibility Score.

Avg

50%

Increase in user-satisfaction upon Onboarding.

Read disclaimer*

Thank you for reading.

work@husainazeez.com

+447776339740

www.husainazeez.com

OPEN TO WORK

OPEN TO WORK