Guanhua Group Website Build
Guanhua Group Website Build
Web Design · Framer Development
Web Design · Framer Development
I helped Guanhua Group establish their new digital presence by designing and developing their official website from the ground up.
From information architecture to visual identity and Framer implementation, I built a modular, scalable site that meets their B2B communication needs — with a focus on clarity, trustworthiness, and long-term maintainability.
I helped Guanhua Group establish their new digital presence by designing and developing their official website from the ground up.
From information architecture to visual identity and Framer implementation, I built a modular, scalable site that meets their B2B communication needs — with a focus on clarity, trustworthiness, and long-term maintainability.
I helped Guanhua Group establish their new digital presence by designing and developing their official website from the ground up.
From information architecture to visual identity and Framer implementation, I built a modular, scalable site that meets their B2B communication needs — with a focus on clarity, trustworthiness, and long-term maintainability.
Client
Guanhua Group
Services
Web Design
Framer Build
Industries
Manufacturing
Date
Mar–Apr 2025
Guanhua is a global manufacturer of stainless steel cookware. My challenge was to design a corporate site that communicates trust, material quality, and brand distinctiveness — all through a refined, international aesthetic.
To support overseas communication, I streamlined scattered content into modular, scroll-based layouts. Every section was designed to feel intentional, informative, and visually coherent — from brand history to ESG commitments.
Guanhua is a global manufacturer of stainless steel cookware. My challenge was to design a corporate site that communicates trust, material quality, and brand distinctiveness — all through a refined, international aesthetic.
To support overseas communication, I streamlined scattered content into modular, scroll-based layouts. Every section was designed to feel intentional, informative, and visually coherent — from brand history to ESG commitments.
Guanhua is a global manufacturer of stainless steel cookware. My challenge was to design a corporate site that communicates trust, material quality, and brand distinctiveness — all through a refined, international aesthetic.
To support overseas communication, I streamlined scattered content into modular, scroll-based layouts. Every section was designed to feel intentional, informative, and visually coherent — from brand history to ESG commitments.
Challenge
Challenge
From Isolated Pages
to Unified Journeys
From Isolated Pages
to Unified Journeys
The client provided a rigid page-by-page structure — every block of content opened into a new standalone page. This created a heavy, repetitive experience with no layout continuity or reading flow.
The client provided a rigid page-by-page structure — every block of content opened into a new standalone page. This created a heavy, repetitive experience with no layout continuity or reading flow.
Client Structure Input
Client Structure Input
Merged scattered content into
a structured, scrollable experience
Merged scattered content into
a structured, scrollable experience
I restructured the site into three scrollable core sections: About, Products, and Expertise — and introduced a new ESG section to reflect evolving content needs. By merging related content into seamless long-scroll layouts, I made the site lighter, faster, and easier to navigate.
I restructured the site into three scrollable core sections: About, Products, and Expertise — and introduced a new ESG section to reflect evolving content needs. By merging related content into seamless long-scroll layouts, I made the site lighter, faster, and easier to navigate.
Navi
Navi
Site Structure Overview (Low-Fi)
Site Structure Overview (Low-Fi)
The restructuring also allowed for more flexible layouts — using varied grid patterns and typographic contrasts to highlight different content types. We introduced a timeline under About, added an ESG section, and removed the redundant Business tab for a more focused narrative.
The restructuring also allowed for more flexible layouts — using varied grid patterns and typographic contrasts to highlight different content types. We introduced a timeline under About, added an ESG section, and removed the redundant Business tab for a more focused narrative.
DESIGN
DESIGN
Design System & Brand Aesthetic
Design System & Brand Aesthetic
Inspired by Guanhua’s stainless steel products, I developed a minimal yet expressive visual system. Monochromatic tones, tight layouts, and consistent card modules create a professional, industrial tone.
Inspired by Guanhua’s stainless steel products, I developed a minimal yet expressive visual system. Monochromatic tones, tight layouts, and consistent card modules create a professional, industrial tone.
Moodboard
Moodboard
Interaction
Interaction
Interaction as Storytelling
Interaction as Storytelling
The site’s interactive design transforms passive browsing into engaging storytelling. By combining purposeful scroll effects, custom horizontal timelines, animated data highlights, and responsive maps—all crafted natively in Framer.
The site’s interactive design transforms passive browsing into engaging storytelling. By combining purposeful scroll effects, custom horizontal timelines, animated data highlights, and responsive maps—all crafted natively in Framer.
A horizontal moment in a vertical journey
A horizontal moment in a vertical journey
A sideways scroll breaks the rhythm, letting users explore GuanHua’s history on their own terms.
A sideways scroll breaks the rhythm, letting users explore GuanHua’s history on their own terms.
Scroll to walk through production
Scroll to walk through production
Instead of fragmenting each manufacturing step, I merged them into a seamless vertical scroll. This creates a sense of continuity and immersion, helping users intuitively understand the logic of batch production.
Instead of fragmenting each manufacturing step, I merged them into a seamless vertical scroll. This creates a sense of continuity and immersion, helping users intuitively understand the logic of batch production.
Data doesn’t just appear — it arrives
Data doesn’t just appear — it arrives
Animated numbers turn progress into motion, making metrics more engaging.
Animated numbers turn progress into motion, making metrics more engaging.
Geography becomes narrative
Geography becomes narrative
Scrolling lights up countries on the map, visualising GuanHua’s global reach.
Scrolling lights up countries on the map, visualising GuanHua’s global reach.
RESULTS
RESULTS
Scalable, Client-Owned Delivery
Scalable, Client-Owned Delivery
The site now provides Guanhua with a scalable digital platform tailored to overseas communication.
The site now provides Guanhua with a scalable digital platform tailored to overseas communication.
To ensure optimal viewing across devices, the site was built with fully responsive layouts — maintaining visual clarity and brand consistency from desktop to mobile.
To ensure optimal viewing across devices, the site was built with fully responsive layouts — maintaining visual clarity and brand consistency from desktop to mobile.
Product CMS
Manage detailed product specs, categories, and SKUs with ease through a structured backend system.
Content CMS
Publish brand updates, blogs, and announcements effortlessly with a flexible content management interface.
Product CMS
Manage detailed product specs, categories, and SKUs with ease through a structured backend system.
Content CMS
Publish brand updates, blogs, and announcements effortlessly with a flexible content management interface.
Product CMS
Manage detailed product specs, categories, and SKUs with ease through a structured backend system.
Content CMS
Publish brand updates, blogs, and announcements effortlessly with a flexible content management interface.
Product CMS
Manage detailed product specs, categories, and SKUs with ease through a structured backend system.
Content CMS
Publish brand updates, blogs, and announcements effortlessly with a flexible content management interface.