Product / E-commerce
MyWater — Smart Water Purification
Next.js product and commerce site for a smart water purification brand: subscription-based purifiers with app-connected filter health and service tracking.
- Next.js
- React.js
- JavaScript (ES6+)
- Node.js
- REST APIs
- SSR / SSG
- Cloudflare

- Client
- MyWater
- Duration
- May 2022 — Oct 2022
- Category
- Product / E-commerce
MyWater turns tap water into purified mineral water through an eight-stage system sold on a subscription rather than as a one-off appliance — filters, servicing and maintenance are included, which changes the site's job from "sell a product" to "sell an ongoing relationship".
The site is a Next.js application behind Cloudflare, covering distinct product lines for homes, SMEs, offices, large corporates and restaurants, alongside glass bottles and custom RO plants. Each segment needs its own framing and its own quote path, so the same catalogue is presented several different ways depending on who is reading.
The connected-device angle runs through the content too: the companion app reports real-time filter health, service history, billing, water quality scans and consumption, so the marketing site has to explain a piece of hardware, a subscription and a software product at once.
Key features
Segment-specific product journeys for home, SME, office, corporate and restaurant
Subscription positioning with quote-request and free water survey capture
Product range pages for Terra, Neo and limited-edition units
Eight-stage purification explainer and connected-app feature content
Embedded product video content and imagery-heavy layouts
Server-rendered Next.js pages behind Cloudflare for speed and SEO
Videos
My role
Frontend developer on the Next.js site.
- Built the segment-specific product and landing pages in Next.js
- Implemented lead capture — quote requests and free water survey forms
- Built the product catalogue, comparison and specification layouts
- Handled rendering strategy, image optimisation and page performance
Challenges & solutions
Five audiences, one catalogue. A restaurant and a household buy the same hardware for entirely different reasons. Segment landing pages share components but lead with different framing, so neither audience has to read past content meant for the other.
Lead capture without wrecking the page. The business runs on survey bookings, so the capture form is prominent — but tuned so it converts without making the first visit feel like a wall.
Related projects
E-commerce / GroceryMyCart.pk — Online Grocery Store
Magento grocery storefront for Karachi: seven top-level departments, daily-deal merchandising and same-city delivery with market-rate pricing at fulfilment.
- Magento
- PHP
- MySQL
- jQuery
- +3
Telecom / CorporateOptix Pakistan — ISP Website & Signup
WordPress site for a Pakistani ISP: broadband, TV and phone packages with area-coverage checking and online signup for a triple-play product line.
- WordPress
- PHP
- Custom WP Theme
- Slider Revolution
- +4