Case Study
PlushPalz
Industry: Retail, Collectibles & Toys | Type: Product Catalog and WhatsApp Commerce Platform
Volmier implemented a custom product catalog with conversational commerce ordering, featuring interactive image magnifier overlays, discount coupon code managers, privacy-first custom analytics, and Nginx/PM2 deployment configurations.
Project Facts
| Project Type | Product Catalog with Conversational Commerce Ordering |
| Industry | Retail, Collectibles, and Toys |
| Volmier Role | Full-Stack Design and Deployment (React frontend client, custom routing context, Node/Express APIs, Mongoose/MongoDB data models, Nginx/Docker setup) |
| Frontend Stack | React v18.3.1, TypeScript, Vite, Tailwind CSS, custom hash state routing, Framer Motion, GSAP, Lenis smooth scroll |
| Backend Stack | Node.js, Express v4.19.2, jsonwebtoken, bcryptjs, multer, sharp, rate-limit |
| Database | MongoDB (Mongoose v8.3.1) |
| Authentication | JWT token-based access control (12-hour session expiry), bcryptjs credentials hashing (12 salt rounds) |
| Infrastructure | ubuntu/Debian VPS, Nginx reverse proxy, PM2 daemon processes, Docker & Docker Compose setup |
Project Overview
Plush.Palz is an online store and product catalog showcase designed specifically for premium imported and thrifted character plush toys. It is structured as an interactive digital catalog that displays product details, manages discount coupon codes, tracks visitor analytics, and redirects users to a direct messaging line on WhatsApp to complete their purchases.
Instead of using automated transactional checkouts on-site, the platform connects users directly to the store owners via WhatsApp. The frontend SPA is built using React, TypeScript, and Vite, while the API is powered by Express and Mongoose schemas connected to MongoDB.
Project Purpose
For boutique imported and thrifted character retailers, conventional e-commerce checkout flows can introduce friction and lower conversion rates. In addition, catalog managers need tools to dynamically refresh featured listings, modify discount codes, update hero graphics, and review visitor metrics without code changes.
To support these goals, Volmier built a conversational commerce funnel that allows customers to select plushies, apply dynamic discounts, and complete sales offline, while providing the owner with an administration panel.
What Volmier Implemented
Thematic Product Catalog
Created catalog layouts using custom Tailwind variables and peeking mascot illustrations. Integrated Framer Motion and GSAP scroll indicators to display six thematic categories (Pokémon, Sanrio, Anime, Cute Animals, Trending, New Arrivals) dynamically.
Interactive Magnifier & History Tools
Built coordinate-based hover lenses that zoom in on plushie fabric details. Created related product carousels and tracked browsing histories in `localStorage` under `plush-recent` keys.
WhatsApp Commerce Funnel
Programmed a checkout redirect that compiles the item name, promotional price, and applied coupon code, dynamically formatting a WhatsApp redirect link (`wa.me`) to complete the purchase.
Express API & Admin CMS
Implemented routes to handle products CRUD, dynamic section image asset overrides, and discount code parameters. Secured admin dashboards with JWT PIN/password logins and rate limiters.
Key Features
WhatsApp Ordering Redirection
Direct checkout links compile product pricing and validated coupons into a WhatsApp messaging API redirect.
Hover Image Magnifier
A coordinate-tracking hover lens built to zoom in on fabric details and stitching without reloading files.
Dynamic Coupon System
Validates percentage/flat discount codes, checking expiration dates, status, and minimum purchase limits.
Recently Viewed Carousel
Uses browser local storage to save visited product lists and render recently viewed carousels.
Privacy-First Analytics
Tracks page views and clicks by hashing visitor IP addresses with SHA-256 before database insertion.
Image WebP Optimization
Backend Sharp middleware adjusts orientation, resizes dimensions, and compresses uploads to WebP (0.82 quality).
Technical Implementation
The frontend React client handles routing client-side based on hash state tracking. Smooth scrolling integrations use Lenis, GSAP, and Framer Motion loops.
The Express backend API stores data in MongoDB using Mongoose schemas for products, coupons, floating layout cards, counters, and analytics records.
Administrative routes require JWT token authorizations with a 12-hour session duration, while login endpoints are secured using hashed PIN/password checks via bcryptjs.
The platform includes rate-limiting rules (`express-rate-limit`) to prevent brute-force attacks on login routes, image uploads, and analytics endpoints.
Verified Project Outcomes
Volmier built and deployed a conversational commerce e-commerce system featuring:
- An optimized image processing pipeline converting uploads to WebP formats automatically.
- Hashed privacy-first visitor metrics logs to track customer interest levels.
- Dynamic coupon validation routes and customizable landing page slots.
- A complete Docker multi-container environment configured for PM2 VPS hosting.
No verified business/performance metrics found.
Live Project
Frequently Asked Questions
What did Volmier develop for PlushPalz?
Volmier developed the entire full-stack application, including a React SPA frontend with custom hash routing, GSAP/Framer Motion animations, an Express.js backend REST API, Mongoose schemas for MongoDB, an admin dashboard for catalog updates, and custom privacy-first analytics.
How does the WhatsApp commerce order flow work?
Instead of an on-site checkout form, the product detail page compiles details of the selected item, original price, and applied coupon code. It formats a pre-filled WhatsApp message dynamically and redirects the user to the store’s number via the WhatsApp Web/App API.
Does the application support credit/debit card processing?
No, direct credit/debit card processing and automated online payment gateways are not verified in the codebase. All transactions and offline payments (such as manual UPI or card details) are coordinated directly between the customer and store owner over WhatsApp.
Have a similar software project in mind?
Talk to Volmier about your e-commerce catalog or custom platform needs. We design and build products that focus on smooth UX and practical technical foundations.