Web · Deep Dive 03
Frontend Development
Lebendige Interfaces — React, TypeScript, Design-System- geführt — die schnell, zugänglich und wartbar bleiben, wenn sie wachsen.
Der Rahmen
Frontend-only Builds oder Frontend-geführte Projekte, in denen die UI das Ding ist. Wir bringen eine Tendenz zu Accessibility (WCAG 2.2 AA als Baseline), Performance- Budgets und Design Systems, die über die nächsten zehn Features skalieren.
Kommt dir das bekannt vor?
-
Die UI ist ein Flickenteppich aus vier Redesign-Generationen.
-
Accessibility ist 'auf der Roadmap', bewegt sich aber seit einem Jahr nicht.
-
Page Speed ist in Lighthouse gut und auf echten Geräten schlecht.
-
Jedes neue Feature dupliziert Komponenten, weil niemand den bestehenden traut.
-
Designer:innen und Engineer:innen streiten über Pixel, die nicht zählen sollten.
Der Kundennutzen
Was du davon hast
Sobald es läuft.
Ein Design System mit den Komponenten, die euer Produkt wirklich nutzt — nicht mehr.
-
Core Web Vitals grün auf echten Geräten und Netzen, nicht nur im Labortest.
-
WCAG 2.2 AA in die Komponenten eingebaut, in CI getestet.
-
Frontend-Code, den neue Kolleg:innen am zweiten Tag lesen.
Phasen
⏱ 4–12 Wochen typischWie Frontend Development tatsächlich abläuft.
-
01
Audit
Inventar vorhandener Komponenten + Patterns. Scoring nach Wiederverwendung, Konsistenz, Accessibility und Performance.
-
02
Foundation
Tokens (Farbe, Spacing, Typografie), Core-Primitives, Layout-Primitives. Die 20% der Komponenten, die 80% der Arbeit leisten.
-
03
Features
Feature-Flächen gegen die neue Foundation gebaut oder neu gebaut. Tests + Storybook-Stories parallel.
-
04
Guardrails
Lint-Regeln, CI-Accessibility-Checks, Performance- Budgets, die Builds tatsächlich failen lassen. Die Wächter bleiben nach uns.
Die Übergabe
Du bekommst
Was in du erhältst – jedes Artefakt, nichts bleibt verborgen.
-
Design System (Tokens, Komponenten, Patterns) im Code
-
Komponenten-Docs (Storybook) mit Nutzungs- und Accessibility-Hinweisen
-
Automatisierte a11y- und Performance-Checks in CI
-
Migrationsplan von Legacy-Komponenten, falls vorhanden
-
Linting / Formatting / Konventionen dokumentiert
-
Vier-Wochen-Gewährleistungsfenster nach Handover
Häufige Fragen
-
Q·01 Nutzt ihr Libraries wie MUI oder Chakra?
Kommt auf Scope und Marken-Distinktion an. Bei gebrandeten Produkten bauen wir auf Radix / shadcn-Primitives — neutral, zugänglich, von euch stylbar. MUI, wenn Time-to- Market die visuelle Identität überstimmt.
-
Q·02 Nur React?
Default ja. Vue, Svelte, Vanilla auf Wunsch — wir sind nicht dogmatisch. Aber die meisten Kund:innen kommen mit React, also ist React der Default.
-
Q·03 Könnt ihr mit unserem Design-Team arbeiten?
Ja — wir bevorzugen es. Wir setzen Figma-Tokens auf, die mit den Code-Tokens syncen, damit keine Seite driftet.
-
Q·04 CSS-Ansatz?
Tailwind für Speed und Konsistenz, CSS Modules oder Styled für eng gekoppelte Komponenten, CSS-in-JS, wenn es sich lohnt. Meinungen sind pro Engagement, nicht Religion.
-
Q·05 Rewritet ihr alles?
Selten — meist Foundation schnitzen, Schlüssel-Flächen migrieren, Migrations-Guide für den Rest. Rewrites killen Momentum; Ersetzen killt Produkte.
Bereit zum Starten
Shipp eine UI, die scharf bleibt.
Zweitägiges Audit, ehrliche Einschätzung, klarer Plan für den Rest. Schauen wir, was dein Frontend wirklich braucht.
Frontend-Engagement startenDie größere Karte
Alle Serviceseiten auf einen Blick.
Jeder der folgenden Links führt dich zu einer separaten Seite mit Informationen zu einem unserer vier Servicebereiche. Wechsele einfach den Bereich – anderer Service, gleiche Arbeitsweise.
Strategie für digitale Produkte
Serviceübersicht →Web- und Mobile-Entwicklung
Serviceübersicht →- 01 Fullstack Web Development
- 02 Backend Development
- 03 Frontend Development — Du bist hier
- 04 Mobile App Development