A Scalable and User-Centric E-commerce Transformation
Project Focus
D2C + Ecommerce , Mobile 1st approach
VISITS PER DAY
ORDER PER DAY
REGIONS CODEBASE

WebReinvent delivered a standout e-commerce transformation for Toolstation, emphasizing scalability and usability across both professional and DIY user segments. The platform—positioned as D2C with a mobile-first mindset—now effortlessly handles an impressive 236,000 daily visits and 50,000 orders per day, across four localized regions (UK, NL, BE) from a single codebase, complete with dynamic translations and flawless UI/UX performance
Industry
Retail & E-commerce
Platform
Services
Ui & UX Strategy |
Visual design | Techstack |
Frontend and
Backend Development
Website/App
Link
Our approach to the Toolstation project was structured, collaborative, and transparent. We began with a discovery phase, where our team conducted in-depth research to understand Toolstation’s business goals, target audiences, and existing pain points. This laid the foundation for a clear Software Requirement Specification (SRS) document, ensuring alignment with stakeholders from the start.
Next, we moved into design and planning, building wireframes and a reusable atomic design system. This allowed us to maintain consistency, accelerate UI development, and ensure scalability across multiple regions. The UI/UX phase focused on crafting a visually striking, user-friendly interface with improved navigation and accessibility.
Once validated, our developers implemented the solution with a mobile-first, multi-region architecture capable of supporting large traffic volumes. We integrated continuous integration and delivery (CI/CD) pipelines, enabling rapid, reliable deployments.
To guarantee performance and stability, we executed automation testing alongside manual QA, ensuring every feature worked seamlessly across devices and markets. Finally, we delivered detailed documentation and training, empowering Toolstation’s internal team to manage and scale the platform confidently.
This end-to-end process ensured a robust, scalable, and customer-centric e-commerce solution.
01.
Discovery Phase
02.
SRS Documentation
03.
Atomic Design System
04.
Wireframes Creation
05.
Final Design Direction
06.
Development
07.
Automation Testing
08.
Documentation
Color is defined as the aspect of things that is caused by
differing qualities of light being reflected or emitted by them.
Name:
PrimaryRBG Hex:
#065CABCMYK:
100/70/0/0HSL:
209/93%/35%Name:
Primary YellowRBG Hex:
#FEE200CMYK:
0/8/100/0HSL:
53/100%/50%Name:
SecondaryRBG Hex:
#E52228CMYK:
5/100/100/0HSL:
358/79%/52%Name:
Secondary BlackRBG Hex:
#000000CMYK:
0/0/0/100HSL:
0/0%/0%Font Usage
Font Family : Gilroy
Weight
Black, Bold, semi Bold Medium, Regular, Thin
By combining clean sans-serif typography with generous line spacing, our UI/UX overhaul significantly enhances readability. The carefully selected typefaces reflect the brand's essence—modern, engaging, and user-centric—crafting a seamless and immersive digital experience.
Bigger Heading
Smaller Heading
Paragraph
Save your cost, save time,
and elevate the user UI experience.
Increase in conversions driven by a user-first design approach that made the experience more intuitive.

WebReinvent’s ability to deliver exceptional results under pressure is commendable. The elite, uber premium language that was incorporated into the design was an instant hit with our team, and perfectly encapsulates the luxury & sophistication we aim to portray. I look forward to seeing more of their innovative work in the future.
Stuart.Mcgrogan
Director of Tech at Toolstation
15+
YEARS OF EXPERIENCE
IN DIGITAL INDUSTRY
1M+
HOURS OF
QUALITY WORK
800+
SUCCESSFUL
PROEJCTS DELIVERED
99%
OF CUSTOMER COME
BACK TO US AGAIN