diff --git a/admin/lib/schema.js b/admin/lib/schema.js index ee0a82e..bef1f24 100644 --- a/admin/lib/schema.js +++ b/admin/lib/schema.js @@ -50,25 +50,16 @@ module.exports = [ { key: 'ctaLabel', label: 'Button-Text', type: 'text' }, { key: 'visual', - label: 'Google-Vorschau (rechts neben dem Hero-Text)', + label: 'Geräte-Ansicht (rechts neben dem Hero-Text)', type: 'group', itemFields: [ { key: 'customImage', - label: 'Eigenes Bild statt der Vorschau (leer = eingebaute Vorschau anzeigen)', + label: 'Eigenes Bild statt Laptop und Handy (leer = Geräte anzeigen)', type: 'image', }, - { key: 'label', label: 'Beschriftung oben', type: 'text' }, - { key: 'todayTag', label: 'Karte 1 – Tag-Label', type: 'text' }, - { key: 'todayUrl', label: 'Karte 1 – URL-Zeile', type: 'text' }, - { key: 'todayTitle', label: 'Karte 1 – Titel', type: 'text' }, - { key: 'todayDesc', label: 'Karte 1 – Beschreibung', type: 'textarea' }, - { key: 'dividerText', label: 'Trenntext zwischen den Karten', type: 'text' }, - { key: 'possibleTag', label: 'Karte 2 – Tag-Label', type: 'text' }, - { key: 'possibleUrl', label: 'Karte 2 – URL-Zeile', type: 'text' }, - { key: 'possibleTitle', label: 'Karte 2 – Titel', type: 'text' }, - { key: 'possibleDesc', label: 'Karte 2 – Beschreibung', type: 'richtext' }, - { key: 'possibleMeta', label: 'Karte 2 – Bewertungszeile', type: 'text' }, + { key: 'laptop', label: 'Bild im Laptop (Querformat 16:9)', type: 'image' }, + { key: 'phone', label: 'Bild im Handy (Hochformat)', type: 'image' }, ], }, ], @@ -179,6 +170,8 @@ module.exports = [ itemLabel: 'Arbeit', itemFields: [ { key: 'image', label: 'Bildschirmfoto', type: 'image' }, + { key: 'mobileImage', label: 'Handy-Ansicht (Hochformat, leer = kein Handy)', type: 'image' }, + { key: 'video', label: 'Video im Laptop (Pfad zu einer .mp4, leer = Standbild)', type: 'text' }, { key: 'kategorie', label: 'Kategorie', type: 'text' }, { key: 'titel', label: 'Titel / Name', type: 'text' }, { key: 'text', label: 'Text', type: 'textarea' }, diff --git a/content/site.json b/content/site.json index 6b0ccce..faa621c 100644 --- a/content/site.json +++ b/content/site.json @@ -1,6 +1,6 @@ { "meta": { - "description": "Larpaso entwickelt individuelle Websites für Kunden – mit KI-gestützter Entwicklung als Schwerpunkt." + "description": "Larpaso entwickelt individuelle Websites für Betriebe und Unternehmen: sorgfältig gestaltet, technisch solide, zu planbaren Kosten." }, "nav": { "logo": "/logo.svg", @@ -34,26 +34,17 @@ "titleBefore": "Websites, die zu Ihrem ", "titleEmphasis": "Unternehmen", "titleAfter": " passen.", - "lead": "Gebaut mit KI-gestützter Entwicklung. larpaso entwickelt individuelle Websites für Kunden aus unterschiedlichen Branchen. Durch den gezielten Einsatz von KI in der Entwicklung liefern wir hochwertige Ergebnisse in kürzerer Zeit, ohne Kompromisse bei Qualität und Individualität.", + "lead": "Durchdacht gestaltet, sauber umgesetzt. larpaso entwickelt individuelle Websites für Kunden aus unterschiedlichen Branchen. Mit einem klaren Ablauf und kurzen Wegen liefern wir hochwertige Ergebnisse in überschaubarer Zeit, ohne Kompromisse bei Qualität und Individualität.", "ctaLabel": "Projekt anfragen", "visual": { "customImage": "", - "label": "Beispiel: Ihr Betrieb bei Google", - "todayTag": "Heute", - "todayUrl": "ihr-betrieb.de › home", - "todayTitle": "Ihr Betrieb – Startseite", - "todayDesc": "Herzlich willkommen auf unserer Homepage. Wir freuen uns über Ihren Besuch …", - "dividerText": "Dieselbe Firma, andere Zeile", - "possibleTag": "Möglich", - "possibleUrl": "ihr-betrieb.de", - "possibleTitle": "Ihr Betrieb in [Ort] – Termine, Preise, Anfahrt", - "possibleDesc": "Geöffnet Mo–Fr 9–18 Uhr. Termin in zwei Klicks, Preise stehen auf der Seite, Anfahrt und Parkplätze erklärt.", - "possibleMeta": "★★★★★ [Zahl] Bewertungen · Jetzt geöffnet" + "laptop": "/mappe/atelier-rosenhain.webp", + "phone": "/mappe/maison-verte-mobil.webp" } }, "warum": { "eyebrow": "02 · Was uns unterscheidet", - "title": "Individuell, KI-gestützt, technisch solide.", + "title": "Individuell, sorgfältig, technisch solide.", "lead": "larpaso entwickelt individuelle Websites für Kunden, die sich von der Stange nicht zufriedengeben wollen.", "readability": { "customImage": "", @@ -126,8 +117,8 @@ }, { "num": "II", - "title": "KI-gestützte Entwicklung", - "text": "Wir setzen moderne KI-Werkzeuge im Entwicklungsprozess ein, um schneller, gründlicher und zu planbaren Kosten zu liefern." + "title": "Klarer Ablauf, planbare Kosten", + "text": "Feste Schritte, ein verbindlicher Preis und feste Ansprechpartner von Anfang bis Ende. Sie wissen jederzeit, woran Sie sind." }, { "num": "III", @@ -138,7 +129,7 @@ "leistungen": { "eyebrow": "03 · Was Sie bekommen", "title": "Was wir für Sie tun können", - "lead": "Von der ersten Idee bis zur laufenden Betreuung: larpaso begleitet Ihr Website-Projekt mit individueller Entwicklung und dem gezielten Einsatz von KI-Werkzeugen.", + "lead": "Von der ersten Idee bis zur laufenden Betreuung: larpaso begleitet Ihr Website-Projekt aus einer Hand, mit individueller Gestaltung und sauberer Technik.", "items": [ { "num": "01", @@ -147,8 +138,8 @@ }, { "num": "02", - "title": "KI-gestützte Entwicklung", - "text": "Wir nutzen moderne KI-Werkzeuge gezielt im Entwicklungsprozess, um Umsetzungszeiten zu verkürzen und gleichzeitig Code-Qualität und Sorgfalt hochzuhalten." + "title": "Gestaltung & Texte", + "text": "Farben, Schrift und Bildsprache passend zu Ihrem Betrieb, dazu Texte, die Ihre Kunden verstehen. Alles aus einer Hand, abgestimmt auf Ihre Zielgruppe." }, { "num": "03", @@ -187,21 +178,27 @@ "titel": "Maison Verte", "text": "Sand und Salbei. Der Stundenplan steht als Tabelle auf der Seite, nicht als Download, und die Preise auch. Für ein Studio, das ruhig wirken soll, ohne dabei alt auszusehen.", "nameHidden": false, - "image": "/mappe/maison-verte.webp" + "image": "/mappe/maison-verte.webp", + "mobileImage": "/mappe/maison-verte-mobil.webp", + "video": "/mappe/maison-verte.mp4" }, { "kategorie": "Konzeptarbeit · Tanzschule", "titel": "Tanzhaus Kranich", "text": "Dieselbe Seite zweimal, einmal kühl und einmal warm. Wir wollten wissen, was Farbe wirklich anrichtet. Der Unterschied war größer, als wir dachten. Seitdem schlagen wir Ihnen am Ende eine Fassung vor und nicht drei.", "nameHidden": false, - "image": "/mappe/tanzhaus-kranich.webp" + "image": "/mappe/tanzhaus-kranich.webp", + "mobileImage": "/mappe/tanzhaus-kranich-mobil.webp", + "video": "/mappe/tanzhaus-kranich.mp4" }, { "kategorie": "Konzeptarbeit · Kosmetikstudio", "titel": "Atelier Rosenhain", "text": "Weich, warm, und trotzdem kein Pastellrosa. Jede Behandlung mit Dauer und Preis, Termin direkt aus der Liste heraus. Damit niemand erst anrufen muss, um zu erfahren, was etwas kostet.", "nameHidden": false, - "image": "/mappe/atelier-rosenhain.webp" + "image": "/mappe/atelier-rosenhain.webp", + "mobileImage": "/mappe/atelier-rosenhain-mobil.webp", + "video": "" } ] }, @@ -224,7 +221,7 @@ { "num": "03", "title": "Entwicklung", - "text": "Umsetzung mit modernen Werkzeugen — inklusive KI-gestützter Entwicklung für mehr Tempo.", + "text": "Umsetzung mit modernen Werkzeugen, sauber programmiert und auf allen Geräten getestet.", "dauer": "2–3 Tage" }, { @@ -238,7 +235,7 @@ "about": { "eyebrow": "06 · Über uns", "title": "Wir sind larpaso.", - "quote": "KI als Werkzeug, nicht als Ausrede.", + "quote": "Zuhören, mitdenken, sorgfältig arbeiten.", "paragraphs": [ "Technik ändert sich schnell. Und mit ihr, was Kundinnen und Kunden von einem Betrieb erwarten: eine Seite, die auf dem Handy funktioniert, klar sagt, worum es geht, und nicht nach gestern aussieht. Was heute auffällt, ist in zwei Jahren Standard. Wir bauen Websites für Menschen, die da mithalten wollen, ohne sich selbst in Technik einarbeiten zu müssen.", "Dabei helfen uns KI-Werkzeuge. Sie nehmen uns Routine ab, damit wir Zeit haben für das, worauf es ankommt: zuhören, mitdenken, sorgfältig arbeiten. So bleiben individuelle Lösungen in überschaubarer Zeit und zu planbaren Kosten möglich, weder Massenware noch Luxusgut." diff --git a/public/mappe/atelier-rosenhain-mobil.webp b/public/mappe/atelier-rosenhain-mobil.webp new file mode 100644 index 0000000..3824c02 Binary files /dev/null and b/public/mappe/atelier-rosenhain-mobil.webp differ diff --git a/public/mappe/maison-verte-mobil.webp b/public/mappe/maison-verte-mobil.webp new file mode 100644 index 0000000..60b44cd Binary files /dev/null and b/public/mappe/maison-verte-mobil.webp differ diff --git a/public/mappe/maison-verte.mp4 b/public/mappe/maison-verte.mp4 new file mode 100644 index 0000000..949db37 Binary files /dev/null and b/public/mappe/maison-verte.mp4 differ diff --git a/public/mappe/tanzhaus-kranich-mobil.webp b/public/mappe/tanzhaus-kranich-mobil.webp new file mode 100644 index 0000000..24f7473 Binary files /dev/null and b/public/mappe/tanzhaus-kranich-mobil.webp differ diff --git a/public/mappe/tanzhaus-kranich.mp4 b/public/mappe/tanzhaus-kranich.mp4 new file mode 100644 index 0000000..3161d16 Binary files /dev/null and b/public/mappe/tanzhaus-kranich.mp4 differ diff --git a/src/components/Devices.astro b/src/components/Devices.astro new file mode 100644 index 0000000..51bb0eb --- /dev/null +++ b/src/components/Devices.astro @@ -0,0 +1,140 @@ +--- +/** + * Laptop mit optional angelehntem Handy, für Mappe und Hero. + * Ein Video im Laptop spielt nur, solange es sichtbar ist (Skript unten), + * und bei "Bewegung reduzieren" gar nicht - dann bleibt das Standbild. + */ +interface Props { + screen: string; + video?: string; + phone?: string; + alt?: string; + eager?: boolean; +} + +const { screen, video, phone, alt = '', eager = false } = Astro.props; +const loading = eager ? 'eager' : 'lazy'; +--- + +
+
+
+
+ {video ? ( + + ) : ( + {alt} + )} +
+
+
+
+ {phone && ( + + )} +
+ + + + diff --git a/src/components/Footer.astro b/src/components/Footer.astro index 194cf29..fdd7eec 100644 --- a/src/components/Footer.astro +++ b/src/components/Footer.astro @@ -8,7 +8,7 @@ const footer = site.footer;