terra-build

byB Back

Build a beautiful, simple, mobile-first interactive web app called "How Can I Express It?" IMPORTANT: This is NOT a social media app, dating app, messaging app, login system, or online service. It is a tiny offline-style interactive experience designed to be used by TWO PEOPLE TOGETHER ON ONE PHONE. The core idea: Person A wants to express a feeling toward Person B. The app first asks: "What do you want to express?" Person A chooses a feeling. Then the app transitions to a completely new screen showing: [chosen feeling] "How can I express it to you?" Now Person B holds the phone and chooses HOW they want Person A to express that feeling. The options must be written FROM PERSON B'S PERSPECTIVE. This distinction is extremely important. For example, for love: ❤️ "I wanna express my love to you" Then: "How can I express it to you?" 1. 🗣️🥰 Through words / compliments 2. 🫂 You can hug me 3. 💋 We should kiss 4. 😋 Buy me something 5. ✨ Custom DO NOT write: "Tell you" "Hug you" "Buy you something" The options should feel like requests directed toward Person A: "Tell me..." "Hug me" "Give me..." "Stay with me" etc. -------------------------------------------------- SCREEN 1 — FEELING SELECTION -------------------------------------------------- Title: "What do you want to express?" Subtitle: "Choose what you're feeling." Show large, beautiful, tappable cards: ❤️ I wanna express my love to you 😡 I'm angry at you 🥹 Son, I'm proud of you 😔 I'm feeling sad 🫂 I need comfort ✨ Something else When a feeling is tapped, animate smoothly into Screen 2. -------------------------------------------------- SCREEN 2 — EXPRESSION CHOICES -------------------------------------------------- Show the selected feeling prominently at the top. Example: ❤️ "I wanna express my love to you" Then underneath: "How can I express it to you?" Show exactly these choices: 1. 🗣️🥰 Through words / compliments 2. 🫂 You can hug me 3. 💋 We should kiss 4. 😋 Buy me something 5. ✨ Custom Each option should be a large card/button. The user should NOT be shown technical terminology. Make the interaction feel playful, intimate and natural. -------------------------------------------------- OTHER FEELINGS -------------------------------------------------- For: 😡 I'm angry at you Use: 1. 🗣️ Talk to me about why I'm angry 2. 🤫 Give me some space 3. 💬 Let me explain what hurt me 4. 🫂 Come and make it up to me 5. ✨ Custom For: 🥹 Son, I'm proud of you Use: 1. 🗣️🥰 Tell me you're proud of me 2. 🫂 You can hug me 3. 👏 Celebrate with me 4. 🎁 Buy me something 5. ✨ Custom For: 😔 I'm feeling sad Use: 1. 🗣️ Say something nice to me 2. 🫂 You can hug me 3. 👂 Listen to me 4. ❤️ Stay with me 5. ✨ Custom For: 🫂 I need comfort Use: 1. 🫂 You can hug me 2. 🗣️ Say something comforting to me 3. 👂 Listen to me 4. ❤️ Stay close to me 5. ✨ Custom -------------------------------------------------- CUSTOM -------------------------------------------------- "Something else" on Screen 1 should allow the user to type their own feeling. Example: "What do you want to express?" [ I'm really grateful for you ] Then continue to Screen 2: "I'm really grateful for you" "How can I express it to you?" The user should be able to create custom expression choices too. -------------------------------------------------- RESULT -------------------------------------------------- When Person B taps an option, show a simple satisfying result screen. Example: 🫂 "You chose: Hug me" with a small message: "That's how you want me to express it. ❤️" Then a button: "Choose another" -------------------------------------------------- DESIGN -------------------------------------------------- Make it feel like a small premium mobile app, NOT a generic website. Design goals: - Mobile-first - Very clean - Minimal - Warm and emotional - Soft animations - Large touch-friendly buttons - Beautiful typography - Lots of breathing space - Subtle background - Rounded cards - No unnecessary menus - No navbar - No dashboard - No login - No signup - No profile - No database - No notifications - No ads - No social features The app should feel like something two people pass between each other and play with for a minute. Use subtle transitions between screens. Do not overdesign it. -------------------------------------------------- TECHNICAL REQUIREMENTS -------------------------------------------------- Make it fully functional. No backend is required. No authentication. No internet connection should be required for the core interaction. Store nothing permanently. The entire experience should work locally in the browser. Make the UI responsive specifically for phone screens. IMPORTANT: Do not merely create a static mockup. Every button must actually work. Before finishing, test the complete flow: Feeling → Expression question → Options → Selection → Result → Choose another.