Case study 02Concept redesign2026

Demo-Tech Ltd.

Demo-Tech is a Toronto-area demolition and concrete cutting company. Its photography was strong and its website was hiding it. I rebuilt the site around the one thing a contractor needs to do: ask for a quote.

Industry
Demolition and concrete cutting, GTA
My role
Design, build, privacy and accessibility pages
Scope
15 pages
Built with
Plain HTML, CSS and JavaScript
Status
Concept, not a live client site
demotechltd.ca (live site)Before

01

The problem

What a visitor sees on the old homepage, from screenshots on desktop and phone.

  1. The logo is larger than the message.A very large logo sits on top of the photograph, over the people the photograph is about.
  2. No clear first action.There is no phone number or quote button on the first screen, on desktop or on a phone.
  3. The menu splits around the logo.Navigation is divided into two groups on either side of the logo, which makes the page harder to scan.
  4. The first screen does not say who it is for.It names the services, but not who the company works for or what to do next.

02

The strategy

  1. Speak to the buyerThe headline and supporting text address general contractors, developers and site managers directly, in plain language.
  2. One action, repeatedGet a free quote and the phone number appear in the header and on the first screen, and again at the end of every page.
  3. Let the photography workA dark overlay keeps type readable while the work stays visible. High-vis lime is used only for action and emphasis.
  4. Respect the visitorNo cookies, no trackers and nothing loaded from other companies. A privacy policy and an accessibility statement are included.

03

The transformation

Same logo, same photographs, same page addresses. A different first impression.

HomepageDrag to compare
demotechltd.ca (live site)Before

Homepage on a phone

Homepage on a phone, before
Before
Homepage on a phone, after
After

04

The details

ON SCHEDULE.

Interior and structural demolition, concrete cutting, GPR scanning and coring.

Type
Barlow Condensed 700, uppercase
Barlow

Barlow Condensed has the weight of a site sign without looking like one. The regular Barlow family handles longer text.

  • Near black#0D0F10
  • Warm off-white#F3F1EC
  • High-vis lime#D4F01C
  • Concrete grey#7C837A

Full-bleed photography with a restrained overlay, a strict left edge for text, and large tap targets for the quote and phone buttons.

A service page for every service

A service page for every service

Each service has its own page and address, with the same quote prompt, so every page can be a landing page.

A gallery that loads quickly

A gallery that loads quickly

Photos are enhanced and delivered as AVIF with JPEG fallback at several sizes, so the gallery stays light.

On a phone
A compact header, a full-width quote button and the key facts stacked in two columns.

05

The result

This is a concept, so there is no live traffic to report. These are facts about the build.

15pages, including privacy and accessibility
0cookies set
0requests to other companies

What I would measure after launch

  • More quote requests from phones
  • More calls from the header number
  • Fewer visitors leaving before the first scroll

Independent concept. It is not affiliated with, endorsed by or commissioned by Demo-Tech Ltd. Names, logos and photographs belong to their owners and are shown only to illustrate the redesign.