Computer monitor displaying a futuristic luxury sports car with black and orange accents, set in an urban environment with tall glass buildings at night.

Lux Car Co.

Project Details

UX UI Designer

5 weeks

Figma, Figjam, Canva

Intro

Lux Car Co. is a premium automotive brand known for luxury vehicles that combine advanced technology, quality materials and outstanding performance. It targets high-income individuals who value exclusivity, craftsmanship and sleek design.

Problem

Lux Car Co.’s digital presence lacked the bold, premium appeal its audience expected. The redesign aimed to convey luxury, exclusivity and performance while staying true to the brand’s values.

Solution

The solution was to redesign Lux Car Co.’s website into a premium, user-centred digital experience that reflects the elegance and innovation of its vehicles.

A visual representation of a five-stage process: Discover, Define, Ideate, Design, Deliver. Each stage lists specific activities or deliverables, such as competitor research, mood board, user research, stakeholder interviews, sketches, wireframes, design system, UI screens for desktop and mobile.
Collage of car images, logo, and businesspeople, with text about Lux Car Co.'s mission, branding, and vehicle options, emphasizing luxury, performance, and customer service.

Mood Board

Logos of Bugatti, Audi, Tesla, and Pagani auto brands

Competitor Research

Branding

Competitors leaned towards either light, open layouts (Tesla, BMW, Mercedes) or dark, premium ones (Bugatti, Bentley, Pagani). Inspired by Bugatti’s sleek black background, bold typography and immersive visuals, I adopted a dark aesthetic for Lux Car Co. to emphasise exclusivity.

Typography

The logo uses New Amsterdam for a refined, contemporary feel. For web text, I chose Barlow Bold Condensed for subheadings and Regular for body copy - balancing clarity and impact.

Colour

A high-contrast palette against dark backgrounds conveys power, energy, and innovation, while passing accessibility checks.

Audience

The visual identity was designed to feel inclusive and aspirational, targeting a broader, diverse demographic of men aged 35–45, in line with modern industry trends.

Flowchart illustrating a booking and payment process, with steps including landing page, exploring models, booking consultation, customer information, payment, and different outcomes like successful payment, booking confirmed, or error.

Information Architecture

The site uses a clean, minimal structure to guide users with clear pathways and logical page groupings.

The Landing Page introduces key sections (Our Promise, Services, Hybrid Range) in scrollable blocks, while the Models Page acts as a catalogue with details and key actions.

Navigation flows simply from:
Landing → Models → Booking (Consultation, Rent, Buy) → Confirmation/Cancellation.

Handwritten sketches of webpage layout ideas, including headers, menu options, model displays, and content sections, with notes and annotations.

Wireframes

Wireframe of a mobile website and desktop version for Lux Car Co., showcasing homepage, vehicle models, services, values, and consultation booking sections.

I created several iterations to improve clarity, responsiveness and overall user experience.

“Our Promise” and “Our Services” were simplified by reducing text, removing dark boxes and pairing each point with an image, making content easier to scan.

For “Hybrid Range”, I replaced stacked images with one hero image and a swipe bar, cutting clutter and giving users more control.

A style guide comparing brand colors, fonts, and interface elements for a vehicle company called Lux Car Co., showing color tokens, typography, button states, navigation menu, and image layouts for desktop and mobile.

Design System

The Lux Car Co. design system was created in depth to ensure a consistent, scaleable and premium identity across the digital experience. It serves as a source of truth for UI elements in preparation for hand off and future development.

Creating my first design system was challenging. I initially tried to define elements before the final screens, following typical practice, but found it difficult. Designing the screens first and returning to the system afterward was a valuable lesson in discovering my ideal workflow.

UI Screens

Screenshots of a luxury car dealership website showcasing various high-end cars, features, and services.

I applied key UX principles to create an intuitive, responsive experience across devices. Using Miller’s Law, I reduced visual overload by replacing a vertical stack of four car images with a horizontal swipe bar.

Following Hick’s Law, I simplified choices by limiting images to 2–4 per section. Figma Auto Layout kept layouts scalable and consistent, resulting in a premium, user-friendly interface that reflects Lux Car Co.’s brand.

Black sports car with glowing red wheels and yellow headlights, low lighting, sleek design.

Reflection

This project strengthened my understanding of UX/UI design and gave me hands-on experience with the processes behind creating a digital product.

It reinforced the importance of keeping the user at the center of every decision - I regularly put myself in the user’s shoes, questioning what I would like or dislike on a website, which led to key updates.

Rear view of a sleek black sports car with modern tail lights and dual exhaust pipes.

By drawing inspiration from established brands and constantly iterating on my designs, I was able to create a strong visual identity for Lux Car Co. and grow as a designer in the process.

Next steps include user testing and refining layouts, flows, and features based on feedback to ensure the experience meets real user needs.

← Previous

AfriCarib