01 / 06
77 products, found in seconds.
Nine categories with counts, live search across every product and an empty state that suggests what to try next. Each card shows the product photo, category and whether a catalogue is available.
Case study · Industrial supply
One engineering group, one clear front door.
We rebuilt Empower Group's website with 104 pages, a real quote journey and a design that puts products first.
- Client
- Empower Group, Abu Dhabi
- Sector
- Oil and gas, industrial supply and services
- Services
- Strategy, UX, visual design, build, content migration
- Year
- 2026
- 104pages, every one at the same address as before
- 77product pages built from one adaptive template
- 9catalogue categories with filters and live search
- 3steps from a quote list to a sent request
Seven companies, one group, and a website that didn't show it.
Empower started in Abu Dhabi in 2010 as an ISO 9001 certified onshore and offshore oilfield engineering supply and services company. It has grown into a group of seven companies: commercial agency, corporate services, branding, procurement and export from the United States, education, steel fabrication and digital signage.
Its buyers are procurement teams at energy companies, municipalities and contractors. They need to find the right product, check it fits and send a request for quotation fast. The old website made each of those steps harder than it should have been.
A buyer should find the right product and send a quote request in a few minutes, from any device.
- 01
Pages that broke
Every page returned a server error and some sections never loaded, so visitors saw half a site.
- 02
One page copied 70 times
Most product pages reused the battery page's text, so buyers couldn't tell products apart.
- 03
No way to buy
A generic contact form was the only route to a quote, with no product, quantity or specs.
- 04
Clutter and test pages
Placeholder pages, demo content and unwanted links sat next to real products.
- 05
A group nobody could see
Seven companies, with little sense of how they fit together or which one to call.
Before and after.
Drag the slider to compare the old home page with the new one.
The old home page as it appeared before the rebuild.
How we worked.
We kept everything that was real, cut everything that wasn't, and designed every page around one action: send a request for quotation.
- 01
Audit every page
We listed every page and product on the old site, kept all the real content and set aside test pages, demos and duplicated copy.
Every real page kept - 02
Shape the brand system
Empower red for actions, charcoal for text, Poppins for everything, duotone icons and mostly light, open pages.
One red, one font - 03
Design the buying journey
A quote list with quantity bands and per-item specs, sent in three steps, with every product page one click from a request.
3-step RFQ - 04
Rebuild all pages
One adaptive product template that shows only the sections each product has, with its own photos, drawings and catalogues.
104 pages, same addresses - 05
Test and hand over
Every link, image and anchor checked, every page type tested on phones, plus a launch checklist for the team.
Every link checked
Brand and design
Empower red, used with purpose.
Empower's logo is bold red and charcoal, and the brand line is simple: innovating the UAE's growth and guiding businesses to success. The new design keeps that confidence and adds calm: light pages, generous space and red only where it matters.
Red means act
The brand red marks the next step, like Request a quote or Add to quote list, so buyers always know where to go.
Light and open
White and soft-tinted backgrounds let product photos and specs breathe, a change from the old heavy colour overlays.
Products first
Real product photos on tinted tiles, drawings and spec tables come before any marketing copy.
Motion that guides
Counters, a live order tracker and a smooth scroll show how Empower works, and all of it switches off for reduced motion.
Brand colours
- Empower red
#EF4023Brand, highlights - Action red
#D6361BButtons - Text red
#CC3317Small red text - Charcoal
#343434Headings, text - White
#FFFFFFPage background
Type
- Poppins SemiBoldHeadings
- Poppins RegularReading text and labels
- 2,500+ RFQsFigures and counters
What we built.
02 / 06
One template that fits every product.
A gallery, key features, specifications, drawings, brands and downloadable catalogues, shown only when the product has them. Every page has its own photos, and a request for quotation is one click away.
03 / 06
A request for quotation in three steps.
Buyers add products to a quote list, choose a quantity band from 1-100 to above 1,000, add specs, then send it with their details. Removing an item can be undone, and the list is remembered on the device.
04 / 06
Steel work, configured before the first call.
Pick the item, material, timeline and size for gates, railings and balconies, and see a live summary that goes straight into a quote request for Empower Steel.
05 / 06
Four offices, four local times.
An office switcher for Abu Dhabi, Dubai, the USA and China shows each address and the local time, next to a request form with delivery city and timing.
06 / 06
Every open role, easy to filter.
Filter roles by team, search by title and apply in a short dialog, without leaving the page.
What changed.
Every page works
All 104 pages load in full, at the same addresses, so old links and search results still land in the right place.
A real buying journey
Buyers go from product to a sent quote request in three steps instead of a blank contact form.
Products you can tell apart
Duplicated text is gone. Each product has its own copy, photos, specs and catalogue.
A cleaner, safer site
Test pages, demo content and unwanted links are gone, and search engines get clear structured data.