Antworten von Dylan Brouwer, Digitaldesigner und Entwickler.
Hintergrund: Hildén & Kaira ist eine in Helsinki ansässige Social-Content-Agentur, die für authentische, leistungsorientierte Inhalte bekannt ist. Die vorherige Website hatte eine starke kreative Anziehungskraft und erhielt sogar die Auszeichnung „Site of the Day“ auf Awwwards, aber die Marke war über ihre eigene Wahrnehmung hinausgewachsen. Während die Arbeit der Agentur bei Marketingmanagern und C-Level-Entscheidungsträgern zunehmend Anklang fand, fand die visuelle Identität bei einem kreativen Publikum immer noch stärkeren Anklang. Das Ziel bestand nicht nur darin, die Marke professioneller zu machen, sondern sie auch überzeugender und reifer zu machen, ohne dabei den menschlichen und authentischen Charakter zu verlieren, der die Arbeit von Hildén & Kaira ausmacht.
Designkern: Die visuelle Identität wurde von Jasper Wichers Schreur von Studio Debuut entwickelt. Die Identität kombiniert ein organisches Logo, einen redaktionellen typografischen Stil und ein unverwechselbares Material- und Farbsystem. Das Handgeschriebene H Und k verschmelzen zu einem abstrakten kaufmännischen Und und bringen Menschlichkeit und Charakter in die Marke ein. Die Typografie verleiht Vertrauen und Autorität und hilft der Marke, effektiver mit einem älteren Publikum zu kommunizieren, ohne distanziert oder korporativ zu wirken.
Eines der markantesten Elemente ist die Kombination aus Chrom und Gelb. Chrom steht für Belastbarkeit und Leistung unter Druck, während Gelb für Energie und menschliche Verbundenheit steht. Zusammen erzeugen sie eine bewusste Spannung, die die Kluft zwischen Autorität und Authentizität überbrückt.
Das herausragende Feature der Website ist ein Fallstudien-Slider, der Live-Daten zur Kundenleistung abruft: organische Aufrufe, Likes und die drei leistungsstärksten Videos für jeden Kunden, täglich aktualisiert. Es wurde durch eine No-Code-Automatisierung von Stefan von Quikcode mit Airtable und Make entwickelt und verwandelt ein statisches Portfolio in einen lebendigen Leistungsbeweis. Der Beweis ist nicht nur Teil der Botschaft, sondern Teil der Erfahrung.
Herausforderungen: Die zentrale Herausforderung bestand darin, die Spannungen im Herzen der Marke zu erkennen und zu lösen. Der Erfolg von Hildén & Kaira basiert auf Authentizität: echte Menschen, echte Geschichten und Inhalte, die sich echt und nicht künstlich anfühlen. Gleichzeitig bedient die Agentur zunehmend Zielgruppen, die Glaubwürdigkeit, Fachwissen und nachgewiesene Ergebnisse suchen. Die Herausforderung bestand nicht darin, zwischen Authentizität und Autorität zu wählen, sondern sie zusammenzubringen.
Jede Designentscheidung wurde unter Berücksichtigung dieser Ausgewogenheit getroffen. Auch Bewegung spielte eine Schlüsselrolle. Die vorherige Website verfügte über starke Animationen, aber die Interaktionen wirkten dem Erlebnis entgegen, anstatt es zu unterstützen. Dieses Mal wurden die Bewegungen bewusst und zurückhaltend gehalten, um den Inhalt zu verbessern, ohne mit ihm zu konkurrieren.
Navigationsstruktur: Wir haben die Navigation minimal und direkt gehalten, um den Gesamtton der Marke widerzuspiegeln. Die Priorität bestand darin, die Besucher so schnell wie möglich zum Werk und zu den Ergebnissen zu bringen. Für eine leistungsorientierte Agentur mussten die Fallstudien im Mittelpunkt stehen und durch klare Kontaktmöglichkeiten unterstützt werden. Keine unnötigen Ebenen, nur eine klare und sichere Struktur, die den Inhalt für sich sprechen lässt.
Technologie: Die Website wurde in Figma entworfen und in Webflow erstellt. Animationen und Interaktionen wurden mit GSAP und ScrollTrigger verwaltet, wobei benutzerdefinierter Code über Slater verwaltet wurde. Zusätzliche Interaktionsressourcen wurden von Osmo Supply genutzt. Die Integration der Live-Leistungsdaten wurde mit Airtable und Make erstellt, mit den sozialen Plattformen des Kunden verbunden und der Inhalt der Fallstudie wurde täglich automatisch aktualisiert. Dieses Setup ermöglicht es Hildén & Kaira, ihr Portfolio ohne manuelle Aktualisierungen auf dem neuesten Stand zu halten.
Durchsuchen Sie Projekte
Klicken Sie auf ein Bild, um mehr von jedem Projekt zu sehen
Credit Post By: