ScentWorld is an immersive web application that transforms fragrance composition into a visual and narrative experience. By dragging and dropping scent notes into a perfume pyramid, users unlock vivid memory scenes that evolve dynamically with each addition.

Think of it as a digital perfume organ meets storytelling engine — where jasmine, leather, and sea salt don't just blend into a fragrance, but conjure entire worlds.

The core experience featuring:

• 200+ fragrance notes across 14 categories
• Dynamic memory scene generation
• Elegant glassmorphic UI with ambient music
• Drag-and-drop or click-to-select note placement
• Expanded inspiration catalog (classic, designer, niche icons)
• Formula concentration controls and dominance visualization
• IFRA/allergen checks, interaction matrix, accords builder, and cost estimator
• Scent wheel, family radar profile, longevity/sillage estimate, and similarity matcher
• URL-encoded formula sharing (?formula=...) with instant load
• Guided perfumery tutorials + note encyclopaedia panel

AI-enhanced edition with:

• "Dream up a Scene" — AI generates unique, poetic memory descriptions
• "Consult the Alchemist" — Get personalized fragrance critiques and suggestions
• Powered by OpenRouter's free models for creative text generation
• All advanced formula/R&D tools from the main version
• AI persona profiler output (target wearer, season suitability, gender suitability)

• 🎯 Intuitive Interface — Drag notes from the sidebar or click to assign to pyramid layers
• 🔺 Perfume Pyramid — Authentic Top/Heart/Base note structure
• 🖼️ Living Memory Canvas — Scenes that shift based on note combinations
• 🎵 Ambient Soundscape — Classical piano accompaniment (toggleable)
• 📱 Responsive Design — Seamless experience on desktop and mobile
• 🌈 14 Note Families — From Florals to Synthetics, with color-coded chips
• 💯 Note Concentration Sliders — Per-note percentage dials + 100% lock state
• 🧪 Concentration Type Selector — Parfum/EDP/EDT/EDC/Aftershave longevity and sillage readout
• 🧷 Fixative Tagging — Base-note fixative markers + fixation score
• ⏱️ Volatility Timeline — Time-based active-note preview
• 🍶 Solvent/Carrier Selector — Ethanol/IPM/DPG/oil dry-down projection
• ⚠️ IFRA + Allergen Panel — Restriction warnings and auto-generated allergen declaration
• 🧩 Interaction Matrix — Synergy/conflict view for selected notes
• 🧱 Accords Builder — Preset and custom accord packs
• 💲 Raw Material Cost Estimator — Cost tier + estimated cost-per-gram
• 🧭 Scent Wheel + Radar — Family coverage and profile shape visualization
• 🔍 Similar Fragrance Matcher — Family-overlap similarity scoring
• 🔗 Shareable Formula URLs — Copy/share complete compositions via URL parameters
• 🎓 Guided Tutorials — Step-by-step fougère/chypre/oriental workflows
• 📖 Note Encyclopaedia — Click note chips to inspect material details

• ✨ Dream Mode — Generate personalized memory narratives using AI
• ⚗️ Alchemist Critique — Receive expert feedback on balance and composition
• 🔮 Adaptive Storytelling — AI interprets your fragrance choices into prose
• 🧬 Target Persona Profiler — Wearer profile + season + gender suitability

• Zero Dependencies — Pure HTML/CSS/JS with Tailwind CDN
• Smooth Animations — Glassmorphism effects and parallax transitions
• Smart Memory Engine — Combinatorial logic generates 50+ unique scenes
• Environment Variable Support — Secure API key management with .env.local

Simply visit the live demo — no setup required!

1. Clone the repository

   git clone https://github.com/hongpenggg/scentworld.git
   cd scentworld

2. Open in browser

   # Main version
   open index.html
   
   # AI version (requires API key setup)
   open gemini.html

3. Set up AI features (optional)

   • Create a .env.local file in the root directory
   • Add your OpenRouter API key:

     VITE_OPENROUTER_API_KEY=your_key_here

   • Get a free API key at OpenRouter

ScentWorld AI uses OpenRouter to access the best free language models for creative generation.

1. Sign up at OpenRouter
2. Get your API key from the dashboard
3. Create .env.local:

   VITE_OPENROUTER_API_KEY=sk-or-v1-your-key-here

If hosting on GitHub Pages:

1. Go to your repository → Settings → Secrets and variables → Actions
2. Create a new secret: VITE_OPENROUTER_API_KEY
3. Paste your OpenRouter API key

Note: The free tier uses OpenRouter's auto-routing to select the best available free model (e.g., Mistral 7B, Nous Hermes, etc.)

ScentWorld features 200+ authentic fragrance notes organized into 14 families:

All notes sourced from Fragrantica's comprehensive database and professional perfumery resources.

ScentWorld's core innovation is its Combinatorial Scene Generator:

1. Family Analysis — Counts note families (Floral, Woody, etc.) in your composition
2. Dominant Detection — Identifies primary and secondary family influences
3. Base Scene Selection — Maps dominant family to an atmospheric setting
4. Layering Modifiers — Adds secondary family characteristics
5. Note-Specific Details — Inserts unique flavor text for special ingredients (e.g., oud, ink, marine)
6. Hybrid Titles — Creates special names for specific family combinations

Example:

• Top: Bergamot, Lemon → Citrus
• Heart: Rose, Jasmine → Floral
• Base: Sandalwood, Oud → Woody

→ Generated Scene: "The Enchanted Library" — A mahogany study where bright sunlight streams through stained glass, the air thick with blooming jasmine climbing ancient bookshelves...

• Frontend: Pure HTML5, CSS3 (Tailwind), Vanilla JavaScript
• Fonts: Playfair Display (serif), Inter/Lato (sans-serif)
• Icons: Lucide Icons
• AI Integration: OpenRouter API (free tier)
• Hosting: GitHub Pages
• Animation: CSS transitions, glassmorphism, parallax effects

Why no framework?
ScentWorld prioritizes simplicity, instant load times, and accessibility. The entire experience runs client-side with zero dependencies.

• Perfume Enthusiasts — Visualize fragrance compositions before buying
• Aspiring Perfumers — Learn note interactions and pyramid balance
• Writers & Creatives — Generate olfactory inspiration for storytelling
• Sensory Education — Teach fragrance families and note categories
• Meditation & Mindfulness — Explore scent-memory associations

• Core memory engine with 50+ scenes
• AI-generated narrative mode
• Comprehensive note library (200+ notes)
• OpenRouter integration
• Save/share compositions via URL parameters
• User-submitted memory scenes
• Fragrance recommendation engine
• Mobile app version (PWA)
• Multilingual support (French, Japanese, Arabic)
• Integration with Fragrantica API
• VR mode for immersive olfactory visualization

Contributions are welcome! Here's how:

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to branch (git push origin feature/amazing-feature)
5. Open a Pull Request

• Add new memory scene templates
• Expand note library with rare ingredients
• Improve AI prompts for better narratives
• Create themed UI variants (dark mode, seasons)
• Translate to new languages

MIT License — feel free to use, modify, and distribute with attribution.

• Music: Janáček's Sonata 1.X.1905 performed by Charlie Albright (Free Music Archive)
• Note Data: Fragrantica, Basenotes, Perfume Society
• AI Models: OpenRouter community (Mistral, Nous Research, Meta)
• Design Inspiration: Luxury perfume houses and olfactory art installations

Hongpeng Wei
GitHub • Website