On progressive disclosure for AI context
Keep discovery cheap, activation focused and examples on demand, so the agent loads less and decides against sharper rules.
Karl Koch
Thoughts on design, development and career progression
Latest posts
Weekly Links — 12th August 2026
Ten Minute Focus, Branding, Design, Motion and more.
On turning opinions into constraints
An opinion helps an agent once you turn it into a trigger, decision rules and a review checklist.
Weekly Links — 5th August 2026
Ten Minute Focus, Branding, Design, Motion and more.
On giving AI taste
Models ship the median of the internet. A written review rubric is how you keep that median from becoming your product.
Weekly Links — 29th July 2026
Ten Minute Focus, Branding, Design, Motion and more.
On layout choreography
Layout animation keeps spatial memory intact when lists reorder, panels expand, and items enter or leave. FLIP turns layout jumps into transform-based motion.
Weekly Links — 22nd July 2026
Links on unwanted AI, compound icons, offline life, dropdowns, motion, design ethics, and accessible frontend patterns.
Why I built a semantic-HTML first library
Kernel simplifies UI components by sticking to native HTML, avoiding unnecessary abstraction and improving accessibility.
On shared context
Shared-element transitions work when the same object survives a state change. View Transitions give the browser the geometry, but the design decision is choosing what identity should persist.
Weekly Links — 15th July 2026
Links on brand strategy, distressed-user UX, design engineering, motion, AI workflows, and frontend craft.
On anchored interfaces
Popover and CSS Anchor Positioning move menus, tooltips, and small overlays back into the platform: top layer, light-dismiss, focus return, spatial tethering, and viewport-aware placement.
Weekly Links — 8th July 2026
Links on accessibility operations, game UX, brand identity, motion principles, AI explanations, and WebGPU transitions.
On the semantic web
Semantic HTML is interface infrastructure: native elements carry behaviour, accessibility, form semantics, keyboard support, and platform adaptation before styling begins.
Weekly Links — 1st July 2026
Links on dark patterns, AI slop, branding, product psychology, motion, documentation, and frontend testing.
Weekly Links — 24th June 2026
Links on designers as builders, adaptive UI, haptics, AI accessibility, product principles, and masonry in CSS.
Weekly Links — 17th June 2026
Links on new AI design roles, humanoid robots, chatbot UX, cross-browser glass effects, motion, and accessibility.
Weekly Links — 10 June 2026
Links on AI and design roles, focus, motion vocabulary, voice interfaces, design systems, and software quality.
Falling in love with the build
Write-first design puts the reason before the implementation.
Weekly Links — 3rd June 2026
Links on Figma Agent, honest prototypes, brand identity, motion, AI trust, and frontend animation.
Write-first design
Write-first, build later: Ensures clear, documented decisions, preventing costly missteps in design and engineering.
What a Turkish Barber can teach you about great UX
A skilled barber anticipates needs, protects your attention and removes friction. Product designers can do the same.
Weekly Links — 27th May 2026
Links on tech’s changing culture, design judgment, AI workflows, accessibility, motion, and experimental web projects.
Weekly Links — 20th May 2026
Links on AI design limits, taste, a playable Starry Night, transparent agent interfaces, browser AI, and an alphabetical clock.
Weekly Links — 6 May 2026
Links on stable streaming interfaces, AI’s effect on team trust, branding, accessible software, and scroll-driven animation.
The Slop Isn't the Models
AI slop arises from a design-to-build gap, not the tool itself. Designers must understand the medium to judge AI outputs effectively.
On the right tool for the job
Choose the right tool for each project based on its requirements, not past preferences.
On caring about the inside
Apple's 50th anniversary is a reminder to care about the parts of software that users never see.
Weekly Links — 15th April 2026
Links on purposeful work, responsible design, AI fatigue, agent transparency, mechanical sympathy, and accessible icons.
On scroll-driven reveals
CSS scroll-driven animations fade sections in with five lines of CSS, using view() timelines and a cover-based range instead of JavaScript.
Building a Voice-First Dictation Experience in SwiftUI
Tap a circle and speak. Your words appear on black as a glowing cursor follows them. No keyboard or chrome.
On oklch
The site's OKLCH palette uses perceptual lightness, warm hues, tinted shadows, light-dark themes, and colour-mix derivatives.
On reduced motion
Reduced motion needs alternative interactions. Swap spring physics for grids, keep safe opacity and colour changes, and detect preferences with media queries.
Weekly Links — 8th April 2026
Links on AI’s effect on creative work, design principles, microcopy, design tokens, free software, and procedural graphics.
On velocity gating
Velocity gating for hover shelves: EMA smoothing, split engage/disengage thresholds, and directional hysteresis prevent strobe effects without debounce lag.
On the complexity of production codebases
Production code must fit legacy data, team conventions and organisational constraints as well as solve the immediate problem.
Weekly Links — 25 March 2026
Links on AI sensemaking, branding, practical UX, motion, JPEG compression, ad-heavy websites, and product strategy.
On clip-path animations
WorkCard reveals its detail panel with a circular clip path centred on the trigger. A 150% radius covers every corner, while pointer events and icon rotation track the open state.
Weekly Links — 18th March 2026
Links on community-led creative work, persuasive design, branding, motion, AI trust, cognitive debt, and developer tools.
On teaching to learn
Teaching exposes gaps in your understanding and forces you to explain what you thought you knew.
Weekly Links — 11th March 2026
Links on inclusive UX research, human-led AI workflows, branding, motion, accessibility, and CSS.
On fake news…paper
The card stack uses CSS perspective, translateZ, dual springs, exponential deflection, directional hover gating, and editorial typography to evoke newspaper clippings on a table.
Weekly Links — 4th March 2026
Links on design craft, agentic commerce, sustainable UX, branding, motion, AI tools, and design careers.
On overdoing delight
Animation may provide the final ten percent of polish, but design engineers bring creative value across design and code.
Weekly Links — 25th February 2026
Links on AI-assisted design and coding, branding, motion, surveillance defaults, smaller software, and design systems.
On adding homepage delight
A vinyl-style music shelf combines spring physics, deflection, layered hover states, and velocity gating, with grid and scroll-strip alternatives.
Weekly Links — 18 February 2026
Links on concept art, mental health UX, design system enforcement, agentic AI patterns, motion, and creative coding.
10 Principles for Fluid UI
Physics-based, interruptible motion and direct manipulation make interfaces respond to input with weight, continuity, and clear spatial relationships.
Weekly Links — 11 February 2026
Links on problem ownership, purpose and AI, domain expertise, redesign resistance, branding, and motion.
Design Engineering in 2026 ft. Karl Koch
Another video of me talking about Design Engineering