WEB DESIGN
CATEGORY :
DEVELOPMENT
CLIENT :
www.skippertm.com
START DATE :
07 April 2024
DESIGNER :
JUSTIN FRY
THE CHALLENGE
Complete Website Redesign for a Forward-Thinking Product Design Company
A product design company required a full website overhaul. Their existing site no longer reflected the innovation and technical excellence of their work, particularly in the health and safety sector. The brief was to deliver a modern, visually engaging website that communicated their forward-thinking ethos and cutting-edge product development, while ensuring clarity, accessibility, and a seamless user experience.
THE SOLUTION
A Modern, Responsive Website Aligned with Innovation and Usability
To meet the client’s brief, a custom website was designed with a clean, modern layout and intuitive navigation. The visual style reflected the company’s innovative approach, using bold typography, subtle animations, and a structured grid system to present technical information in an accessible way. The site was built using WordPress and Elementor, allowing for flexibility, easy updates, and responsive performance across all devices. Clear calls to action, optimised content structure, and enhanced visual hierarchy ensured the user journey aligned with both brand values and business goals.
Animated GIF showcasing the Skipper Q Post & Base — designed to highlight product features in a clear, attention-grabbing format for digital use.
METHOD
UX & UI Design with Figma
User experience (UX) and user interface (UI) design played a central role in shaping the structure and look of the website. Figma was used as the primary design tool to create interactive wireframes and high-fidelity prototypes, allowing for efficient collaboration and real-time feedback. The UX process focused on understanding user needs, streamlining navigation, and ensuring content was logically organised. On the UI side, attention was given to visual hierarchy, accessibility, and brand consistency — resulting in a clean, intuitive interface that guides users effortlessly through the site.
METHOD
UX & UI Design with Figma
User experience (UX) and user interface (UI) design played a central role in shaping the structure and look of the website. Figma was used as the primary design tool to create interactive wireframes and high-fidelity prototypes, allowing for efficient collaboration and real-time feedback. The UX process focused on understanding user needs, streamlining navigation, and ensuring content was logically organised. On the UI side, attention was given to visual hierarchy, accessibility, and brand consistency — resulting in a clean, intuitive interface that guides users effortlessly through the site.
This 3D model animation, created in KeyShot, was featured as the hero motion graphic on the homepage — adding visual impact and showcasing the product in a dynamic, engaging way.
METHOD
3D Visualisation with KeyShot
KeyShot was used to create high-quality, photorealistic renderings of the company’s products. This allowed for precise control over materials, lighting, and camera angles — ensuring each product was presented in the most visually effective way. By using existing 3D models, the software enabled the production of consistent, detailed imagery suitable for web, marketing, and print applications. KeyShot’s rendering capabilities also made it possible to showcase products in a variety of environments and lighting conditions without the need for costly physical setups.
CONNECT
Let’s Build Something That Works for Your Business
If you’re looking to create a new website or refresh an existing one, I’d be happy to discuss how good design and smart functionality can support your goals. Whether you have a clear brief or just the beginnings of an idea, feel free to get in touch to explore the possibilities.