Redefining Industrial Design: A UI/UX Case Study for Amppere Cables

Industrial websites often fall into the trap of being “functional but forgettable.” For my latest project, I took on the challenge of redesigning the digital presence for Amppere Cables, a brand built on quality and reliability. My goal was simple: transform a technical product showcase into an immersive, user-centric journey.

1. The Hero Section: First Impressions Matter

The original site felt static. I wanted the user to feel the scale of the brand the moment they landed on the page.

• Full-Screen Immersive Carousel: I implemented a high-impact, full-screen carousel that showcases different specialised wires. It’s not just an image; it’s a visual explanation of purpose.
• Data at a Glance: I integrated “Key Numbers” (30+ Years of Experience, 100+ Clients) directly into the hero section to establish immediate trust and brand authority.
• Frictionless Navigation: Social media icons were moved to the top navigation bar, ensuring that “easy access” isn’t just a buzzword, but a functional reality.

2. The Product Experience: Clarity Through Animation

Cable catalogues can be overwhelming. I redesigned the product page to prioritise clarity and flow.

• Categorisation: I separated product categories into distinct, clean segments.
• Visual Engagement: By using subtle, appealing animations, I turned a standard product list into an interactive experience. Users can now access detailed specifications without losing their place in the catalogue.

3. Building a Community: The Social Hub

A brand today isn’t just about what they sell; it’s about their digital presence.

• Social Feed Integration: I added a dedicated section on the homepage where users can explore the brand’s Instagram, Facebook, and LinkedIn updates.
• Direct Connection: This feature bridges the gap between a corporate manufacturer and the end-user, allowing for real-time updates and direct community engagement.

4. The Creative Finish: A Footer That Stands Out

Even the footer deserves a design soul. Instead of the standard “wall of links,” I redesigned the footer with a unique, creative shape that ties the brand’s industrial aesthetic together. It’s a small detail that leaves a lasting impression of quality.

Reflection

This redesign wasn’t just about making things “look better.” It was about taking industrial products and giving them a premium, modern digital home. By focusing on immersive visuals and intuitive navigation, the Amppere Cables website now truly reflects the quality of the products they manufacture.

Tools Used

To bring the Amppere Cable redesign to life, I utilised Figma as my primary design engine. Leveraging Figma’s advanced prototyping features allowed me to test the flow of the product category animations and ensure the creative footer shape maintained its visual integrity across different screen sizes.

What do you think of this transformation? Let’s connect in the comments!