Der klickbare Prototyp.
Alle Seitentypen, in drei Breiten, am Gerät bedienbar. Sie entscheiden an etwas, das sich anfühlt wie die fertige Seite, nicht an einem Bild davon.
Webdesign, das arbeitet. Nicht nur gefällt.
Eine Website muss zwei Dinge: gut aussehen und etwas bewirken, Anfragen, Bewerbungen, Vertrauen. Viele schaffen das erste. Wir gestalten auf Basis Ihrer Struktur und Ihrer Ziele: Seitentypen, Bausteine, Prototyp, als Design-System, das Ihre Redaktion danach selbst benutzt. Barrierefrei von Anfang an, nicht nachträglich aufgeklebt. Als Webdesign-Agentur mit Senior-Besetzung sagen wir Ihnen vorher, was es kostet.
Das kennen wir
So sieht es aus, wenn Design ohne System entsteht.
Das Muster ist fast immer dasselbe, und es ist kein Versagen Ihres Teams. Haken Sie an, was Sie kennen.
Das Design wurde für die Präsentation gemacht, nicht für den Besucher mit einer Frage. Große Bilder, kleine Wege zum Ziel. Gefällt im Meeting, bringt keine Anfrage.
Es gab drei Entwürfe, aber kein System. Ihre Redaktion baut seitdem nach Gefühl: andere Abstände, andere Buttons, eine vierte Grau-Variante. Nach einem Jahr erkennt man das Design nur noch auf der Startseite.
Entworfen am großen Bildschirm, abgenommen am großen Bildschirm. Zwei Drittel Ihrer Besucher sehen aber die schmale Version, und die war nie ein Entwurf, sondern ein Nebenprodukt.
Was gestaltet war, ließ sich so nicht bauen. Was gebaut wurde, sah anders aus. Jede Abweichung kostete eine Abstimmungsrunde, und am Ende wusste niemand mehr, welche Version die richtige ist.
0 von 4
Noch nichts angehakt. Trifft nichts davon zu, ist bei Ihnen mehr in Ordnung als bei den meisten — dann sagen wir Ihnen das auch.
Ein Punkt ist meistens schnell geklärt, kein Projekt. Was davon nötig ist, klären wir im Erstgespräch.
Mehrere Punkte. Ab hier lohnt das Rechnen — und genau dafür ist das Erstgespräch da.
Alles angehakt. Das ist kein Zustand, den man aussitzt: Die Kosten laufen weiter, nur unsichtbar.
Was wir tun
Vier Dinge, die unser Webdesign von einem Entwurf unterscheiden.
Erst der Weg, dann das Bild
Wir gestalten vom Ziel her: Was soll jemand auf dieser Seite tun, und was braucht er dafür? Daraus entstehen Seitentypen, nicht Einzelseiten, und eine Gestaltung, die zu Ihrer Marke passt, statt zum Trend des Jahres.
Regeln, die Ihre Redaktion einhält, ohne sie zu kennen
Farben, Schriften, Abstände, Bausteine: alles einmal festgelegt und in die Inhaltsbausteine eingebaut. Wer eine neue Seite zusammensteckt, bekommt automatisch das richtige Design. Webdesign und Entwicklung aus einer Hand.
Auf dem Handy zuerst
Wir entwerfen die schmale Version zuerst, nicht zuletzt. Jeder Baustein hat eine Handy-, eine Tablet- und eine Desktop-Form, und alle drei werden abgenommen, nicht nur eine.
Seit 2025 Pflicht. Bei uns Bauweise
Kontraste, Schriftgrößen, Fokus, Bedienung ohne Maus: Das entscheidet sich beim Gestalten, nicht beim Testen. Wir prüfen jeden Entwurf gegen die Anforderungen, bevor er gebaut wird. Nachbessern ist teurer als richtig anfangen.
Sie müssen das hier nicht lesen — dafür haben Sie ja uns. Aber wenn Ihre Marketing- oder IT-Leitung mit am Tisch sitzt, hier die Methode:
Grundlage
- Sitemap, Seitentypen und Inhaltsbausteine aus der Konzeption
- bestehendes Corporate Design (Logo, Farben, Schrift) als Ausgangspunkt
- Zielaktionen je Seitentyp
Design-Tokens
- Farben, Schriftgrößen, Abstände, Radien und Schatten als benannte Werte
- eine Quelle für Entwurf und Code (DESIGN.md, Tailwind-Konfiguration)
- Abweichungen zwischen Entwurf und Umsetzung werden automatisch geprüft
Komponenten
- jeder Baustein im Entwurf entspricht einem TYPO3-Inhaltsbaustein (Content Blocks)
- Zustände (Hover, Fokus, Fehler, leer) sind Teil des Entwurfs
- Styleguide-Seite im System, nicht als PDF
Prototyp
- klickbar in Figma, alle Seitentypen in drei Breiten
- Test am Gerät, nicht im Simulator
- zwei Korrekturrunden inklusive
Barrierefreiheit
- Kontrast mindestens 4,5:1 (Text) und 3:1 (Bedienelemente)
- sichtbarer Fokus, Bedienung per Tastatur, Bewegung reduzierbar (prefers-reduced-motion)
- Prüfung gegen BITV 2.0 / WCAG 2.2 AA vor der Umsetzung
Performance-Budget
- Web-Fonts auf zwei Schnitte begrenzt
- Bilder in AVIF/WebP mit Größenvorgaben je Baustein
- Ladezeit-Zielwert schriftlich vereinbart
Figma-Datei, Tokens, Styleguide und Bausteine gehören Ihnen — jedes andere Team kann damit weiterarbeiten.
Das Ergebnis
Was Sie am Ende *in der Hand halten.*
Das Design-System.
Farben, Schriften, Abstände, Bausteine, als lebender Styleguide in Ihrem TYPO3. Neue Seiten sehen aus wie die alten, ohne dass jemand daran denken muss.
Die Bausteine, fertig gestaltet.
Hero, Teaser, Akkordeon, Formular, Kennzahlen: jeder Baustein in jedem Zustand. Ihre Redaktion sieht vorher, womit sie arbeiten wird.
Der Nachweis.
Prüfprotokoll zu Kontrasten, Bedienbarkeit und Lesbarkeit. Das Dokument, das Sie vorzeigen, wenn jemand nach Barrierefreiheit fragt.
Wie es abläuft
Vom Konzept zum Design-System, in vier Schritten.
Am Ende steht ein Design-System, das Ihrer Redaktion gehört — und jedem Team, das damit weiterbaut.
-
01 Halber Tag
Grundlage
Wir übernehmen Sitemap, Seitentypen und Ziele aus der Konzeption. Gibt es noch keine, klären wir das Nötigste in einem halben Tag mit Ihnen, bevor jemand gestaltet.
-
02 Zwei Richtungen
Richtung
Zwei Gestaltungsrichtungen an der Startseite und einem Seitentyp, aus Ihrem Corporate Design entwickelt. Sie entscheiden sich für eine. Danach wird nichts mehr grundsätzlich umgeworfen.
-
03 Zwei Korrekturrunden
Seitentypen und Prototyp
Wir gestalten alle Seitentypen in drei Breiten und bauen den klickbaren Prototyp. Sie testen am Handy, geben Rückmeldung, zwei Korrekturrunden sind eingeplant.
-
04 Gehört Ihnen
Design-System und Übergabe
Aus dem Entwurf werden Tokens, Styleguide und Inhaltsbausteine, die erste sichtbare Phase Ihres Relaunchs. Alles davon gehört Ihnen.
Webdesign ohne Haken.
- Festpreis vor Projektstart
- 100 % Ihr Design
- 2 Korrekturrunden inklusive
- < 3 h bis zur Antwort
Jede Stelle steht online, ohne dass sie jemand einträgt.
TYPO3-Karriereportal für das ZfP Südwürttemberg: Stellen fließen automatisch aus dem Bewerbermanagement, die Suchmaschinen-Texte entstehen gleich mit, besetzte Stellen räumen sich selbst weg.
- 4.000+ Mitarbeitende im Verbund
- 0 Stellen manuell gepflegt
- 2021 gebaut, seither betreut
Das sagen nicht wir. Das sagt eine Kundin.
Marianne Lerch
Tagespost Stiftung für katholische Publizistik
Wir haben mit der Vibe Digital GmbH das Upgrade unserer TYPO3-Website umgesetzt. Proaktive Kommunikation, eingehaltene Deadlines – vielen Dank für die vertrauensvolle Zusammenarbeit!
50+ Projekte seit 2020 · Eine Auswahl
FAQ
Häufige Fragen zum Webdesign
Was Webdesign und Relaunch kostenWebdesign ist bei uns eine Phase des Relaunchs, kein eigenes Produkt: Sie zahlen es im Projektpreis, nicht extra. Ein Relaunch mit neuer Gestaltung liegt meist zwischen 15.000 und 35.000 €, die Spannen stehen offen auf unserer Preise-Seite. Unser Stundensatz liegt bei 110 €.
Ein einzelner Webdesigner ist oft günstiger und für eine kleine Seite eine gute Wahl. Bei uns bekommen Sie Gestaltung und Umsetzung aus einem Team, ein Design-System statt einzelner Entwürfe, und jemanden, der auch in drei Jahren noch erreichbar ist, wenn die Seite wachsen soll. Die Frage ist weniger „wer ist besser“ als „was soll die Seite in drei Jahren können“.
Ja, das ist der Normalfall. Logo, Farben und Schrift bleiben; wir übersetzen sie in ein System für die Website. Ein neues Corporate Design entwickeln wir nicht, dafür empfehlen wir eine Markenagentur.
Ja. Figma-Datei, Tokens, Styleguide und Bausteine gehören Ihnen, und jedes Team kann damit weiterarbeiten. Wir gestalten nur, wo wir auch bauen, weil Entwurf und Bausteine bei uns dieselbe Quelle haben. Gebunden sind Sie daran nicht.
Vier bis sechs Wochen von der Richtungsentscheidung bis zum fertigen Design-System, bei fünf bis acht Seitentypen. Der Zeitplan hängt vor allem an Ihren Rückmeldungen.
Nicht zwingend. Das Design braucht aber eine Struktur: welche Seiten es gibt und was sie leisten sollen. Liegt das vor, fangen wir direkt an. Liegt es nicht vor, klären wir es in einem halben Tag mit Ihnen oder empfehlen die Konzeption, wenn mehr als eine Person mitentscheidet.
Das Design ist barrierefrei geplant: Kontraste, Schriftgrößen, Fokus und Bedienung ohne Maus sind geprüft, bevor gebaut wird. Ob die fertige Website die Anforderungen erfüllt, hängt auch von Umsetzung und Inhalten ab. Dafür gibt es unsere Leistung Barrierefreiheit mit dem Nachweis nach BITV 2.0.
Manchmal. Wenn Ihr TYPO3 aktuell ist und sauber gebaut, lässt sich das Design austauschen, ohne alles neu zu machen. Ob das bei Ihnen geht, zeigt der kostenlose TYPO3-Check. Oft ist der Relaunch am Ende günstiger als das Umbauen.
Texte liefern Sie, wir gestalten mit echten Inhalten, nicht mit Blindtext. Wo Bilder fehlen, erstellen wir Bildvorschläge im Stil Ihrer Marke. Ein Design, das nur mit perfekten Fotos funktioniert, ist keins.
Gestaltung, die arbeitet.
Im Erstgespräch sagen wir Ihnen, ob Ihre Struktur für das Design reicht oder ob erst eine Konzeption nötig ist, und was beides kostet. Antwort in unter 3 Stunden.
Lieber anrufen? 09075 5923957 Mo–Fr, 8–18 Uhr
Patrick Schatzschneider
Geschäftsführung & Entwicklung
Ihre Nachricht landet bei mir — nicht in einem Postfach. Wer im Erstgespräch sitzt, arbeitet später an Ihrem Projekt.
Vibe Digital GmbH · gegründet 2020 · Raum Ulm
- Sie schreiben oder rufen an Zwei Sätze reichen. Kein Formular mit zwölf Pflichtfeldern.
- Antwort in unter 3 h Von der Person, die Ihr Projekt später betreut — nicht vom Vertrieb.
- Schriftlicher Rahmen Nach dem Gespräch: Umfang, Zeitraum und Kosten schwarz auf weiß.