
{"id":199952,"date":"2025-11-11T14:17:11","date_gmt":"2025-11-11T13:17:11","guid":{"rendered":"https:\/\/scen.ar\/io\/?page_id=199952"},"modified":"2025-11-11T14:17:12","modified_gmt":"2025-11-11T13:17:12","slug":"erstellen","status":"publish","type":"page","link":"https:\/\/scen.ar\/io\/erstellen\/","title":{"rendered":"Erstellen"},"content":{"rendered":"<!-- scenario.app \u2013 Erstellen & Storyboard (Full-bleed dark hero, minimal HTML) -->\n<section class=\"sb-hero-bleed\" style=\"--hero-img:url('https:\/\/scen.ar\/wp-content\/uploads\/2025\/11\/storyboard_routen.png');\">\n  <div class=\"sb-wrap\">\n    <!-- LEFT: Copy + CTAs -->\n    <div class=\"col-left\">\n      <h1>Erstellen mit dem <span class=\"brand\">Storyboard<\/span><\/h1>\n      <p class=\"tag\">Baue interaktive Outdoor- &#038; City-Routen mit Szenen, Aufgaben und Medien \u2013 ohne Code.<\/p>\n      <div class=\"cta-row\">\n        <a class=\"btn-prim\" href=\"https:\/\/storyboard.scenario.app\/\" target=\"_blank\">Storyboard \u00f6ffnen<\/a>\n        <a class=\"btn-ghost\" href=\"https:\/\/docs.scenario.app\/books\/storyboard\"  target=\"_blank\">Erste Schritte<\/a>\n      <\/div>\n      <p class=\"fineprint\">Account erforderlich \u2022 Ergebnisse sind in der App spielbar<\/p>\n    <\/div>\n\n    <!-- RIGHT: Slogan over Image -->\n    <div class=\"col-right\">\n      <div class=\"hero-card\" aria-hidden=\"true\">\n       \n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- Feature Highlights (ehrlich & knapp) -->\n<section class=\"sb-features\">\n  <div class=\"sb-inner\">\n    <div class=\"feat-grid\">\n      <div class=\"feat\">\n        <div class=\"icon\"><i class=\"fa-solid fa-diagram-project\"><\/i><\/div>\n        <h3>Szenen &#038; Verzweigungen<\/h3>\n        <p>Verbinde Orte und Texte zu einer klaren, spielbaren Route.<\/p>\n      <\/div>\n      <div class=\"feat\">\n        <div class=\"icon\"><i class=\"fa-solid fa-qrcode\"><\/i><\/div>\n        <h3>Aufgaben &#038; Scans<\/h3>\n        <p>Fragen, QR-Codes und kleine Aufgaben direkt an Stationen.<\/p>\n      <\/div>\n      <div class=\"feat\">\n        <div class=\"icon\"><i class=\"fa-solid fa-location-dot\"><\/i><\/div>\n        <h3>Ortsbezug<\/h3>\n        <p>Spots definieren und unterwegs Schritt f\u00fcr Schritt anleiten.<\/p>\n      <\/div>\n      <div class=\"feat\">\n        <div class=\"icon\"><i class=\"fa-solid fa-image\"><\/i><\/div>\n        <h3>Medien einbinden<\/h3>\n        <p>Bilder, Audio, kurze Hinweise \u2013 punktgenau eingesetzt.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- Quickstart -->\n<section class=\"sb-quickstart\">\n  <div class=\"sb-inner\">\n    <h2>So startest du<\/h2>\n    <ol class=\"steps\">\n      <li><span>1<\/span> Anmelden und neues Projekt anlegen<\/li>\n      <li><span>2<\/span> Orte &#038; Szenen hinzuf\u00fcgen, Aufgaben definieren<\/li>\n      <li><span>3<\/span> Route speichern und Testslot in der App buchen<\/li>\n      <li><span>4<\/span> Drau\u00dfen testen und ver\u00f6ffentlichen<\/li>\n    <\/ol>\n  <\/div>\n<\/section>\n\n\n\n<style>\n:root{ --scn-primary:#41b1cd; --scn-dark:#2b2b2b; --scn-muted:#f7f7f7; --border:#e5e7eb; }\n\n\/* HERO (full-bleed) *\/\n.sb-hero-bleed{ background:#2b2b2b; color:#fff; position:relative; width:100vw; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; }\n.sb-wrap{ width:min(1200px,94vw); margin:0 auto; display:grid; grid-template-columns:1fr; gap:1.5rem; align-items:center; padding: clamp(2.5rem,6vw,6rem) 0; }\n@media (min-width:980px){ .sb-wrap{ grid-template-columns: 1.05fr .95fr; gap:2.25rem; } }\n.col-left h1{ font-size: clamp(2rem,5vw,3.1rem); line-height:1.06; margin:0 0 .5rem; }\n.brand{ color: var(--scn-primary); }\n.tag{ max-width: 52ch; opacity:.9; margin-bottom: 1rem; }\n.cta-row{ display:flex; flex-wrap:wrap; gap:.6rem; }\n.btn-prim{ background: var(--scn-primary); color:#fff; border:0; border-radius:12px; padding:.85rem 1.2rem; font-weight:800; text-decoration:none; box-shadow:0 10px 28px rgba(65,177,205,.35); }\n.btn-ghost{ background: transparent; color:#fff; border:1px solid rgba(255,255,255,.35); border-radius:12px; padding:.85rem 1.2rem; font-weight:800; text-decoration:none; }\n.fineprint{ font-size:.92rem; opacity:.8; margin-top:.75rem; }\n\n.col-right .hero-card{ position:relative; width:100%; min-height: clamp(280px, 42vw, 520px); overflow:hidden;  }\n.col-right .hero-card::before{ content:\"\"; position:absolute; inset:0; background-image: var(--hero-img); background-size:contain; background-position:center; }\n.col-right .hero-card::after{ content:\"\"; position:absolute; inset:0; }\n.slogan{ position:absolute; bottom: clamp(1rem, 4vw, 2rem); left: clamp(1rem, 4vw, 2rem); font-weight:900; letter-spacing:.004em; font-size: clamp(1.9rem, 5vw, 3.2rem); line-height:1.02; color:#fff; text-shadow:0 10px 34px rgba(0,0,0,.5); }\n\n\/* Features *\/\n.sb-features{ background:#fff; padding: clamp(1.75rem,4vw,3rem) 0; }\n.sb-inner{ width:min(1200px,94vw); margin:0 auto; }\n.feat-grid{ display:grid; grid-template-columns:1fr; gap:.75rem; }\n@media (min-width:860px){ .feat-grid{ grid-template-columns:repeat(4,1fr); } }\n.feat{ background:#fff; border:1px solid var(--border); border-radius:14px; padding:1rem 1.1rem; }\n.feat .icon{ font-size:1.35rem; color:var(--scn-primary); margin-bottom:.35rem; }\n.feat h3{ margin:.25rem 0 .25rem; }\n\n\/* Quickstart *\/\n.sb-quickstart{ padding: clamp(1.75rem,4vw,3rem) 0; }\n.sb-quickstart h2{ margin: 0 0 .75rem; }\n.steps{ list-style:none; padding:0; margin:0; display:grid; gap:.5rem; }\n.steps li{ background:#fff; border:1px solid var(--border); border-radius:12px; padding:.75rem .9rem; display:flex; align-items:center; gap:.6rem; }\n.steps li span{ width:28px; height:28px; border-radius:999px; display:inline-grid; place-items:center; background: var(--scn-primary); color:#fff; font-weight:800; }\n\n\/* Pricing glance *\/\n.sb-pricing-glance{ background:#fff; padding: clamp(1.5rem,4vw,2.5rem) 0; }\n.pill-row{ display:grid; grid-template-columns:1fr; gap:.75rem; }\n@media (min-width:720px){ .pill-row{ grid-template-columns:repeat(2,1fr); } }\n.pill{ background:#fff; border:1px solid var(--border); border-radius:14px; padding:1rem 1.1rem; text-align:center; }\n.kicker{ display:block; font-size:.85rem; letter-spacing:.03em; text-transform:uppercase; opacity:.8; margin-bottom:.25rem; }\n.value{ display:block; font-size:1.25rem; font-weight:800; }\n.note{ display:block; font-size:.9rem; opacity:.75; margin-top:.2rem; }\n\n\/* Full-width CTA *\/\n.sb-cta{ background: linear-gradient(180deg, var(--scn-primary), #2b2b2b); color:#fff; width:100vw; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; }\n.sb-cta .cta-inner{ width:min(1200px,94vw); margin:0 auto; text-align:center; padding: clamp(2rem,6vw,4rem) 1rem; }\n.sb-cta .cta-row{ justify-content:center; margin-top:.35rem; display:flex; gap:.6rem; flex-wrap:wrap; }\n\n.scn-pagehead  { display:none !important; }\n.scn-breadcrumb { display:none !important; }\n.my-5 {margin-top: 0px !important;\n<\/style>\n","protected":false},"excerpt":{"rendered":"<p>Erstellen mit dem Storyboard Baue interaktive Outdoor- &#038; City-Routen mit Szenen, Aufgaben und Medien \u2013 ohne Code. Storyboard \u00f6ffnen Erste Schritte Account erforderlich \u2022 Ergebnisse sind in der App spielbar Szenen &#038; Verzweigungen Verbinde Orte und Texte zu einer klaren, spielbaren Route. Aufgaben &#038; Scans Fragen, QR-Codes und kleine Aufgaben direkt an Stationen. Ortsbezug Spots [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-199952","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/pages\/199952","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/comments?post=199952"}],"version-history":[{"count":9,"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/pages\/199952\/revisions"}],"predecessor-version":[{"id":199962,"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/pages\/199952\/revisions\/199962"}],"wp:attachment":[{"href":"https:\/\/scen.ar\/io\/wp-json\/wp\/v2\/media?parent=199952"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}