PA Lawrence Website

PA Lawrence Rebranding & Website Overhaul

Modernizing a 15-year-old brand to position it as an infrastructure leader.

Context

Role: Lead UI/UX Designer
Type: Corporate Rebranding & Website Overhaul
Tools: Figma, Framer/Webflow

Impact at a Glance

Elevated the digital identity to match 15 years of industry leadership.

The Business Challenge

PA Lawrence is a titan in the Nigerian construction industry. Since 2009, they have executed over 100 projects, expanded across multiple states, and secured federal licensure from the Ministry of Mines. However, their digital presence did not reflect this 15-year legacy. They were a "world-class" company offline, but their online footprint felt outdated and small-scale.

The Problem

Even though they have 15 years of experience, their old website was severely outdated and didn't reflect their value. It looked like a generic template for a small startup, rather than a company licensed by the Federal Government

My Approach

From Rough Sketches to Polished Product I didn't just jump into the final design. I followed a structured process to ensure the new look was both beautiful and functional.
Step 1: Moodboarding & Visual Direction
I started by gathering moodboards of top-tier global infrastructure firms. I wanted to move away from the "generic template" look and find a visual style that felt heavy, trustworthy, and established.

Step 2: Wireframing the Journey
Before designing the visuals, I created low-fidelity wireframes to fix the site's structure. My goal here was to map out a user journey that guides clients from the "About Us" section directly to the "Portfolio" in as few clicks as possible.

Step 3: High-Fidelity Design
Once the structure was solid, I applied the new brand identity using bold typography and full-width imagery to create that cinematic, "world-class" feeling.

THE SOLUTION

The "Bulletproof" Row Component I delivered a master component designed to handle real-world data stress without breaking.

Fluid Responsiveness: I utilized Auto Layout’s Fill Container property for the "Notes" and "Check Name" columns. This allows the table to stretch to any screen width while keeping status indicators aligned.
Boolean Properties: I built "switches" into the component interface. Designers can now toggle states (e.g., Review Needed? = True) instantly without detaching the instance.
Interactive States: The component includes built-in Hover, Pressed, and Selected states, reducing the guesswork for developers during handoff.

THE SOLUTION

The "Bulletproof" Row Component I delivered a master component designed to handle real-world data stress without breaking.

Fluid Responsiveness: I utilized Auto Layout’s Fill Container property for the "Notes" and "Check Name" columns. This allows the table to stretch to any screen width while keeping status indicators aligned.
Boolean Properties: I built "switches" into the component interface. Designers can now toggle states (e.g., Review Needed? = True) instantly without detaching the instance.
Interactive States: The component includes built-in Hover, Pressed, and Selected states, reducing the guesswork for developers during handoff.

The Results

A Digital Headquarters I delivered a fully responsive website that serves as a 24/7 presentation of their capabilities.

The "Legacy" Homepage: The first thing users see is a cinematic showcase of their infrastructure work, immediately proving they can handle big jobs.
Interactive Timeline: A dedicated history section that allows investors to scroll through their milestones, from their first project to their 100th.
Clear Services: Distinct, easy-to-read pages for Real Estate, Commercial, and Infrastructure so clients know exactly what they offer.

What I Learned

I realized that for a company like PA Lawrence, their "15 years of experience" is their biggest asset. Highlights their history wasn't just about facts; it was the best way to build trust with visitors.