Clean Technical Foundation
Technical fixes were applied first so every design improvement loaded instantly, with nothing to slow it back down.
Case Study
From an F to an A in Under a Week
Mate Vitality had strong products and a clear brand, but a slow, cluttered website was losing customers before they ever saw one. HK Tech Hub fixed the technical foundation and rebuilt the design around it, in parallel.
What We Fixed
Full Technical Speed Audit
Every issue dragging the site down was logged and prioritized, from render-blocking scripts to poor caching.
Image Optimization
Product and banner images compressed and lazy-loaded, cutting file sizes with zero visible quality loss.
Code & Resource Cleanup
Unused CSS and JS removed, scripts deferred, and load order restructured to render visible content first.
Full Homepage Redesign
A clean structure that communicates the brand instantly and puts 5,000+ reviews front and center.
Overview
A Brand Held Back by Its Own Website
Mate Vitality sells organic yerba mate tea built around one promise: natural energy without the crash. The products and identity were strong, but the website undercut both. GTmetrix rated the site an F, with a 14% performance score and an 8.2-second load time, long enough for most visitors to leave before seeing a single product.
The design was working against the brand too. Product features, reviews, and the brand story were all present but poorly organized, and the homepage did not reflect the quality Mate Vitality's customers expected. HK Tech Hub ran two tracks in parallel: fix the technical foundation, then rebuild the design on top of it, all delivered in under a week.
F→A
GTmetrix Grade
14%→85%
Performance Score
8.2s→1.3s
Page Load Time (LCP)
1.2s→0ms
Total Blocking Time
The Challenge
The Challenges We Solved
Failing Performance Score
An F-rated site with a 14% performance score meant most visitors left before the main content even loaded.
An Unstable, Shifting Layout
A 1.2-second blocking time and visible layout shift made every visit feel unreliable, even after the page loaded.
A Design Not Reflecting the Brand
Cluttered, generic layouts buried the product features and reviews that should have been building trust immediately.
Before & After
The GTmetrix Breakdown
Every core metric moved in the right direction, and none of it came at the cost of the redesign.
Before — Old Website
GTmetrix GradeF
Performance Score14%
Structure Score90%
LCP (Load Time)8.2s
Total Blocking Time1.2s
CLS (Layout Shift)0.54
After — HK Tech Hub Redesign
GTmetrix GradeA
Performance Score85%
Structure Score97%
LCP (Load Time)1.3s
Total Blocking Time0ms
CLS (Layout Shift)0.2
Our Approach
How We Rebuilt It
Two tracks ran in parallel: fix the technical foundation first, then rebuild the design on top of it.
0101 - Audit
Full Technical Speed Audit
Every issue dragging load times down was identified and logged, from unoptimized images to inefficient loading order.
0202 - Images
Image Optimization
Product and banner images were compressed and converted, with lazy loading added so images load only when needed.
0303 - Cleanup
Code & Resource Cleanup
Unused CSS and JavaScript were removed and non-critical scripts deferred, bringing blocking time from 1.2s to 0ms.
0404 - Homepage
Full Homepage Redesign
A clean structure was built with a clear hero message, logically organized products, and the review count given real prominence.
0505 - About Page
About Page Redesign
A wall of text became a structured brand story, with core values pulled out visually inside a clean accordion layout.
0606 - Conversion
UX & Conversion Improvements
Product cards, the review section, and the newsletter block were redesigned, and a WhatsApp button added for quick contact.
The Strategy
Why It Worked
Speed and design are not separate problems, they feed into each other. Fixing both at the same time is what made this work.
Brand-First Design
Every visual decision reflected what Mate Vitality actually stands for: natural, premium, and trustworthy.
Conversion-Focused Layout
Reviews, product features, and CTAs were placed exactly where visitors actually look and act.
Delivered in Under a Week
The full redesign and speed overhaul were completed in 4 to 6 days, without cutting a single corner.