DEOPR Training Academy: before & after
A redesign keeps what already works, like the programmes, the accreditation details and the facts, and rebuilds the layout, typography and mobile experience around them. Drag the handle to compare the old and new pages.
- Client
- DEOPR Training Academy
- Live site
- deoprtraining.co.za
- Pages shown
- Home, Courses, Accreditation, About, Contact, Sign in, Mobile
Homepage hero
A bolder two-tone headline, a larger photo with an inset detail shot, and a gold call-to-action that stands out on the dark background.
Courses
The course catalogue gets a clear heading, search and category filter, and consistent course cards with duration and price at a glance.
Accreditation
Qualification tables, accreditation numbers and validity dates are laid out in clean cards, with the accreditation letter one click away.
About
The background story and board of directors are separated into easy-to-scan cards under a clear page header.
Contact
The enquiry form now sits beside a “Prefer to talk?” card with call, WhatsApp and email options.
Facilitator & student sign-in
A single focused sign-in card on the dark brand background, with clear fields and one primary button.
The whole homepage
Hover a screen to scroll through the full page. The structure is the same; spacing, type, colour and section rhythm are rebuilt.
On a phone
A single-column layout with larger text, full-width buttons and cards that stack cleanly. Hover (or tap) a phone to scroll.
How we handle a redesign
- 1
Review what exists
We go through your current site page by page: what it says, what works, and what gets in visitors' way.
- 2
Keep what's working
Your content, facts and accreditation details stay accurate. We change how they're presented, not what they say.
- 3
Rebuild the design
New layout, typography, colour and spacing, designed to look good on a phone first and scale up to desktop.
- 4
Review and launch
You see the result and approve it before it goes live. A written scope and quote come before any work begins.