Yellow Metric - Arranjos e Transformações
Clothing alterations and dry-cleaning company website with 12 stores across Portugal and Spain. Features complete multilingual system (PT/EN/ES/FR), animated statistics counters showcasing 8+ million alterations, interactive service pages, and comprehensive store locator with embedded Google Maps for each location.
Built with React 19, TypeScript, and Tailwind CSS 4 featuring React Router DOM 7 navigation, React Hook Form with Yup validation, Intersection Observer API scroll-triggered counters, custom CSS keyframe animations, and Strict mode with custom i18n hooks.
Overview
Industry
Retail & Consumer Services (Clothing Alterations & Dry Cleaning)
Scope
Complete website design and development featuring multilingual content management, interactive service showcases, store locator with Google Maps integration, contact form with validation, and responsive design optimized for all devices
Timeline
3-4 weeks from initial setup to completion
Challenge
Yellow Metric, a leading Portuguese clothing alterations and dry-cleaning service with 12 stores across Portugal and Spain, needed a modern digital presence to match their premium brand positioning. Their existing website lacked multilingual support despite serving markets in Portugal, Spain, and international tourists, and failed to showcase their impressive operational scale (8+ million alterations, 331K+ laundry services, 138K+ satisfied clients). The company needed a solution that would work seamlessly across all devices, load quickly, and provide an intuitive way for customers to find their nearest location and understand their comprehensive service offerings.
Solution
We built a fully custom React-based website with TypeScript for type safety and maintainability, implementing a comprehensive internationalization system supporting four languages (Portuguese, English, Spanish, French). The site features scroll-triggered animated counters using the Intersection Observer API to showcase their impressive statistics, creating visual engagement without sacrificing performance. For the store locator, we implemented an interactive Google Maps integration with 12 location cards, each with embedded maps, phone numbers, and operating hours. The entire design follows a mobile-first approach with Tailwind CSS 4, ensuring fast load times and perfect rendering across all devices. Form validation was implemented using React Hook Form and Yup schema validation, providing users with real-time feedback and preventing submission errors.
Key Features
Results
Tech Stack
Ready to Start Your Project?
Let's discuss how we can create a stunning website tailored to your business needs.