Create a full-stack-ready React Native (or Flutter/Next.js) mobile-first web application called "QuickCraft". The app combines the ultra-fast delivery model of Blinkit with a highly customized marketplace for intricate Aari (Maggam) embroidery work.
Please include the following screens and functionalities with a clean, modern, and luxury-meets-convenience UI (deep maroons/golds for the artisan section, clean greens/whites for the grocery section).
### 1. Dual-Purpose Homepage
- Top Banner: Toggle between "Instant Delivery (10 Mins)" and "Custom Aari Studio".
- Instant Delivery Section: Categories for Grocery, General Store, and Toys with a standard grid layout, "Add to Cart" buttons, and a persistent floating cart.
- Custom Aari Studio Section: High-quality visual cards showcasing traditional embroidery categories (Blouses, Lehengas, Kurtis, Patches).
### 2. The Interactive Aari Customization Screen
When a user clicks on an Aari work category, open a multi-step customization wizard:
- Step 1: Material & Color. Visual swatches for fabric type (Raw Silk, Georgette, Velvet) and a color picker.
- Step 2: Design Selection. A grid of embroidery templates (Heavy Bridal, Minimalistic, Floral, Geometric) AND a drag-and-drop file uploader for custom reference images.
- Step 3: Work Intensity Scale. A slider to select work density (Light, Medium, Heavy Zardosi) that dynamically updates an estimated price formula.
- Step 4: Sizing & Fitting. Two options: "Fill Measurement Form" (Bust, Waist, Sleeves fields) or a button for "Schedule Pickup for Fitting Garment".
### 3. Smart Cart & Checkout
- Split Cart System: Visually separate "Instant Items" (deliverable in 10 mins) from "Custom Orders" (estimated delivery: 5-7 days).
- Standard checkout flow with address selection and mock payment gateway integration.
### 4. Dual-Track Order Status Screen
- For Grocery/Toys: A live map tracker showing the delivery rider's progress.
- For Aari Work: A vertical stepper showing production milestones: [Order Placed -> Design Confirmed -> Artisan Stitching -> Quality Check -> Dispatched].
Ensure the UI is highly responsive, visually premium, uses Tailwind CSS for styling, and includes smooth state transitions between the customization steps.
Landing
Comments (0)
No comments yet. Be the first!
Sign in to leave a comment
AddressStep 2 of 4
Delivery Address
Select a saved address or enter a new one for your cosmic-quickcraft delivery
Saved Addresses
Priya Sharma
42 Silk Road, Mylapore Chennai, Tamil Nadu 600004 +91 98401 23456
Arun Kumar
18 Loom Street, T Nagar Chennai, Tamil Nadu 600017 +91 88705 67890
Meera Iyer
55 Thread Avenue, Velachery Chennai, Tamil Nadu 600042 +91 94440 11223
+ Add New Address
Enter a different delivery location
Address Details
Payment Method
Saved Cards
VISA
HDFC Bank
xxxx xxxx xxxx 4521
EXP 09/27
MC
ICICI Bank
xxxx xxxx xxxx 7834
EXP 12/26
The 3-digit security code on the back of your card. Your payment data is encrypted and secure.
No comments yet. Be the first!