04.12.2025 aktualisiert

**** ******** ****
Premiumkunde
nicht verfügbar
info: nicht verfügbar bis 30.01.2026

Freelance Senior Art Director (UI/UX/Motion/Visual)

Hamburg, Deutschland
Weltweit
Ausbildung: Mediengestalter Digital & Print – Fachrichtung: Konzeption & Visualisierung
Hamburg, Deutschland
Weltweit
Ausbildung: Mediengestalter Digital & Print – Fachrichtung: Konzeption & Visualisierung

Profilanlagen

Resume-CV-Kai-Köhler.pdf
Lebenslauf-Kai-Köhler.pdf
kai-koehler-complete-services-and-software.pdf
kai-koehler-dienstleistungen-und-software.pdf

Über mich

Während der letzten 9 Jahre habe ich mir als Grafiker, Art Director und Experience Designer ein sehr vielseitiges digitales Skillset aufgebaut. Seit 6 Jahren spezialisiere ich mich auf UI/UX Design für B2B und B2C E-Commerce Lösungen, sowie auf die Erstellung von Lottie Animationen für Web und App.

Skills

HTMLComputeranimationUser Experience (UX)Barrierefreies WebdesignAdobe After EffectsAdobe IllustratorAdobe PhotoshopAdobe Premiere ProWerbungKünstliche IntelligenzConfluenceJiraBusiness To BusinessBusiness-To-ConsumerOnlinewerbungCSSCorporate DesignE-CommerceGrafikGrafikdesignUi-DesignMotion Graphics DesignSoziale MedienVideoverarbeitungWireframesWordpressAdobe XDFigmaGPT
Diese Schwerpunkte zeichnen mein Leistungsportfolio aus:
  1. UX- & UI-Design (User Journeys, Wireframes, Prototypen, Design Systeme)
  2. Responsives & barrierefreies Webdesign nach WCAG Richtlinien
  3. Motion Design & Videobearbeitung (z.B. Lottie und GIF Animationen)
  4. Visual Design (Social Media Grafiken, Responsive Werbeanzeigen, Newsletter, etc.)
Häufig verwendete Programme:
  1. Figma, Adobe Xd & Sketch
  2. Adobe Illustrator
  3. Adobe Photoshop
  4. Chat GPT, Mistral, Claude & weitere AI Tools
  5. Adobe After Effects, Adobe Premiere & DaVinci Resolve
  6. Jira & Confluence
  7. Miro
  8. Ofiice 365
Namenhafte Kunden mit denen ich zusammengearbeitet habe:
  1. Bauhaus
  2. BMW
  3. Ernsting’s family
  4. HABA Familygroup (HABA Pro, HABA Play, JAKO-O)
  5. Landgard
  6. Peek & Cloppenburg
  7. Volkswagen Zubehör
Website

Sprachen

DeutschMutterspracheEnglischMuttersprache

Projekthistorie

Experience Designer für BMW und MINI

BMW

Automobil und Fahrzeugbau

>10.000 Mitarbeiter

Sowohl während meiner Festanstellung als Experience Designer bei THE MARCOM ENGINE als auch anschließend als Freelance Art Director betreute ich die Erstellung des Master-Contents der Online Produkt Kommunikation (OPK) von BMW und MINI und unterstützte bei der UX-Optimierung.

In dieser Zeit habe ich an über 20 OPK Seiten von BMW gearbeitet und 5 davon vom Briefing bis zum SOC als hauptverantwortlicher Designer umgesetzt. Die Produktseiten des BMW i20, F70, F74, G09 und G20/21.

  1. Für die Erstellung einer OPK Seite für BMW mussten:in Zusammenarbeit mit dem Kunden und der internen Technischen Redaktion die Inhalte einer Seite bestimmt werden.
  2. Im Anschluss wurde mit dem Inhalt der Aufbau der Seite in einem Wireframe bestimmt.
  3. Mit dem Wireframe als Basis wurden die benötigten Assets festgelegt und die verschiedenen Produktionsteams gebrieft.
  4. Nach Erhalt der Assets mussten diese für die Masterseite aufbereitet werden und anschließend alle Informationen und Assets an alle Märkte weltweit verteilt werden.
Bei der vielzahl an Projekten in den 2 Jahren mussten viele Projekte parallel bzw. gleichzeitig bearbeitet werden.

Weitere Fragen zu meiner Zeit als Experience Designer bei THE MARCOM ENGINE beantworte ich gerne in einem persönlichen oder digitalen Gespräch.

B2B & B2C Webshop Redesign inkl. Aufbau mehrerer Sub-Atomic Design Systeme für HABA Familygroup

HABA Familygroup

