Virtual Mall + Stores Development in Unity
Budget: $3,000 – $5,000 USD
I have a rich application to create a mall, stores, characters and real stores. The UI UX has been completed and now I want to complete the project.
Unity Developer (3D Developer)
Objective: Build the virtual mall and store scenes in Unity, based on UI/UX Figma designs.
Responsibilities:
1. Project Setup
• Install Unity (recommended LTS version)
• Create a new mobile-optimized project (iOS & Android)
• Set up a 3D mall scene environment
2. UI Integration
• Receive Figma designs from UI/UX
• Convert the “Enter Mall” screen to a live Unity scene
• Use pre-made assets from Unity Asset Store, Sketchfab, or CGTrader
3. Virtual Mall Scene
• Create a mall map including walkable corridors, store spaces, entry/exit points
• Enable walking movement via player avatar
• Set up each store as a separate scene
4. Ready Player Me Integration
• Integrate the Ready Player Me SDK
• Support avatar customization for customers and merchants
• Enable lip-sync for voice or text
5. Store Interaction
• When entering a store:
• Show products on numbered shelves
• Clicking a product opens a WebView or pop‑up for details (to be linked to Flutter later)
• Enable placeholder interaction: voice/text to staff
• Allow free navigation throughout the mall
6. Merchant Store Customization (Future Scope)
• Design a store‑builder interface: choose store type (perfumes, clothes, electronics), drag/drop decor (shelves, lights, cashier, etc.)
• Save layout and object positions via a backend API
7. Deliverables Handoff
• Provide Unity scene files, asset links, and store identifiers (Store ID or tags)
New Additions:
• Group Shopping Support
• When entering via a “Group Mall” screen, load a multiplayer scene with 2–6 avatars
• Sync avatar positions via Firebase Realtime DB or similar placeholder
• Enable simple interactions (pointing at products or basic chat)
• Store Exit by Movement
• Place an “Exit” door instead of a back button
• When the avatar walks through it, return to the mall scene
Expected Deliverables:
• Unity project with
• Main mall scene
• Separate store scenes
• Avatar movement via Ready Player Me
• Initial integration with Flutter (WebView or Unity Widget)
⸻
: Mobile App Developer (Flutter Developer)
Objective: Build the mobile app using Flutter, linking UI to functionality, and prepare for integration with Unity, backend, and AI.
Responsibilities:
1. Project Setup
• Create a new Flutter project (Android + iOS)
• Integrate WebView or Unity Widget for 3D scenes
• Support English and Arabic
2. Return Policy Implementation
• is_returnable == true: “This product can be returned within X days from purchase”
• is_returnable == false: “This product is non-returnable”
3. Screens to Build (based on Figma):
1. Splash Screen (3D Shopping AI) → auto-navigation to Login
2. Login/Register – Toggle (Customer/Merchant), name, phone, pass
3. City Selection – default: Riyadh
4. Enter Mall – opens Unity scene via WebView
5. Inside Store View – fetch and display product list
6. Product Details – image, name, desc, price, add to cart
7. Cart Page – item list, total, checkout
8. Chat Page – text chat and AI placeholder response
9. User Profile – name, type, settings
10. Orders + “PayForOther” screen – send or pay requests with statuses
4. Merchant Camera Support
• Add product page with camera upload
• Inputs: cover/extra images, price, shelf number, name, ‘Publish Product’
5. Integration Needs
• Unity WebView integration
• Connect with mocked backend APIs (for registration, product fetch, orders)
• Future: Ready Player Me, OpenAI functions
6. Additional Functionalities
• Manage user session (logged in/out)
• Session handling between customer and merchant
• City now option + tracking live users and spending
• Group support (2–6 users shopping together)
⸻
: Backend & API Developer
Objective: Build the server infrastructure, database, and REST/GraphQL APIs to support the app.
Responsibilities:
1. Infrastructure Setup
• Choose DB (Firestore, MongoDB, MySQL, etc.)
• Use a backend framework (Node.js, Laravel, Django, etc.)
• Implement RESTful or GraphQL APIs
2. Data Models / Schema:
• Users, Stores, Products (with returnability flags), Chats, Carts, Orders, PayForOtherRequests, Cities, Groups
3. Endpoints:
• Authentication: /register, /login, /profile
• Stores & products: create/get stores, products
• Cart & orders: add/remove product, checkout
• Pay-for-other: request/send/pay
• Chat: send and get chat
• Stats: /city/{name}/stats
• Groups: create/invite/get
4. AI Integration:
• Internal endpoint generating product description via OpenAI GPT
5. Wallet & Payments:
• Deduct from wallet, payment integration (Tap, Stripe, STC Pay)
6. Other Features:
• Session tokens, role-based auth, file uploads, storage (Cloudinary, Firebase Storage)
7. Deliverables:
• Full backend code
• API Documentation + Postman collection
• .env file, schema/data setup
Phase 5: AI Developer (Artificial Intelligence Specialist)
Objective: Activate AI features within the app to enhance merchant and customer experience—generating product descriptions, designing 3D store layouts, enabling intelligent chat, and more.
Full Responsibilities:
Integration with OpenAI GPT
1. Auto-generated Product Descriptions:
• When a merchant uploads a product image plus a simple name, the system auto-generates a high-quality, engaging description.
• Example: Product name is “Royal Premium Perfume” → GPT returns a luxurious description in seconds.
2. In‑Store AI Assistant (ChatBot):
• Embedded chatbot within the store page.
• Customers can ask any questions about the product or store.
• Merchants can customize the chatbot or let the AI handle it.
3. Optional Real-time Translation:
• If the customer writes in Arabic and the merchant responds in English—or vice versa—translation happens automatically.
⸻
Integration with Runway ML, Luma AI, or Kaedim
1. Automatic 3D Store Layout from Photo:
• Merchant uploads a real photo of their storefront → AI analyzes it and generates a realistic 3D scene.
• The output is sent to the Unity developer (via WebGL link or GLB file).
2. Automated Scene-Builder Template:
• Merchant selects a store type + an image → system creates a templated interior scene (with shelves, lighting, layout).
⸻
Integration with Ready Player Me API
1. Dynamic Avatar Creation:
• Merchant or customer designs their avatar (face, clothes, lip-sync).
• A 3D avatar link is generated and integrated into Unity.
2. Voice-Linked Avatar Animation:
• When the user speaks (text or voice), the avatar’s mouth moves synched to the speech.
• Uses TTS or audio input.
⸻
Voice & Conversational Features
1. Text-to-Speech (TTS):
• Can be implemented using services like ElevenLabs or Google Cloud TTS.
2. Speech-to-Text (STT):
• Converts spoken messages into text automatically.
⸻
Expected Deliverables:
• AI integration scripts connected to the backend API
• A ready-to-use chat and voice AI module inside the app (Flutter or web)
• A module to connect with Unity to generate store scenes via AI
• Documentation detailing each API call and its purpose
⸻
: Camera & Product Media Developer
Objective: Enable merchants to capture and upload product images directly within the app, correctly organizing them into shelves (e.g., Shelf #3), including a “cover image” plus additional product photos.
Full Responsibilities:
In–App Camera Module (Flutter)
1. “Capture Product” Button:
• Located on the merchant’s page, this opens the device camera.
• Merchant takes a photo of the product.
2. Image Handling Form:
• After capture, show a form to enter:
• Product name
• Price
• Shelf number
• Cover image (first photo shown to customers)
• 3–5 additional images
3. Re-shoot/Delete Option:
• Merchant can retake or delete images before saving.
⸻
Product File Organization
• Save each product in the app’s database with:
• Shelf number
• Image set
• Associated metadata
• First image as cover; others displayed within detail view
⸻
AI Integration for Description
• Send product image + name to GPT → receive generated description
• Prefills the description field, which merchant can modify if desired.
⸻
Additional Features
• Auto-cropping or filters for image enhancement
• Filter view option: customers can click “Shelf 3” and view only products from that shelf
⸻
Security & Permissions
• Only the merchant who uploaded can edit their products
• Each image is tied to merchant’s account and product ID
⸻
Expected Deliverables:
• A fully integrated Flutter module to:
• Open the camera and capture product photos
• Present the form to input product metadata
• Auto-save product with shelf assignment
• Upload everything via API to the backend
• Ready-to-use endpoints/APIs to manage these uploads and metadata
Unity Developer (3D Developer)
Objective: Build the virtual mall and store scenes in Unity, based on UI/UX Figma designs.
Responsibilities:
1. Project Setup
• Install Unity (recommended LTS version)
• Create a new mobile-optimized project (iOS & Android)
• Set up a 3D mall scene environment
2. UI Integration
• Receive Figma designs from UI/UX
• Convert the “Enter Mall” screen to a live Unity scene
• Use pre-made assets from Unity Asset Store, Sketchfab, or CGTrader
3. Virtual Mall Scene
• Create a mall map including walkable corridors, store spaces, entry/exit points
• Enable walking movement via player avatar
• Set up each store as a separate scene
4. Ready Player Me Integration
• Integrate the Ready Player Me SDK
• Support avatar customization for customers and merchants
• Enable lip-sync for voice or text
5. Store Interaction
• When entering a store:
• Show products on numbered shelves
• Clicking a product opens a WebView or pop‑up for details (to be linked to Flutter later)
• Enable placeholder interaction: voice/text to staff
• Allow free navigation throughout the mall
6. Merchant Store Customization (Future Scope)
• Design a store‑builder interface: choose store type (perfumes, clothes, electronics), drag/drop decor (shelves, lights, cashier, etc.)
• Save layout and object positions via a backend API
7. Deliverables Handoff
• Provide Unity scene files, asset links, and store identifiers (Store ID or tags)
New Additions:
• Group Shopping Support
• When entering via a “Group Mall” screen, load a multiplayer scene with 2–6 avatars
• Sync avatar positions via Firebase Realtime DB or similar placeholder
• Enable simple interactions (pointing at products or basic chat)
• Store Exit by Movement
• Place an “Exit” door instead of a back button
• When the avatar walks through it, return to the mall scene
Expected Deliverables:
• Unity project with
• Main mall scene
• Separate store scenes
• Avatar movement via Ready Player Me
• Initial integration with Flutter (WebView or Unity Widget)
⸻
: Mobile App Developer (Flutter Developer)
Objective: Build the mobile app using Flutter, linking UI to functionality, and prepare for integration with Unity, backend, and AI.
Responsibilities:
1. Project Setup
• Create a new Flutter project (Android + iOS)
• Integrate WebView or Unity Widget for 3D scenes
• Support English and Arabic
2. Return Policy Implementation
• is_returnable == true: “This product can be returned within X days from purchase”
• is_returnable == false: “This product is non-returnable”
3. Screens to Build (based on Figma):
1. Splash Screen (3D Shopping AI) → auto-navigation to Login
2. Login/Register – Toggle (Customer/Merchant), name, phone, pass
3. City Selection – default: Riyadh
4. Enter Mall – opens Unity scene via WebView
5. Inside Store View – fetch and display product list
6. Product Details – image, name, desc, price, add to cart
7. Cart Page – item list, total, checkout
8. Chat Page – text chat and AI placeholder response
9. User Profile – name, type, settings
10. Orders + “PayForOther” screen – send or pay requests with statuses
4. Merchant Camera Support
• Add product page with camera upload
• Inputs: cover/extra images, price, shelf number, name, ‘Publish Product’
5. Integration Needs
• Unity WebView integration
• Connect with mocked backend APIs (for registration, product fetch, orders)
• Future: Ready Player Me, OpenAI functions
6. Additional Functionalities
• Manage user session (logged in/out)
• Session handling between customer and merchant
• City now option + tracking live users and spending
• Group support (2–6 users shopping together)
⸻
: Backend & API Developer
Objective: Build the server infrastructure, database, and REST/GraphQL APIs to support the app.
Responsibilities:
1. Infrastructure Setup
• Choose DB (Firestore, MongoDB, MySQL, etc.)
• Use a backend framework (Node.js, Laravel, Django, etc.)
• Implement RESTful or GraphQL APIs
2. Data Models / Schema:
• Users, Stores, Products (with returnability flags), Chats, Carts, Orders, PayForOtherRequests, Cities, Groups
3. Endpoints:
• Authentication: /register, /login, /profile
• Stores & products: create/get stores, products
• Cart & orders: add/remove product, checkout
• Pay-for-other: request/send/pay
• Chat: send and get chat
• Stats: /city/{name}/stats
• Groups: create/invite/get
4. AI Integration:
• Internal endpoint generating product description via OpenAI GPT
5. Wallet & Payments:
• Deduct from wallet, payment integration (Tap, Stripe, STC Pay)
6. Other Features:
• Session tokens, role-based auth, file uploads, storage (Cloudinary, Firebase Storage)
7. Deliverables:
• Full backend code
• API Documentation + Postman collection
• .env file, schema/data setup
Phase 5: AI Developer (Artificial Intelligence Specialist)
Objective: Activate AI features within the app to enhance merchant and customer experience—generating product descriptions, designing 3D store layouts, enabling intelligent chat, and more.
Full Responsibilities:
Integration with OpenAI GPT
1. Auto-generated Product Descriptions:
• When a merchant uploads a product image plus a simple name, the system auto-generates a high-quality, engaging description.
• Example: Product name is “Royal Premium Perfume” → GPT returns a luxurious description in seconds.
2. In‑Store AI Assistant (ChatBot):
• Embedded chatbot within the store page.
• Customers can ask any questions about the product or store.
• Merchants can customize the chatbot or let the AI handle it.
3. Optional Real-time Translation:
• If the customer writes in Arabic and the merchant responds in English—or vice versa—translation happens automatically.
⸻
Integration with Runway ML, Luma AI, or Kaedim
1. Automatic 3D Store Layout from Photo:
• Merchant uploads a real photo of their storefront → AI analyzes it and generates a realistic 3D scene.
• The output is sent to the Unity developer (via WebGL link or GLB file).
2. Automated Scene-Builder Template:
• Merchant selects a store type + an image → system creates a templated interior scene (with shelves, lighting, layout).
⸻
Integration with Ready Player Me API
1. Dynamic Avatar Creation:
• Merchant or customer designs their avatar (face, clothes, lip-sync).
• A 3D avatar link is generated and integrated into Unity.
2. Voice-Linked Avatar Animation:
• When the user speaks (text or voice), the avatar’s mouth moves synched to the speech.
• Uses TTS or audio input.
⸻
Voice & Conversational Features
1. Text-to-Speech (TTS):
• Can be implemented using services like ElevenLabs or Google Cloud TTS.
2. Speech-to-Text (STT):
• Converts spoken messages into text automatically.
⸻
Expected Deliverables:
• AI integration scripts connected to the backend API
• A ready-to-use chat and voice AI module inside the app (Flutter or web)
• A module to connect with Unity to generate store scenes via AI
• Documentation detailing each API call and its purpose
⸻
: Camera & Product Media Developer
Objective: Enable merchants to capture and upload product images directly within the app, correctly organizing them into shelves (e.g., Shelf #3), including a “cover image” plus additional product photos.
Full Responsibilities:
In–App Camera Module (Flutter)
1. “Capture Product” Button:
• Located on the merchant’s page, this opens the device camera.
• Merchant takes a photo of the product.
2. Image Handling Form:
• After capture, show a form to enter:
• Product name
• Price
• Shelf number
• Cover image (first photo shown to customers)
• 3–5 additional images
3. Re-shoot/Delete Option:
• Merchant can retake or delete images before saving.
⸻
Product File Organization
• Save each product in the app’s database with:
• Shelf number
• Image set
• Associated metadata
• First image as cover; others displayed within detail view
⸻
AI Integration for Description
• Send product image + name to GPT → receive generated description
• Prefills the description field, which merchant can modify if desired.
⸻
Additional Features
• Auto-cropping or filters for image enhancement
• Filter view option: customers can click “Shelf 3” and view only products from that shelf
⸻
Security & Permissions
• Only the merchant who uploaded can edit their products
• Each image is tied to merchant’s account and product ID
⸻
Expected Deliverables:
• A fully integrated Flutter module to:
• Open the camera and capture product photos
• Present the form to input product metadata
• Auto-save product with shelf assignment
• Upload everything via API to the backend
• Ready-to-use endpoints/APIs to manage these uploads and metadata