[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_23":24,"_25":21,"_26":27,"_28":27,"_29":21,"_30":21,"_31":21,"_32":21,"_33":34},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":-7,"_12":13,"_14":15,"_16":17,"_18":19,"_20":21,"_22":21},"sharedTextdocId","689586e507a48191962275c3c025a2e6","versionInt","title","Super Prompting Quest — Canvas Prototype","type","code/react","content","import React, { useMemo, useState } from \"react\";\n\nconst FEEDBACK = {\n character: \"Add a clear Character: specify a role/persona the AI should act as.\",\n objective: \"Add an Objective: state the deeper 'why' behind the work.\",\n dosdonts: \"Include Dos & Don'ts: constraints, rules, or things to avoid.\",\n output: \"Specify Output: format, tone, length, and audience.\",\n bonus: \"Bonus points: include numbers, audience, and deadlines for specificity.\",\n};\n\nconst MISSIONS = [\n {\n id: \"L1\",\n title: \"CO-DO Warm‑Up: Fix a Vague Prompt\",\n scenario: \"You need a customer email about a shipping delay that preserves trust.\",\n starter: \"Write an email about a shipping delay.\",\n tips: [\n \"Add a Character like 'Head of Customer Success' to set tone.\",\n \"Explain the Objective: retain trust and reduce support tickets.\",\n \"Dos/Don'ts: no buzzwords, under 180 words, offer a next step.\",\n \"Output: plain‑text email with subject line.\",\n ],\n challenge: \"Rewrite the starter prompt into a full CO‑DO prompt that would get ChatGPT to write the perfect email.\",\n pass: 60,\n },\n {\n id: \"L2\",\n title: \"Objective Drill: Motivate the Team\",\n scenario: \"Summarize Q3 to motivate the sales team for Q4.\",\n starter: \"Summarize Q3 performance.\",\n tips: [\n \"Make the 'why' explicit: motivation, not just reporting.\",\n \"Dos/Don'ts: 150–200 words, 3 wins, 3 lessons, 3 priorities w/ owners.\",\n \"Output: internal memo for the sales team (not the board).\",\n ],\n challenge: \"Turn the starter prompt into one that clearly motivates a sales team, not just reports numbers.\",\n pass: 65,\n },\n {\n id: \"L3\",\n title: \"Guardrails: Board Memo on Expansion\",\n scenario: \"You owe the board a memo on expansion into two validated markets.\",\n starter: \"Write a memo about our expansion.\",\n tips: [\n \"Character: strategy lead.\",\n \"Objective: drive a go/no‑go discussion.\",\n \"Dos/Don'ts: avoid buzzwords, ≤ 250 words, quantify assumptions, no speculation.\",\n \"Output: memo with a 3‑row risk table (risk/mitigation/owner).\",\n ],\n challenge: \"Build a CO‑DO prompt that would help an AI draft a board‑ready expansion memo including risks.\",\n pass: 70,\n },\n {\n id: \"L4\",\n title: \"Output Precision: Slack Announcement\",\n scenario: \"Announce a new AI tool to product managers and drive adoption.\",\n starter: \"Tell the team about the new AI tool.\",\n tips: [\n \"Character: product ops lead.\",\n \"Objective: 50 users complete onboarding this week.\",\n \"Dos/Don'ts: 5 bullets, include 3 quick wins with owners & dates; no PII.\",\n \"Output: Slack post; casual but directive; include help channel.\",\n ],\n challenge: \"Create a CO‑DO prompt that makes ChatGPT write a Slack post that gets 50 PMs to onboard this week.\",\n pass: 70,\n },\n {\n id: \"L5\",\n title: \"Boss Level: Press Release for Investors\",\n scenario: \"Craft a PR that attracts Series B investors (signal traction & moat).\",\n starter: \"We need a press release.\",\n tips: [\n \"Character: top‑tier tech PR lead.\",\n \"Objective: attract investor interest (not just brand awareness).\",\n \"Dos/Don'ts: include metrics (MRR, growth %, retention), one customer quote; no vague superlatives.\",\n \"Output: press release (inverted pyramid) + 3–5 headline options (< 12 words).\",\n ],\n challenge: \"Design a CO‑DO prompt that convinces an AI to write an investor‑focused PR with real metrics.\",\n pass: 80,\n },\n {\n id: \"L6\",\n title: \"Boss Level: Vendor RFP (Compliance‑Driven)\",\n scenario: \"Draft an RFP to evaluate global AI transcription vendors.\",\n starter: \"Create an RFP for vendors.\",\n tips: [\n \"Character: procurement lead.\",\n \"Objective: shortlist 3 vendors for a 2‑week pilot.\",\n \"Dos/Don'ts: SOC2, EN+VI accuracy > 92%, price cap $5k/mo, no PII storage.\",\n \"Output: RFP sections (Scope, Must‑haves, Evaluation, Timeline) + response template.\",\n ],\n challenge: \"Write a CO‑DO prompt that gets ChatGPT to produce a compliant RFP with all criteria met.\",\n pass: 85,\n },\n];\n\nfunction scorePrompt(text) {\n const t = (text || \"\").toLowerCase();\n const hasCharacter = /(act as|be |emulate|role:|character:)/.test(t);\n const hasObjective = /( to |so that|in order to|goal:|objective:)/.test(t);\n const hasDosDonts = /(don't|do not|avoid|keep it under|no jargon|must|constraints:|rules:)/.test(t);\n const hasOutput = /(memo|press release|slack|email|bullets|bullet|paragraph|tone|format|table|outline|one-pager|slides?)/.test(t);\n const specificity = (t.match(/\\b\\d+\\b/g) || []).length >= 1;\n const audience = /(for the board|for execs|for customers|for sales|for engineers|for c-suite|for ceo|for team|for product managers)/.test(t);\n\n const score = Math.min(\n 100,\n (hasCharacter + hasObjective + hasDosDonts + hasOutput) * 20 + (specificity ? 5 : 0) + (audience ? 5 : 0)\n );\n\n const missing = [];\n if (!hasCharacter) missing.push(FEEDBACK.character);\n if (!hasObjective) missing.push(FEEDBACK.objective);\n if (!hasDosDonts) missing.push(FEEDBACK.dosdonts);\n if (!hasOutput) missing.push(FEEDBACK.output);\n if (!specificity || !audience) missing.push(FEEDBACK.bonus);\n\n return { score, missing, parts: { hasCharacter, hasObjective, hasDosDonts, hasOutput, specificity, audience } };\n}\n\nexport default function SuperPromptingQuest() {\n const [missionIndex, setMissionIndex] = useState(0);\n const [prompt, setPrompt] = useState(\"\");\n const [result, setResult] = useState(null);\n const [xp, setXp] = useState(0);\n const [streak, setStreak] = useState(0);\n\n const mission = useMemo(() => MISSIONS[missionIndex], [missionIndex]);\n const level = missionIndex + 1;\n\n const testPrompt = () => setResult(scorePrompt(prompt));\n\n const advance = () => {\n if (!result) return;\n if (result.score >= mission.pass) {\n setXp(xp + Math.max(10, Math.round(result.score / 2)));\n setStreak(streak + 1);\n if (missionIndex < MISSIONS.length - 1) {\n setMissionIndex(missionIndex + 1);\n setPrompt(\"\");\n setResult(null);\n }\n } else {\n setStreak(0);\n }\n };\n\n return (\n

