Optimized Responsiveness
and Accessibility

Optimized Responsiveness & Accessibility

Optimized Responsiveness
and Accessibility

Optimized Responsiveness
and Accessibility

Navigate to

Navigate to

Overview

Problem
Problem

The website has an outdated design, non-intuitive navigation, heavy text content, and poor mobile responsiveness. These issues compromise user engagement and reduce the likelihood of conversions.

Outcome
Outcome

A revamped website with modern UI/UX principles enhances user engagement, improves navigation, optimizes mobile responsiveness, and ultimately increases conversion rates.

My Role
My Role

Product Designer

Timeline
Timeline

10 Days

Research Phase

Research Phase

Research Phase

Insights

Difficult to navigate & find information

The existing website lacks modern aesthetics and usability, making it difficult for users to navigate and find information quickly. There is also a significant opportunity to streamline content for better readability.

(Previous Design)

(Previous Design)

Competitive Analysis

Identified content & design patterns

I analyzed 3-4 top expatriate websites to understand what type of experience visitors get when they land on the websites. I also identified the content and design patterns for different sections, and formed hypothesis over what should be included in a website and how it should be displayed.

Hypothesis

Hypothesis

By implementing a modern, user-centric redesign focused on intuitive navigation, streamlined content, prominent CTAs, and enhanced mobile responsiveness will significantly improve user engagement and conversion rates.

By implementing a modern, user-centric redesign focused on intuitive navigation, streamlined content, prominent CTAs, and enhanced mobile responsiveness will significantly improve user engagement and conversion rates.

By implementing a modern, user-centric redesign focused on intuitive navigation, prominent CTAs, and enhanced mobile responsiveness will significantly improve user engagement and conversion rates.

Ideation Phase

Sitemap

Organizing & structuring the pages

Created a sitemap to define the hierarchy of pages and ensure intuitive navigation, making it easier for users to find information quickly and efficiently. The sitemap served as a blueprint for organizing content and improving the overall user experience by providing a coherent and navigable structure.

Wireframes

Early visualization of design layout

Wireframes allowed for early visualization of the design and helped identify potential usability issues before detailed design work began. They served as a foundation for discussing and refining design ideas, ensuring that the final product would meet user needs and business goals effectively.

Design Phase

Design Phase

Style Guide

Reflecting brand's identity & values

A comprehensive style guide was developed to standardize the website’s visual elements. This ensured a unified look and feel, enhancing the user experience and reinforcing the brand’s identity.

Typography

Montserrat

Montserrat

Montserrat

Montserrat

Montserrat is the font.

Montserrat is the font.

Montserrat is the font.

Montserrat is the font.

Montserrat is the font.

Montserrat is the font.

Montserrat is the font.

Montserrat is the font.

Color Palette

#D4AF37

#8F8F8F

#FAFAFA

#070502

Website Design

Redesigning the interface with a better UX

Revamped the previous design by making it visually appealing with improved navigation, streamlined content, emphasized CTAs, and enhanced accessibility features, which you can see below.

Revamped the previous design by making it visually appealing with improved navigation, streamlined content, emphasized CTAs, and enhanced accessibility features, which you can see below.

Prototyping

Walk through to show what's inside

Walk through to show what's inside

Check out the prototyping of the revamped website design by clicking on the buttons below.

Check out the prototyping of the revamped website design by clicking on the buttons below.

Final Takeaways

Final Takeaways

01

01

01

Collboration

I've collaborated with different departments for this project, from copywriting to graphic design to development. Every person played their part, and their feedback helps me in refining the final outcome.

02

02

02

Continuos learning

Since I didn't know anything about expatriates and their benefits. Through research, I gained an understanding of its application, which definitely helped me acquire new knowledge.

03

03

03

Time management

Collaborating with other departments to deliver the final outcome on the deadline helps me manage time effectively and use resources wisely.