Mark Herpich

Before this project, the DACH cosplay scene lacked a dedicated marketplace tailored to its needs — offers were scattered across forums, Instagram, and classified-ads sites, creating friction for sellers and buyers alike.

Led the complete brand identity development for CosHive from the ground up – from logo creation and color system to typography and the complete design system in Figma and Adobe Illustrator. The platform’s visual identity reflects the community-oriented nature of the DACH cosplay scene: inviting, creative, and instantly recognizable. Conducted qualitative user interviews with active cosplayers in the DACH community to validate the platform concept, deriving personas, journey maps, and prioritized feature requirements from the findings. The marketplace’s information architecture was iteratively optimized through card sorting and tree testing. Implemented the design using Next.js, React, and TailwindCSS – component-based with shadcn/ui and Radix UI for a consistent, accessible interface. The infrastructure was provisioned with Terraform, and Supabase handles backend and data storage. Resend in combination with React Email was used for transactional email delivery.

The performance decisions were made at the architecture level: the application runs on the Next.js App Router, with nearly all pages implemented as React Server Components — the data-heavy marketplace views are rendered and paginated on the server rather than assembled in the browser. Beneath that sits a tagged data cache with time-based revalidation for product listings and filter options, combined with parallel loading of independent data sources. Images originate in Google Cloud Storage and are served through Bunny CDN via a custom Next.js image loader that applies width and quality as on-the-fly transforms per request, with the implementation shared between the web and mobile apps; protected chat media is served over a separate, token-signed CDN path.

Within the first week after launch, more than 150 members signed up; by the end of the first six weeks, over 700 listings had been posted — with adoption continuing to grow.

At kickoff, neither an established brand nor a technical foundation existed — IDENTIC was built as a greenfield project, with no prior corporate identity, no shared components, and no frontend infrastructure in place.

Built the IDENTIC brand platform with multilingual web architecture and CMS integration. Responsible for the corporate identity system, a reusable UI component library, and the frontend infrastructure based on Next.js, TailwindCSS, and headless Sanity.io with automated deployment pipelines and server-side rendering. The component library development was preceded by a systematic UX analysis: heuristic evaluation of existing touchpoints, definition of usage patterns, and validation through internal usability reviews. i18n flows secured via Playwright cross-browser E2E tests.

The outcome is a sustainable brand platform serving as the technical and visual foundation for all subsequent IDENTIC client projects — multilingual architecture, a reusable component library, and secured i18n flows included.

Three sub-brands (AB SportEvent, AB Kultur & Genuss, AB Pferde Erlebnis) were to be merged under the AB Events umbrella, and the existing website no longer sufficed as a pure presence — direct bookings, SEO-driven visibility, and a modern shop workflow required a new platform.

Owned everything from brand to e-commerce platform: a new logo and brand assets for the merged brand, print and web design, storefront implementation with Shopify Hydrogen, and deployment via Shopify Oxygen. Integration of the existing Eventmanager via API for dynamic travel data, Shopify backend administration, and a fresh SEO strategy for organic visibility.

The result is the first directly bookable AB Events platform under one unified brand — with an automated booking and fulfillment process replacing the previously manual inquiries by phone and email.

After 14 years, the original website no longer met current requirements — no reliable mobile version, a dated design, and a portfolio that had grown to include cultural events (among them André Rieu concerts).

Led the full brand refresh — logo modernization, new color and typography systems, reworked print material — alongside the redevelopment of the website as an Angular application with a modular component system and responsive design. REST API integration with the existing Eventmanager delivered dynamic travel data, departure points, and availability. Deployment via Google Cloud Run with Docker containerization.

The new web presence became the technical foundation for the later e-commerce booking portal and reflected the expanded offering through a uniformly modernized brand identity.

Before launch, AB SportEvent communicated with prospective customers exclusively by phone or email — the growing travel portfolio had no visible online presence.

Visual design of the first company website: layout, imagery, and design for the trip overview, detail pages per travel package, photo galleries of past events, and the contact form. The purely technical implementation was handled by a separate development team — the role focused on the visual concept.

The launch marked the beginning of a partnership with AB Events that continues to this day and spans more than 18 years, over the course of which the entire business has been successively digitized.

The starting point was an aging PHP shop built on an outdated database — without future-proof scalability, without a reliable mobile version, and relying on entirely manual fulfillment processes.

Responsible for design and frontend development in the e-commerce transformation of Geschenkzeitung.de — a platform serving over 2 million products built on an Angular PWA with an integrated backend management system. Led the UI/UX redesign and corporate identity development using Angular, TypeScript, and SCSS. The redesign was preceded by a UX research phase: analysis of existing user flows via session recordings and heatmaps, moderated usability tests with existing customers, and stakeholder interviews with product management. Insights were incorporated into wireframes and iterative prototypes, validated before implementation. Testing setup with Jest (jest-preset-angular) for unit tests and Cypress for critical user flows (cart, checkout).

