Storytelling-Website für Tempras
Technologie erzählt – eine Marke in Bewegung.
Tempras ist ein Anbieter für moderne Lösungen im Personalmanagement: Zeiterfassung, Workforce-Management und smarte digitale Prozesse für Unternehmen. Die Marke steht für Innovation, Effizienz und ein klares Bekenntnis zu hochwertiger Software.
Tempras suchte eine Agentur, die es schafft, diese technischen Themen nicht nüchtern, sondern emotional, modern und visuell spannend zu präsentieren.
UX Design, UI Design, Drupal 10 Entwicklung, Scroll-Storytelling, Animationskonzept, Motion Design, Solutions-Darstellung, Responsive Webdesign
Animierte Scroll-Story auf der Startseite, Logo-Strang als roter Faden, moderne Solutions-Seiten, individuelle Motion-Elemente
Tempras wollte einen Auftritt, der zeigt, dass ihre Lösungen weit mehr sind als klassische Zeiterfassung. Die alte Website war funktional, aber ohne Emotion, ohne Spannung und ohne klare visuelle Linie.
Gesucht war ein Partner, der das Unternehmen modern, storytelling-orientiert und mit dynamischen Scroll-Animationen in Szene setzt – technisch sauber, visuell hochwertig und mit einem klaren Markengefühl.
Wir entwickelten eine Startseiten-Story, die einen charakteristischen Linie-Strang aus dem Tempras-Logo durch die gesamte Seite führt. Während der Nutzer scrollt, begleitet dieser Strang die Inhalte, bildet Übergänge, visualisiert Kapitel und führt schließlich zum vollständigen Unternehmenslogo. Dadurch entsteht ein roter Faden, der das gesamte Markenerlebnis strukturiert.
Parallel dazu gestalteten wir die Solutions-Bereiche neu: klar, modern und inhaltlich präzise, damit Besucher:innen die Produkte schneller verstehen und direkt erkennen, welchen Mehrwert Tempras bietet. Das Ergebnis ist eine Website, die technische Lösungen emotional erlebbar macht und gleichzeitig professionell wirkt.
Der Fokus lag auf Bewegung, Struktur und Markenführung.
Die Startseitenstory führt Nutzer:innen Kapitel für Kapitel durch die Tempras-Welt – visuell leicht, technologisch geprägt, aber ohne Überladung.
Klarer Weißraum, moderne Typografie und präzise Illustrationen sorgen für ein hochwertiges, technologisch anmutendes Gesamtbild.
Die Solutions wurden so gestaltet, dass komplexe Inhalte einfach vermittelt werden – mit klaren Vorteilen, verständlichen Beschreibungen und einer ruhigen, professionellen Ästhetik.
Die Website basiert auf Drupal 10 und nutzt individuelle JavaScript-Animationen sowie CSS-basierte Scroll-Interaktionen, die performant und ressourcenschonend umgesetzt wurden.
Der Logo-Strang wurde als skalierbares Vektorobjekt entwickelt und dynamisch mit der Scrollposition verknüpft.
Durch modulare Paragraphs können alle Inhaltsseiten selbst gepflegt und erweitert werden – ohne den animierten Flow der Startseite zu beeinträchtigen.
Die Solutions erhielten eigene Content-Typen mit klarer Struktur, Icons, Vorteilen und direkter Kontaktmöglichkeit.
Scroll-Animation & Storytelling
Das Highlight der Website ist die individuell entwickelte Scroll-Story auf der Startseite. Ein grafischer Strang aus dem Tempras-Logo begleitet die Nutzer:innen durch den gesamten Einstieg und führt sie Schritt für Schritt durch die wichtigsten Themen des Unternehmens. Während man scrollt, verändert sich die Linie, verbindet Inhalte miteinander, setzt Übergänge und schafft ein durchgängiges Motion-Erlebnis. Am Ende fügt sich der Strang zu einem vollständigen Logo zusammen – ein visuell starker Moment, der die Markenidentität unterstreicht und Tempras sofort wiedererkennbar macht. Die Animation ist performant umgesetzt, flüssig, klar und präzise – ein technisches und gestalterisches Statement, das die Startseite einzigartig macht.
Ihre Website könnte die nächste legendäre werden.
Lassen Sie uns sprechen – ehrlich, direkt und ohne Angst & Reue.