SuperPrompting Quest

XP: {xp} • Streak: {streak}🔥

{mission.title}

{mission.scenario}

{mission.challenge}

Pass score ≥ {mission.pass}

Tips

setPrompt(e.target.value)} placeholder=\"Character:...\\nObjective:...\\nDo/Don't:...\\nOutput:...\" className=\"w-full h-40 p-3 rounded-2xl border-2 border-pink-400\" />\n          <div className=\"flex gap-3 mt-4\">\n            <button onClick={testPrompt} className=\"flex-1 bg-gradient-to-r from-yellow-400 via-pink-500 to-purple-600 text-white py-2 rounded-full\">Test AI ⚡</button>\n            <button onClick={() => {setPrompt(\"\"); setResult(null);}} className=\"bg-gray-200 px-4 py-2 rounded-full\">Reset</button>\n          </div>\n        </div>\n\n        <div className=\"bg-white/95 rounded-3xl shadow-2xl p-6\">\n          {!result && <div className=\"text-sm text-neutral-700\">Write your prompt and click Test AI.</div>}\n          {result && (\n            <div>\n              <div className=\"text-sm\">CO‑DO Score: {result.score}/100</div>\n              <div className=\"mt-2\">\n                {result.missing.length > 0 && (\n                  <>\n                    <div className=\"text-sm font-medium\">What to fix:</div>\n                    <ul className=\"list-disc pl-5 text-sm\">\n                      {result.missing.map((m,i) => <li key={i}>{m}</li>)}\n                    </ul>\n                  </>\n                )}\n              </div>\n              <button onClick={advance} className=\"mt-4 w-full bg-gradient-to-r from-emerald-500 to-teal-600 text-white py-2 rounded-full\">{result.score >= mission.pass ? \"Advance to Next Level ➡\" : \"Try Again ➜\"}</button>\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n","access","public","isModerationBlocked",false,"isAnonifyApiKeyDetected","dd",{"_35":36,"_37":38},"disablePrefetch","shouldPrefetchAccount",true,"shouldPrefetchUser","shouldPrefetchSystemHints","promoteCss","disableSSR","stripModulepreloadImports","statsigGateEvaluationsPromise",["P",34],"traceId","13765025593026340272","traceTime",1776503500066]
</article></body></html>