Embed

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Tradeshow Tycoon: Define Your Legacy</title>
    <style>
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #0f1115; color: #e6e6e6; margin: 0; }
        .container { max-width: 950px; margin: auto; padding: 20px; }
        .card { background: #1a1d24; padding: 20px; margin: 10px 0; border-radius: 12px; border: 1px solid #2e323a; }
        h1 { color: #38bdf8; text-align: center; }
        h3 { margin-top: 0; color: #facc15; }
        button { 
            padding: 12px; margin: 8px 0; border: none; border-radius: 8px; 
            cursor: pointer; background: #2563eb; color: white; width: 100%; 
            text-align: left; transition: 0.2s; font-size: 14px;
        }
        button:hover { background: #1d4ed8; transform: translateX(5px); }
        button:disabled { opacity: 0.4; cursor: not-allowed; }
        .selected { background: #16a34a !important; border: 2px solid white; }
        .bar-label { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; }
        .bar { height: 10px; background: #111827; border-radius: 6px; overflow: hidden; margin-bottom: 12px; }
        .fill { height: 100%; background: #38bdf8; transition: width 0.5s ease; }
        .manager-note { font-style: italic; color: #9ca3af; border-left: 3px solid #facc15; padding-left: 12px; margin: 10px 0; }
        .stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
        .money { color: #4ade80; font-weight: bold; }
        .highlight { color: #38bdf8; font-weight: bold; }
    </style>
</head>
<body>
<div class="container">
    <h1>🎪 Tradeshow Tycoon: Define Your Legacy</h1>
    <div id="game"></div>
</div>

<script>
/* ========================= STATE ========================= */
let state = {
    year: 1,
    cash: 750000,
    revenue: 0,
    expenses: 0,
    profit: 0,
    prestige: 25,
    satisfaction: 40,
    hype: 20,
    attendees: 1200,
    peakMoments: 0,
    strategy: { immersion: 0, tech: 0, profit: 0 }
};

/* ========================= STORYLINE (3 SCENARIOS PER YEAR) ========================= */
const YEARS = [
    [ // Year 1
        { text: "Launch Choice: 28% of attendees want networking above all. How do you welcome them?", A: "Host an 'Elite Gala' with $200k in catering and decor.", B: "Build a 'Connection Hub' using AI-matchmaking ($100k).", C: "Set up basic badge pickup and save $150k.", type: "net" },
        { text: "Floor Layout: Attendees find the 'Sea of Booths' frustrating. What's the map look like?", A: "Install massive LED 'Discovery Walls' ($80k).", B: "Design themed 'Experience Zones' for intuitive flow ($50k).", C: "Standard grid layout. Simple and free.", type: "floor" },
        { text: "Content Focus: You need a hook. The research suggests hands-on 'Doing' beats 'Watching'.", A: "Hire A-List celebrity speakers for $250k.", B: "Build 'Interactive Theaters' for hands-on labs ($70k).", C: "Host 50 standard breakout sessions for $20k.", type: "edu" }
    ],
    [ // Year 2
        { text: "Friction Point: Wayfinding is the #1 complaint. Attendees feel lost in the noise.", A: "Custom Mobile App with 'Blue-Dot' indoor GPS ($150k).", B: "Color-coded 'Sense-making' floor paths ($30k).", C: "Print 10,000 extra physical maps ($10k).", type: "way" },
        { text: "The Sponsor Dilemma: A big brand wants to dominate the entrance with giant ads.", A: "Accept for $300k, but clutter the attendee entrance.", B: "Reject and keep the 'Experience' clean and purposeful.", C: "Negotiate $100k for digital-only branding in the app.", type: "cash" },
        { text: "Personalization: Attendees are asking for curated journeys based on their roles.", A: "Automated RFID 'Interest Tracking' system ($120k).", B: "Expert-curated 'Role Tracks' in the program ($20k).", C: "Let them figure it out; stay as a generalist show.", type: "pers" }
    ],
    [ // Year 3
        { text: "Learning Reset: Data shows lecture halls are 40% empty. They want active participation.", A: "Convert ballrooms into 'Brain-Storm' pods ($100k).", B: "Introduce 'Silent Disco' style multi-track headsets ($40k).", C: "Lower the AC and add more chairs to fill space.", type: "edu" },
        { text: "Exhibitor ROE: Exhibitors are just 'Pitching'. Attendees want 'Learning'.", A: "Mandate interactive demos for all booths ($60k training).", B: "Build a central 'Demo Stage' for exhibitor use ($30k).", C: "Ignore it; focus on selling 20% more booth space.", type: "roi" },
        { text: "Energy Crisis: Afternoon fatigue is killing the vibe. How do you recharge them?", A: "A $50k 'Spectacle' parade with music and lights.", B: "A 'Quiet Zone' with biophilic design and hydration ($25k).", C: "Push the vendors to host 'Happy Hours' early.", type: "vibe" }
    ],
    [ // Year 4
        { text: "Peak Moments: 85% of people return if they have one 'Peak Moment'. What's yours?", A: "A $200k projection-mapped closing ceremony.", B: "A 'Transformation Lab' where they solve a real-world problem ($50k).", C: "Hand out high-quality $40k tech swag bags.", type: "peak" },
        { text: "Tech Evolution: AI is the talk of the industry. How do you integrate it?", A: "AI-Powered 'Concierge' Chatbot for every attendee ($130k).", B: "Smart floor-sensors to predict and fix bottlenecks ($60k).", C: "Keep it human; hire 50 extra info-staff ($30k).", type: "tech" },
        { text: "Diversity: Research shows you are missing the 'New-to-Industry' crowd.", A: "Full-scale 'Young Professional' mentorship program ($80k).", B: "Discounted 'First-Timer' tickets and meetup hub ($40k).", C: "Focus on the high-ticket senior executives.", type: "growth" }
    ],
    [ // Year 5
        { text: "Sustainability: The 'Waste' of the trade floor is becoming a PR nightmare.", A: "Switch to 100% reusable modular floor systems ($180k).", B: "Digital-only signage and recycled materials policy ($40k).", C: "Buy carbon offsets for $20k and keep the carpet.", type: "green" },
        { text: "Competition: A new virtual-first show is undercutting your prices.", A: "Build an 'Always On' digital community platform ($150k).", B: "Double down on 'In-Person Only' exclusivity.", C: "Price Match: Cut booth fees by 20% to retain clients.", type: "comp" },
        { text: "Food Experience: Attendees are tired of 'Concession Stand' meals.", A: "Curated 'Food Festival' with local organic chefs ($90k).", B: "Voucher system for nearby local restaurants ($20k).", C: "Stick to the venue catering and take the rebate.", type: "well" }
    ],
    [ // Year 6
        { text: "Gen Z Arrival: Your new attendees want 'Authenticity' and 'Storytelling'.", A: "Professional Live-Streaming & Podcast Studio ($110k).", B: "Crowd-sourced 'Unconference' tracks on the floor ($30k).", C: "Maintain the 'Gold Standard' corporate polish.", type: "genz" },
        { text: "ROI Pressure: Exhibitors want real-time analytics on attendee flow.", A: "High-tech 'Heat Map' tracking system ($140k).", B: "Post-show 'Engagement Reports' for every booth ($30k).", C: "Give them the list of attendee emails and hope for the best.", type: "roi" },
        { text: "Staffing Complexity: Your core team is burning out. Scaling is hard.", A: "Hire a global Event Management agency ($200k).", B: "Invest in 'Year-Round' staff retention and tools ($80k).", C: "Use temporary gig-workers for the heavy lifting.", type: "ops" }
    ],
    [ // Year 7
        { text: "The Content Gap: Your speakers are recycling last year's slides.", A: "Global 'Speaker Search' for fresh, disruptive voices ($150k).", B: "Format Flip: Require 50% of sessions to be Q&A/Townhall ($10k).", C: "Stick to the 'Reliable' industry veterans.", type: "edu" },
        { text: "Return on Effort: Attendees feel the 'Hustle' is too much. They need space.", A: "Transform 10% of the floor into a 'Sanctuary' park ($100k).", B: "Simplify the schedule: Fewer sessions, more depth.", C: "Density play: Add 50 more 'Micro-Booths' to empty halls.", type: "vibe" },
        { text: "Strategic Partners: A major tech firm wants to co-create the experience.", A: "Full Partnership: $250k boost but they dictate the theme.", B: "Sponsorship: $100k for a dedicated 'Innovation Lab'.", C: "Autonomy: Reject the money to keep your brand pure.", type: "cash" }
    ],
    [ // Year 8
        { text: "The Hybrid Shift: Remote attendees want a 'Window' into the live show.", A: "Multi-cam professional broadcast of the entire show ($180k).", B: "Interactive 'Portal' booths for live peer networking ($60k).", C: "Record the sessions and post them on YouTube later.", type: "tech" },
        { text: "Accessibility: You need to make the show truly inclusive for all.", A: "Full accessibility audit & sensory-friendly modifications ($90k).", B: "AI Real-time captions and mobile assistance ($40k).", C: "Standard ADA compliance is enough for now.", type: "well" },
        { text: "Data Strategy: You have years of data. How do you use it?", A: "Launch a year-round 'Industry Insights' report for $120k.", B: "Improve next year's matchmaking algorithm ($40k).", C: "Sell the aggregated data to market researchers.", type: "roi" }
    ],
    [ // Year 9
        { text: "Saturation: You've reached max capacity at the venue.", A: "Move to a massive new city and venue ($300k).", B: "Split the show into two separate dates per year ($150k).", C: "Raise ticket prices by 40% to limit attendance.", type: "growth" },
        { text: "Brand Crisis: A rival show claims you've lost your 'Human Touch'.", A: "Massive $100k PR campaign highlighting attendee stories.", B: "Host 'Founder Roundtables' to listen to core users ($20k).", C: "Ignore it; your numbers speak for themselves.", type: "vibe" },
        { text: "Future Tech: Metaverse or Mixed Reality—is it time?", A: "Invest $200k in an 'AR Overlay' experience for the floor.", B: "Simple VR headsets in the 'Learning Lab' ($30k).", C: "Wait and see; focus on physical human interaction.", type: "tech" }
    ],
    [ // Year 10
        { text: "The Legacy Decision: How will the industry remember this era?", A: "The Spectacle: A $400k 'Final Gala' that defines an era.", B: "The Impact: Donate $100k to an Industry Education fund.", C: "The Profit: Strip all costs to show a massive final margin.", type: "legacy" },
        { text: "Acquisition Offers: Three buyers are at the table. Who do you choose?", A: "The Global Titan: Most cash, but they'll corporate-ize it.", B: "The Creative Boutique: Best for the 'Experience' legacy.", C: "The Private Equity Firm: Highest immediate valuation.", type: "exit" },
        { text: "Final Impression: You are walking the floor one last time.", A: "Focus on the Technology and the Future.", B: "Focus on the People and the Connections.", C: "Focus on the Revenue and the Market Share.", type: "legacy" }
    ]
];

/* ========================= GAME ENGINE ========================= */
let yearState = { scenarios: [], done: {} };

function loadYear() {
    yearState.scenarios = YEARS[state.year - 1];
    yearState.done = {};
}

function pick(i, c) {
    if (yearState.done[i]) return;
    yearState.done[i] = c;

    if (c === "A") { // THE BOLD / HIGH COST
        state.revenue += 500000;
        state.expenses += 350000;
        state.hype += 20;
        state.satisfaction -= 2;
        state.strategy.tech++;
    } else if (c === "B") { // THE EXPERIENCE / RESEARCH-LED
        state.revenue += 350000;
        state.expenses += 150000;
        state.prestige += 12;
        state.satisfaction += 15;
        state.strategy.immersion++;
        if (state.year === 4) state.peakMoments++; // Hidden bonus
    } else if (c === "C") { // THE PROFIT / TRADITIONAL
        state.revenue += 200000;
        state.expenses += 40000;
        state.prestige -= 2;
        state.strategy.profit++;
    }
    render();
}

function getManagerComment() {
    const tones = [
        "“Year 1: 28% of people are here for networking. Focus on the connection, kid.”",
        "“Year 2: Navigation is the #1 friction point. If they get lost, we lose money.”",
        "“Year 3: Lecture halls are dying. Give them something tactile or give them a refund.”",
        "“Year 4: One Peak Moment. That's all we need for an 85% return rate.”",
        "“Year 5: Sustainability isn't just a trend; it's our license to operate now.”",
        "“Year 6: Gen Z is in the house. If it feels like a sales pitch, they're out.”",
        "“Year 7: Energy is low. We need a 'Reset' before the afternoon slump.”",
        "“Year 8: AI should solve discovery—find the needle in the haystack for them.”",
        "“Year 9: We're at the top. The only way is down unless we innovate.”",
        "“Year 10: This is for the history books. How do you want to be remembered?”"
    ];
    return tones[state.year - 1] || "“Finish strong!”";
}

function endYear() {
    if (Object.keys(yearState.done).length < 3) return alert("Make all 3 decisions first!");

    let retentionBonus = state.peakMoments > 0 ? 1.1 : 1.0;
    let ticketRevenue = state.attendees * (160 + (state.prestige * 1.5));
    let sponsorRevenue = (state.prestige * 15000) + (state.satisfaction * 8000);
    state.revenue += ticketRevenue + sponsorRevenue;
    
    let operatingCost = (state.attendees * 50) + (state.year * 20000);
    state.expenses += operatingCost;
    
    state.profit = state.revenue - state.expenses;
    state.cash += state.profit;

    if (state.cash < 0) {
        document.getElementById("game").innerHTML = `<div class="card" style="text-align:center;"><h1 style="color:#f87171;">💥 BANKRUPTCY</h1><p>The industry moves fast. You ran out of cash in Year ${state.year}.</p><button onclick="location.reload()">Start Over</button></div>`;
        return;
    }

    state.attendees += Math.floor(((state.hype * 10) + (state.satisfaction * 8)) * retentionBonus);
    state.revenue = 0; state.expenses = 0;
    state.year++;

    if (state.year <= 10) { loadYear(); render(); } else { renderExit(); }
}

function renderBar(label, val, max = 250) {
    let percent = Math.min(100, (val / max) * 100);
    return `<div class="bar-label"><span>${label}</span><span>${val}</span></div><div class="bar"><div class="fill" style="width:${percent}%"></div></div>`;
}

function renderExit() {
    let valuation = (state.cash * 1.6) + (state.attendees * 300) + (state.prestige * 120000);
    let identity = "The Reliable Operator";
    let desc = "You ran a solid business, but didn't push the boundaries of experience.";
    
    if (state.strategy.immersion > 18) {
        identity = "The Experience Architect";
        desc = "You transformed the expo into a cultural movement. Your 85% retention is legendary.";
    } else if (state.strategy.tech > 18) {
        identity = "The Tech Visionary";
        desc = "Your show was a digital marvel, though some missed the human touch.";
    } else if (state.strategy.profit > 18) {
        identity = "The Profit Maximizer";
        desc = "Your margins were the envy of the board, even if the floor felt a bit clinical.";
    }

    document.getElementById("game").innerHTML = `
        <div class="card" style="text-align:center;">
            <h1>🏁 THE EXIT</h1>
            <p>Your 10-year journey as an architect of industry concludes.</p>
            <h2 style="font-size:42px; color:#4ade80;">$${Math.floor(valuation).toLocaleString()}</h2>
            <p class="highlight">${identity}</p>
            <p>${desc}</p>
            <hr style="border:0; border-top:1px solid #333; margin:20px 0;">
            <p>Final Attendees: ${state.attendees.toLocaleString()}</p>
            <p>Cash on Hand: $${state.cash.toLocaleString()}</p>
            <button onclick="location.reload()" style="text-align:center;">Build a New Legacy</button>
        </div>`;
}

function render() {
    let g = document.getElementById("game");
    let html = `<div class="card"><h3>Year ${state.year}</h3><div class="manager-note">${getManagerComment()}</div></div>`;
    yearState.scenarios.forEach((s, i) => {
        let chosen = yearState.done[i];
        html += `<div class="card"><p><b>${s.text}</b></p>
            <button onclick="pick(${i},'A')" ${chosen ? "disabled" : ""} class="${chosen === 'A' ? 'selected' : ''}">A: ${s.A}</button>
            <button onclick="pick(${i},'B')" ${chosen ? "disabled" : ""} class="${chosen === 'B' ? 'selected' : ''}">B: ${s.B}</button>
            <button onclick="pick(${i},'C')" ${chosen ? "disabled" : ""} class="${chosen === 'C' ? 'selected' : ''}">C: ${s.C}</button>
        </div>`;
    });
    html += `<div class="card" style="text-align:center;"><button onclick="endYear()" style="background:#f59e0b; font-weight:bold; text-align:center;">▶ Close Books for Year ${state.year}</button></div>
        <div class="stats-grid">
            <div class="card"><p>Cash: <span class="money">$${state.cash.toLocaleString()}</span></p><p>Last Profit: <span class="money">$${state.profit.toLocaleString()}</span></p><p>Attendees: ${state.attendees.toLocaleString()}</p></div>
            <div class="card">${renderBar("Prestige", state.prestige)}${renderBar("Satisfaction", state.satisfaction)}${renderBar("Hype", state.hype)}</div>
        </div>`;
    g.innerHTML = html;
    window.scrollTo(0,0);
}

loadYear(); render();
</script>
</body>
</html>

Silver EPG