responsive website redesign for job search portal

March 2015 – July 2015

Manpower.com’s job platform lacked mobile optimization and modern responsive design, impacting usability across devices.

I redesigned the experience using a responsive bootstrap 4.0 framework, delivering seamless cross-device usability while maintaining brand consistency.

My Role

Technical Leader - UX/UI

Stakeholders

UX/UI Designer, Bootstrap and React Developers, Backend Developer and Business Analyst

Company

Manpower.com

Tools

Mockflow, Bootstrap v.4, and Adobe Photoshop

Problem → Solution (Overview)

Problems Identified

Non-responsive design hindering mobile job search experience
Inconsistent UI elements across different screen sizes
Poor mobile accessibility for form fields and navigation
Fragmented user flow between desktop and mobile experiences

UX Solutions

Implemented fluid grid system with Bootstrap for seamless responsiveness
Redesigned navigation with mobile-first approach and clear hierarchy
Optimized form fields with proper touch targets (40-45px) for mobile
Maintained consistent design across all breakpoints

Design Approach

Working closely with Bootstrap developers and following the client's existing style guide, I focused on transforming static layouts into responsive, mobile-optimized experiences.

Design Objectives

Based on insights and business requirements, I designed a system that was:

• Responsive Excellence - Seamless experience across web and mobile
• Mobile-First Design - Optimized for mobile job searching
• Enhanced Job Search - Improved search and application flow
• User Profile System - Streamlined registration and preferences

Key Design Features

Responsive Design Principles Applied

Consistency: Maintained uniform colors, typography, spacing, and component sizing across all breakpoints
Element Reshuffling: Strategic content reordering based on viewport size while preserving key functionality visibility
Touch Optimization: 40-45px minimum touch targets for buttons and form fields on mobile devices
Clear Navigation: Implemented breadcrumbs, contextual headers, and intuitive menu structure for seamless user orientation

Sign-up Screens(mobile version)

User's can sign-up, create profile and set preferences.

Sign-up Screens(desktop version)

User's can sign-up, create profile and set preferences.

Implementation & Testing

The technical implementation process we followed: Bootstrap Framework for responsive grid system, Fluid images and media queries for optimal content scaling, Cross-device compatibility testing and optimization and SEO-friendly structure with semantic HTML.

I closely collaborated with developers throughout every stage of the Bootstrap website development, ensuring adherence to a responsive design process to deliver a seamless experience across all devices.

Key Performance Metrics

Improved user engagement across mobile and desktop
Enhanced job search accuracy with responsive filters
Increased mobile application rates through optimized forms
Seamless cross-device experience maintaining user flow continuity

Outcome & Impact

Results Achieved

The project successfully transformed Manpower.com into a modern, responsive platform that serves blue collar job seekers effectively across all devices, maintaining brand consistency while significantly improving mobile usability.

Client & Market Impact

The responsive redesign significantly improved Manpower.com's mobile accessibility, enabling blue collar job seekers to search and apply for positions seamlessly across devices. The Bootstrap implementation reduced development time while ensuring consistent user experience, helping Manpower Group maintain their competitive edge in the job listing market.