I joined the project as UI Designer and Elementor Developer, working alongside a colleague who handled the more technical WordPress side.
Because the UI had not been designed in Figma beforehand, I developed the visual direction and built the pages at the same time directly in Elementor Pro. This Elementor UI Design approach meant translating layout, spacing, colour, typography, and component decisions straight into a working front-end while refining them along the way.
The focus of this Elementor UI Design work was on creating a cleaner, more modern interface that felt consistent across templates and presented product information in a clear, scannable way.
Role: UI Design & Elementor Dev
Team: Tiva Digital
Remote
Duration: Feb 2025 · 1 mo
Complete visual redesign with a more modern and minimal approach
New colour and typography system (green as the accent colour)
Clearer layout and improved consistency across the site
Building and refining the pages in Elementor Pro
Redesigning the single product page with better-organised content and a dedicated section for extended descriptions alongside product images
Creating a flexible structure that can easily adapt to future changes
These three pages received the most detailed styling and layout work in Elementor Pro.
The homepage was built with a clear hero section that places the Google rating up front, followed by cleanly structured product category blocks.
On the contact page, the quote form, showroom hours, and map were arranged side-by-side in a balanced layout so no element feels secondary.
The overall styling focused on consistency, clear visual hierarchy, and a clean structure that works well across different screen sizes.
The product page was redesigned with a more modern and balanced structure.
Full technical specifications are organised in a clear, collapsible format so the page never feels like a dense datasheet.
A clean white background lets the predominantly warm brown flooring photos stand out. Titles and body text use black and dark grey for strong hierarchy.
The accent green is used selectively on key buttons, while the overall palette stays in harmony with the site’s brown logo — resulting in a balanced and professional page.
The UI for the hybrid landing page was built around a modern layout that combines strong product imagery with a clean structure.
It follows the same white-background system used across the site, but with a higher density of photography.
Green and brown accent elements — used on buttons and selected interface objects — are distributed evenly throughout the page.
This balanced use of colour, paired with the imagery, creates a modern design that remains visually engaging from top to bottom.
If you’d like to discuss a similar project, you can contact me here.Note: This project has been delivered to the client. The designs shown in the images and videos represent the version I designed and delivered. The live version may have been updated or modified after handover.
View more of my work on the Portfolio page