Two decades in metalworking and manufacturing

Websites for Handwerk and Mittelstand, built by someone who's run the machines.

Hi, I'm Michael — before I built websites, I ran a metalworking business and spent two decades inside a real manufacturing company, including years working with operations in China. That background runs deep in my work for Handwerk and Mittelstand — but whatever you can imagine, let's build it together.

More about that background.

What I do

From first pixel to production deploy — the full front-end craft.

Build

Clean, maintainable code using modern HTML, CSS, and JavaScript — no unnecessary frameworks.

Design

Interfaces that feel intentional — thoughtful layout, type, and motion in every detail.

Ship

Fast, accessible, and reliable launches — tested across devices before anything goes live.

29 Years since my first line of HTML code
22 Years inside real manufacturing
4 Years working with China operations
11 Pages on the client site

"Every project ends the same way: a fixed price, a clean handover, and a site your own team can actually keep running."

Practice work

Selected builds — including a full anonymized site for a real client — that show how I handle performance, accessibility, and the kind of workflows a non-technical team can actually maintain.

All of these are fictional concepts for portfolio purposes — not real companies, products, or services.

secondchance.example
01 — Marketplace concept

Second Chance

A marketplace concept for restored and refurbished goods — cameras, watches, bicycles, furniture — each listing telling the object's repair history.

HTML CSS JavaScript Marketplace UI
View sample
luna-clockwork.example
02 — Interactive story

Luna & the Clockwork Moon

A scroll-driven illustrated storybook about a girl racing to repair the night sky's great clockwork moon.

HTML CSS Scroll Animation Illustration
View sample
atlas-cities.example
03 — Lifestyle platform

ATLAS

A lifestyle discovery platform concept for choosing where to live next — global cities, architecture, and emerging regions.

HTML CSS JavaScript Data Visualization
View sample
northbound.example
04 — Outdoor brand

NORTHBOUND

An outdoor-gear brand concept told as a scroll-driven expedition journal, from trailhead to summit.

HTML CSS Scroll Animation Storytelling
View sample
monolith-robotics.example
05 — Industrial site

MONOLITH

An industrial engineering concept for a precision robotics manufacturer — systems, tolerances, and six-axis machines.

HTML CSS JavaScript Technical Design
View sample
stormfront-analytics.example
06 — Data dashboard

Stormfront Analytics

A real-time climate-intelligence dashboard concept, fusing satellite and sensor data into an early-warning platform.

HTML CSS JavaScript Dashboard UI
View sample
schlosserei-langenfeld-mark.example
07 — Locksmith homepage

Locksmith & Metalwork Website

A complete small-business website for a German Schlosserei — balcony railings, staircases, and stainless steel work — with services, references, and legal pages all included. Every name, address, and photo on it is fictional; the real client's identity has been fully anonymized for this portfolio.

HTML CSS JavaScript Responsive Images
View live demo ↗

Design System

A small component library and style guide used across internal tools.

CSS Accessibility

Booking Widget

An embeddable scheduling widget with real-time availability checks.

JavaScript API Integration

Portfolio Template

A reusable, themeable template for developer and designer portfolios.

HTML CSS

How we'd work together

No hourly guesswork — every project gets a clear scope and a fixed price before a single line of code gets written.

Step 1

Discovery call

A short conversation about what you need, your constraints, and whether I'm the right fit — no cost, no obligation.

Step 2

Fixed-price proposal

A written scope and a fixed price before any work begins, so you know exactly what you're getting and what it costs — no open-ended hourly billing.

Step 3

Build, with check-ins

Regular progress updates and review points along the way, so there are no surprises when the site goes live.

Step 4

Launch & handover

Tested across devices, then handed over with the access and documentation your team needs to keep running it.

Let's build something great.

Have a project in mind? I'd love to hear about it.

Get in touch