Al Ain Class Motors: Car Dealership Website Design for a Supercar Showroom (Proposal)
Car dealership website design proposed to a supercar showroom: search by marque, a car page that sells with photographs, and a comparison table.
The project at a glance
Al Ain Class Motors is a showroom for exotic and luxury cars in Al Ain, in the United Arab Emirates, open since 1995 according to its own story. Kenania proposed a new website for it: a dark, photography-led car dealership website design in Adobe XD, with a home page, a car page and a comparison tool. The client did not go ahead with this design; we show it as it was proposed.
In collaboration with
Table of Contents
A home page that opens like a showroom
Most car websites borrow the layout of classified ads, with grids of small photos and long specification lists. For a showroom that sells hypercars we went the other way. The home page opens on a full-screen photograph of a red supercar with its doors raised and the line «Crafted for the Discerning Driver». Above it runs an eight-item navigation (home, inventory, brands, shop, news, sell your car, about and contact) with the logo and «Since 1995» in the centre. Backgrounds are black, type is white, and a single red is kept for actions, which leaves the colour to the cars.
Have a project like this in mind? Message Kenania directly on WhatsApp.
Chat on WhatsAppSearch by marque
Buyers at this level usually start from a brand, so the search block under the hero shows the marques as logos: Rolls-Royce, Maybach, Porsche, Maserati, Brabus, Lamborghini, Ferrari and Aston Martin, with a tick box for classics. Below the logos runs a row of filters for mileage, year, price, specifications and drive type. A live result count sits in red next to the search button, so visitors see how many cars match before they press it.
New arrivals follow as a carousel of studio photographs. Every car stands in the same white corner with the showroom logo on a dark disc behind it, and each card carries a heart to save the car and an icon to add it to the comparison. Below the carousel, a short story of the showroom sits beside a photograph of its building.
Five quick links and the offers grid
The main routes sit in one row of five tiles: available cars, sold cars, compare cars, explore shop and sell my car. Sold cars are there on purpose, because in this market a record of past sales is proof of reach. The offers section below lists marques down the left (all, Ferrari, Lamborghini, Mercedes-Benz, Pagani, Porsche and Rolls-Royce) beside a scrolling grid of cars on the right, each marked New where it applies.
A car page built like a brochure
The car page puts the full name of the car at the top, edition included, then a large image slider with a strip of thumbnails and, beside it, a featured video in portrait format. Tabs below switch between technical details, description and video. The technical block shows model year, mileage, colours and specifications as short labelled pairs that a buyer can read at a glance. An image gallery with large and small tiles follows, then similar cars and the newsletter. In a car dealership website design at this price level the photographs do most of the selling, and the page gives them most of its space.
Comparing cars side by side
Buyers of performance cars compare numbers, so the car dealership website design includes a comparison page. It lines up several cars in columns with a photo of each, then rows for brand, year, mileage, drive type, doors, engine, transmission, power, torque, acceleration, top speed and price, and highlights the best value in each row in green.
Each column has a small cross to remove its car, and where the showroom prefers not to publish a price the cell reads «Ask for price». An empty column invites the visitor to add another car, and a bar at the bottom of the site keeps the selected cars until the visitor opens the comparison.
Scope of the proposal
- Car dealership website design in Adobe XD: home page, car page and comparison
- Hero with full-screen photography and an eight-item navigation
- Search by marque with filters and a live result count
- New arrivals, offers by marque, sold cars and quick links
- Car page with image slider, featured video, specifications and gallery
- Side-by-side comparison with the best values highlighted
- News with filters, newsletter and featured reels
- Proposed with BIGBANG IT Solutions; not taken forward by the client
Related projects and services
- Website and app development: from the design to a live site
- Uno Travel booking website: a full-service travel agency site
- UI/UX design and digital products: research, flows and interfaces
Planning a website for a showroom or a rental fleet? Send a short brief and we will reply with a page plan.
What the car dealership website design had to do
A dealership website has to show the stock well enough that people want to visit, help a serious buyer find one specific car quickly, and turn that interest into a call or a visit. For a showroom of exotic cars the first job weighs most. Buyers already know the models. What they want to see is this car, in this colour, with this mileage, photographed properly.
So this car dealership website design spends its space on photography and keeps the interface quiet. Black backgrounds make the paint stand out, type is white, rules are thin, and the one red is kept for actions such as Search, View All Cars and Subscribe.
One car card for the whole site
Stock in a showroom like this turns over all the time, so the design is built from a few repeatable parts: a car card with a photo, a name, a save heart and a compare icon, then a filter row, a brand list and a result count. The card is the most reused part of the car dealership website design. New arrivals, offers, similar cars and sold cars all use it, so a car added to the inventory appears in every list it belongs to, and visitors never have to learn a second card layout.
A visitor’s path from photo to viewing
Picture a visitor who arrives from a link on social media. They see the red car with its doors raised, scroll to the search, tap the Ferrari logo, set the year and price and read the result count before pressing Search. On a car page they watch the video, browse the gallery and check the mileage, then add the car and two others to the comparison. The table shows that one accelerates faster and another has more torque. They go back to the car they prefer and call the showroom to book a viewing. Every step before that call has its own screen in this car dealership website design.
Sold cars as proof
Listing sold cars can look odd in a car dealership website design, since the site exists to sell. In the luxury market it tells a buyer that the showroom has found and delivered cars at this level before. Sold cars therefore get their own tile among the five quick links and use the same card as the stock, so they read as a record of sales.
Questions about cost, timing or the next step? Ask Kenania on WhatsApp.
Chat on WhatsAppNews, reels and the newsletter
People who buy exotic cars follow them through video, social media and events as much as through search, so the car dealership website design brings those channels onto the home page: the latest news, a row of vertical reels from the showroom floor and a newsletter, which give visitors a reason to come back between visits.
News cards share one layout: a photograph, a type badge (grey for blogs, red for events), a title in capitals and two lines of introduction. Filters for all, blogs, events and car news sit above the cards, and a View All button sits below them. The newsletter is a dark panel with a marque logo, a car with its doors open and one line of copy asking visitors to subscribe so they do not miss a promotion.
«Since 1995» and other facts on the page
When one car can cost more than a house, small facts in a car dealership website design do much of the reassuring. «Since 1995» sits under the logo. The showroom’s story is told next to a photograph of its real building. The result count appears before the search runs. Each car is named in full with its edition, so a limited car carries «1 of 149» in its title.
One photography style for the stock
The pages only work if the photographs match, so the car dealership website design assumes one style of stock photography: each car in a studio with soft light, a grey floor and a wall carrying the showroom logo, shot from roughly the same angle. That consistency makes the grids and carousels look like one collection, and a newly added car fits in from the day it goes online. A showroom running a site like this needs a short photography guide covering angles, background and light, so the site keeps its standard after handover.
What a development team would need
Had this car dealership website design gone ahead, development would have meant connecting the car card to the inventory data, the search filters to its fields, the result count to a live query, and the comparison table to each car’s specifications. Because the design repeats a few parts, the mapping is short: one card, one car page template and one comparison template.
From desktop artboards to a phone
The artboards of this car dealership website design are drawn at desktop width, while many visitors to car websites arrive on a phone, often from a social media link. Built for mobile, the marque logos would become a strip that scrolls sideways and the filters would collect in one panel. The comparison table would scroll horizontally with its row labels fixed, and the call button would stay visible at the bottom of the car page.
Questions about car dealership website design
Was this website built?
No. It is a proposal Kenania prepared for Al Ain Class Motors; the client did not go ahead with it. We publish it as it was presented.
What makes a dealership website for luxury cars different?
Buyers usually know the model already and want to see this particular car, so the photographs carry the sale. They also tend to search by marque and compare performance figures, which is why this design leads with large images, brand logos in the search and a comparison table.
Can visitors compare cars?
Yes. Cars can be added from any card, kept in a bar at the bottom of the site and compared in a table with the best value in each row highlighted.
Which pages were designed?
The home page, a car page with gallery and video, and the comparison page with its pop-up.
Do you design websites for car dealers and rental companies?
Yes, in Arabic and English, with inventory search, car pages, comparison and booking or enquiry forms.
Ready to start? Send Kenania a photo, a plan or a short brief on WhatsApp.
Chat on WhatsApp