Catalog size shaped every list view: over 2 million items are never loaded in one go but consistently paginated and filtered on the server — in the shop as well as in the management tables, right down to the full view across the entire newspaper inventory. The customer entry point is the date-based product search: a target date narrows the result space from the outset, and matches are rendered per product type. The PWA layer keeps the app shell and recurring assets local, so repeat visits stay fast even on weak mobile connections and the shop remains usable offline. Delivery runs on a GCP architecture with Cloud Run, Cloud Storage, and Cloud Armor; Lighthouse CI was a fixed part of the pipeline, surfacing performance regressions before they reached a shop handling roughly 20,000 orders a year.

The result was an end-to-end modernization of brand, logo, and shop: an installable PWA with a consistent brand presence, paired with a fully digital inventory and fulfillment management system that replaced the previously manual workflows.

Geschenkzeitung.de's operational processes had been running through a heterogeneous toolchain of spreadsheets, standalone tools, and manual reconciliation — at over 2 million items and around 20,000 orders per year, this no longer scaled.

Designed and implemented the admin interface for Babylon, the custom-built ERP system: UI/UX design for the core modules (order, inventory, and invoice management, process engine, analytics) and frontend development with Angular, NgRx state management, and REST API integration with the Node.js/MongoDB backend services. Deployment via Google Cloud Run.

The result is the complete digitization of all business processes — from order capture and picking through 7 integrated payment methods and 3 DHL shipping options to DATEV export and returns management — all consistent via a unified admin interface.

Developed the first corporate website for a premium CGI and 3D visualization studio specializing in automotive content (clients include BMW and Audi). Built the frontend with Next.js and Sanity CMS in a reduced black-and-white aesthetic with micro-animations via Framer Motion — from technical architecture to launch in five weeks.

The technical core of the project was performance work on media handling: the studio's renderings had to be not merely displayed but experienced through scroll-driven interaction — high-resolution, starting instantly and running smoothly, even in full-screen. Delivered through optimized video streaming, lazy loading of media assets, and a mobile-first architecture built consistently around delivery speed. Measured result: video start in under 500 ms, smooth scroll animation at 30 fps, and HD+ quality even at full-screen size.

This was safeguarded by Playwright visual regression tests and Lighthouse CI, which monitors performance metrics on every build and surfaces regressions before they go live.

Developed the digital brand identity and website for Kevin Metz Training & Consulting in the field of occupational safety. Designed logo, brand guidelines, and a conversion-oriented website using Next.js, Framer Motion, TypeScript, and TailwindCSS with a headless Sanity.io CMS. The concept was based on client discussions and a competitive analysis in the occupational safety sector. Wireframes were validated in feedback sessions before development.

Designed and built a personal portfolio with interactive animations and progressive enhancement. Implemented using Next.js, Framer Motion, TypeScript, and TailwindCSS, connected to a flexible Sanity.io CMS for independent content management.

Responsible for the complete visual brand development of the digital food startup — from logo design to brand assets (business cards, corporate materials) and product photography. Conceived and realized the entire corporate identity using Adobe Illustrator, InDesign and Photoshop. Conducted product photography and post-processing with Adobe Lightroom. Implemented the online shop using Angular and continuously maintained the platform over three years.

Designed and developed a website for heavy metal band RIGORIOUS with integrations for music streaming platforms and tour data APIs. Design in Figma and Photoshop, implementation with Astro, Framer Motion, TypeScript, and TailwindCSS. The website reflects the band's identity and serves as a central hub for music, tour dates, and fan interaction.

Brand repositioning and bilingual website development for KB-Automation. Developed the visual identity including logo redesign, typography, and color concept. Built the bilingual website using WordPress and Elementor, tailored for B2B audiences. Designed print materials (business cards, promotional items) with consistent brand presence.

Responsible for the complete visual brand development of FUNC Sportswear from scratch — from logo design to brand assets (business cards, corporate materials) and brand photography. Conceived and realized the entire corporate identity using Adobe Illustrator, InDesign and Photoshop. Conducted product photography and post-processing with Adobe Lightroom. Implemented the online shop based on a customized Shopify template with a consistent brand appearance.

Responsible for the conception, design and implementation of innovative frontend solutions for retail client real,- SB Warenhaus GmbH — from webshops and microsites to responsive email campaigns based on TYPO3/TypoScript and SAP Hybris. Conducted requirements, feasibility and effort analyses as well as technical specifications in close coordination with backend teams and specialist departments. Developed fluid templates for frontend output via TypoScript and implemented responsive design concepts for web and mobile. Seconded to parent company METRO for two years to manage the frontend of an online supermarket pilot project in international team collaboration. Technology evaluation and selection for new projects as well as email rendering tests with Litmus.