Konsumgüter und Handel

1000-5000 Mitarbeiter

Als digitaler Art Director der Medienwerft GmbH habe ich für den Kunden HABA Familygroup bei dem Redesign der 3 Webshops HABA-Pro, HABA-Play und JAKO-O unterstützt. Zusätzlich war ich für die Konzeption und Umsetzung der Animationen der Käpt’n Pepe Landingpage verantwortlich.

Webshop-Redesigns
Im Zuge der Webshop-Relaunches von HABA Pro, HABA Play und JAKO-O war ich verantwortlich für die visuelle und funktionale Weiterentwicklung der zentralen Shop-Komponenten. Zu meinen Aufgaben zählten:
  • die Gestaltung moderner, responsiver und barrierefreier UI-Komponenten, die auf den Prinzipien des Atomic Designs basieren,
  • die Optimierung der User Experience in Schlüsselsektionen wie Produktdetailseiten, Checkout und Kundenprofil,
  • sowie die aktive Mitgestaltung und Pflege von drei dedizierten Designsystemen.

Animationen für die Käpt’n Pepe Landingpage
Die Animationen habe ich innerhalb kürzester Zeit mit Adobe After Effects entwickelt und mithilfe von Bodymovin und LottieFiles für die Webintegration bereitgestellt. So entstanden leichtgewichtige, interaktive Elemente, die direkt auf der Landingpage eingebunden sind: https://kaeptn-pepe.haba-play.com/de-de/

Genauere Fragen zu meinen Aufgaben für HABA beantworte ich gerne in einem persönlichen oder digitalen Gespräch.

UX & UI Optimierungen für den B2C Webshop und der App von Ernsting's family

Ernsting's family

Konsumgüter und Handel

>10.000 Mitarbeiter

Während meiner Zeit als Junior Art Director und später als Art Director bei der Medienwerft GmbH habe ich Ernsting’s family bei der laufenden Optimierung ihres B2C Webshops und ihrer App unterstützt. Dazu habe ich:
  • bestehende UI-Komponenten überarbeitet und neue Elemente gestaltet,
  • Animationen konzipiert und umgesetzt, um Nutzerfeedback und Übergänge visuell zu unterstützen,
  • sowie auf Basis von Nutzungsdaten gezielte UX-, sowie UI-Verbesserungen an verschiedenen Stellen angestoßen.
Weitere Fragen zu meiner Arbeit für Ernsting’s family beantworte ich gerne in einem persönlichen oder digitalen Gespräch.

Zertifikate

Contentsquare Certification

Contentsquare University

2023

Mediengestalter Digital & Print – Fachrichtung: Konzeption & Visualisierung

IHK Hamburg / bmk Hamburg

2020

Kaufmännischer Medienassistent

Medienschule Hamburg (bmk Hamburg)

2016

Portfolio

item-0

Vollständiges Portfolio

Mein aktuelles Portfolio finden Sie auf meiner Website. Für detaillierte Einblicke in einzelne Projekte sende ich Ihnen auf Anfrage gerne die Zugangsdaten zu."
https://kai-koehler.com/#portfolio
item-1

HABA – Käpt'n Pepe

Innerhalb kürzester Zeit habe ich für die Käpt’n-Pepe-Landingpage die Animationen in After Effects erstellt und diese mit Bodymovin sowie LottieFiles für die Webeinbindung aufbereitet. Das Ergebnis sind interaktive, leichtgewichtige Elemente, die nahtlos integriert werden konnten.
https://kaeptn-pepe.haba-play.com/de-de/
item-2

MyLandgard B2B

Als Teil des Kreativ-Teams der Medienwerft GmbH war ich am UI/UX-Design der gesamten Nutzerstrecke des B2B Portals „MyLandgard“ von der Registrierung bis zum Checkout beteiligt.
https://www.mylandgard.de
item-3

ReflexWinkelmann

Erstellung aller Animationen auf der 50 Jahre ReflexWinkelmann Landingpage. Anpassung des Designs der Webseite für die Implementierung der Animationen. Consultant für Lottiefiles Animationen.
https://50.reflex.de/
item-4

HABA Family Group – B2B & B2C E-Commerce Relaunch

Für den Relaunch der 3 E-Commerce Plattformen der HABA Family Group, wurde das gesamte Design von Grund auf neu erstellt. Dazu wurden 3 separate Atomic Design Systeme in Figma aufgebaut und diese wurden anhand der Analyse von Nutzerdaten laufend optimiert.
https://www.haba-pro.com/de-de/

Kontaktanfrage

Einloggen & anfragen.

Das Kontaktformular ist nur für eingeloggte Nutzer verfügbar.

RegistrierenAnmelden