Agraya

Webkonzept und WordPress-Website mit flexibler Architektur

Cover-Bild der Agraya Case Study mit Collage aus Website-Screens, Farbpalette, Typografie und UI-Komponenten – zeigt das vollständige Webdesign- und Branding-Projekt auf einen Blick.

WordPress-Website für eine Agrar-Dachmarke

Die frisch gegründete Dachmarke Agraya vereint internationale Nachhaltigkeitsstandards im Agrarsektor unter einem Dach. Während die Marke noch in ihrer Findungsphase steckte, rückte ein wichtiges Launch-Event näher und mit ihm der Druck, digital sichtbar zu sein.

Wir mussten Inhalte strukturieren, die noch gar nicht existierten. Das Corporate Design lieferte unsere Partneragentur Das Kreative Studio. Von uns kamen Webkonzept, Wireframes, Webdesign/UI, WordPress Development und Beratung. Pünktlich zum Event stand eine modulare Website, die mit der Marke wächst, ohne ihr im Weg zu stehen.

 

Client

Agraya GmbH

Branche

LandwirtschaftUmwelt & Naturschutz

Time Frame

1,4 Jahre · 01.06.2025 – heute

Team

Jacques Gollnick, Jannis Riethmüller, Christopher Carus, Julian Hoff, Lorenz Garbe, Anna Clark

Tools

Miro, Figma, Wordpress

Die Highlights

4

Wochen für die Design- und Development-Umsetzung bis zum Event-Launch

3

Parteien (Agraya, Das Kreative Studio und jut-so) in einem Projekt koordiniert

1

interaktives Miro-Board als zentraler Kompass für Marke und Website

Eine Website planen, bevor die Inhalte existieren

Eine Marke aufbauen und sie gleichzeitig im Netz präsentieren, das ist, als würde man ein Haus einrichten, während es im Rohbau ist. Und dennoch stand Agraya an genau diesem Punkt: Die Dachmarke wollte sich als moderne Klammer um etablierte Agrar-Zertifikate positionieren, und das pünktlich zu einem Industrie-Event. Kernbotschaften, Tonalität, Inhalte – vieles war noch in Bewegung, als wir das technische Fundament schon gießen mussten.

Hero-Bereich der Agraya-Homepage mit großformatigem, abstraktem 3D-Hintergrundbild in Dunkelblau, dem Agraya-Logo in der Navigation sowie dem Headline-Claim „Empowering farmers. Enabling system change." und einem About-us-CTA-Button.

Agraya Homepage: kraftvoller Hero.

Responsive Webdesign der Agraya-Website im Desktop- und Mobile-Vergleich: Hero-Bereich mit Purpose-Mission-Vision-Sektion, mobiler Navigation und blauem Markenfarbschema auf verschiedenen Bildschirmgrößen.

Agraya Website: responsives Design für Desktop und Mobile.

Wireframes in Miro als Content-Werkzeug

Wir machten die Wireframes und die UX-Konzeption zum Werkzeug für die Inhalte, nicht nur für uns, sondern vor allem für Agraya. Statt auf fertige Texte zu warten, entwickelten wir das Webkonzept direkt in Miro. Dort konnte der Kunde die eigene Struktur und Sprache erstmals greifbar sortieren. Gemeinsam klärten wir zentrale Fragen: Wie viele Mission Statements verträgt eine Seite? Wie viele Meilensteine lesen Besucher:innen tatsächlich?

Im Webdesign/UI übersetzten wir anschließend das neue Corporate Design von Das Kreative Studio ins Digitale. Für das WordPress Development wählten wir ein Custom-Setup mit flexibler Modulstruktur: Jede Seite besteht aus einzelnen Bausteinen, die sich frei kombinieren lassen, sobald sich Inhalte ändern. Für das Event im September schnürten wir zuerst eine kompakte Basisversion, schlank genug für eine pünktliche Umsetzung in nur vier Wochen, stark genug für einen überzeugenden Auftritt.

Ein erster Eindruck der Agraya Website: Hero-Animationen auf Startseite und About-Seite, Meilensteine und Newsletteranmeldung

Designsystem-Farbpalette für Agraya mit Primary- und Secondary-Farben in Blau, Dunkelblau, Cyan sowie neutralen Tönen – definiert als Primitives/Brand-Tokens mit Hex- und RGBA-Werten.
Übersicht der UI-Styles und Komponenten für Agraya: Primary- und Secondary-Buttons in verschiedenen Zuständen (Default, Hover, Inactive), Filter-Tags, Pagination, Navigation und barrierefreie Formularfelder mit Focus-Indicator.
Typografie-System der Agraya-Website mit H1-, H2- und H3-Schriftgrößen für Desktop, Paragraph-Kombinationen sowie Blend-Mode-Effekten – demonstriert die konsistente Schrifthierarchie im Webdesign.
Zwei Screens der Agraya About-Seite: links eine interaktive Key-Milestones-Timeline mit Jahreszahlen und Bildern, rechts der Hero mit dem Claim „Rooted in trust. Shaping tomorrow's farming together." und der Teamsektion „Meet the Agrayans".
Events-und-News-Seite der Agraya-Website mit Hero-Bild eines Getreidefelds, Eventliste mit Messen wie IPM Essen und Fruit Logistica, Cyan-farbigem Summit-2026-Teaser-Banner sowie News-Kacheln – alles in konsequentem Marken-Design.

Eine Dachmarke, die online mitwachsen kann

Pünktlich zum offiziellen Launch-Event im September 2025 ging die Plattform live. Seitdem zeigt sich Agraya konsistent im eigenen Corporate Design als digitaler Vorreiter im Agrarsektor. Die Auftraggeber:innen lobten den reibungslosen Ablauf sowie die moderne Optik und gaben direkt grünes Licht für den weiteren Ausbau.

Weil die Basisversion von Anfang an als stabiles Fundament gebaut war, docken neue Seiten und Sub-Brands heute ohne Redesign an die vorhandenen Module an. Für das Team von Agraya heißt das im Alltag: Neue Inhalte brauchen keine neue Website, sondern lediglich neue Kombinationen vorhandener Bausteine.

überraschung! es gibt noch mehr.

Und du dachtest schon, das war’s, oder?

Auf der Suche nach deiner neuen
Lieblings­agentur?

Besprich dein nächstes Projekt mit Lorenz

Lorenz spricht fließend Deutsch, Englisch, Spanisch und Walgesang.