Journal

What I'm reading, and what I'm
writing about design-to-code.

Mostly curated reading for now – the articles and resources that shape how I design, ship and think about craft, with my own notes to follow.

Cover artwork for “Invisible Details of Interaction Design”

Curated

Rauno Freiberg (Every) – September 2026

Invisible Details of Interaction Design

A 3000-word essay deconstructing what makes interactions feel right, through metaphors and examples. Written by a staff design engineer at Vercel – the definitive "designer who builds" read.

ui
motion
craft
design-to-code

Read article

Cover artwork for “GSAP: Killer Web Animations With Cassie Evans”

Curated

Syntax FM – September 2026

GSAP: Killer Web Animations With Cassie Evans

Cassie Evans of GreenSock on what GSAP is, why creatives use it, and techniques for smooth, performant web animation. She moved from motion-graphics design into creative development.

motion
design-to-code
craft

Read article

Cover artwork for “Designing With Reduced Motion For Motion Sensitivities”

Curated

Smashing Magazine – September 2026

Designing With Reduced Motion For Motion Sensitivities

How to use the prefers-reduced-motion media feature to design motion that respects users with vestibular disorders. Essential reading for anyone shipping animated interfaces.

motion
accessibility

Read article

Cover artwork for “prefers-reduced-motion: Sometimes less movement is more”

Curated

web.dev – September 2026

prefers-reduced-motion: Sometimes less movement is more

Google's practical guide to detecting reduced-motion preferences and adapting animation accordingly. A compact companion to the deeper Smashing piece.

motion
accessibility
css

Read article

Cover artwork for “Understanding SVG Coordinate Systems and Transformations”

Curated

Sara Soueidan – September 2026

Understanding SVG Coordinate Systems and Transformations

The canonical reference on viewBox, viewport and preserveAspectRatio. For anyone hand-tracing SVG paths, this is the foundation everything else rests on.

motion
design-to-code
craft

Read article

Cover artwork for “Codrops – experimental interactive design”

Curated

Codrops – September 2026

Codrops – experimental interactive design

An ongoing library of experimental WebGL, SVG and interaction demos with full tutorials. The home ground of creative front-end development.

motion
craft
ui

Read article

Cover artwork for “IAB New Ad Portfolio – HTML5 display guidelines”

Curated

IAB – September 2026

IAB New Ad Portfolio – HTML5 display guidelines

The industry-standard guidelines for HTML5 display advertising. The formal spec behind a decade of rich-media production practice.

rich-media
performance

Read article

Cover artwork for “CSS Utility Classes and 'Separation of Concerns'”

Curated

Adam Wathan – September 2026

CSS Utility Classes and 'Separation of Concerns'

The essay that started Tailwind CSS – an argument for utility-first styling over semantic class naming. Directly relevant to my own stack choices.

css
design-systems
design-to-code

Read article

Cover artwork for “The Cost of JavaScript in 2019”

Curated

Addy Osmani (V8 team) – September 2026

The Cost of JavaScript in 2019

How JavaScript parse, compile and execution time affects performance budgets – the bridge between production craft and engineering credibility.

performance
design-to-code

Read article

Cover artwork for “From Figma to Production: The Modern Design-to-Code Pipeline in 2026”

Curated

HorizonX – July 2026

From Figma to Production: The Modern Design-to-Code Pipeline in 2026

Overview of current design-to-code tools and what works in production. It helped me separate promising automation from production-ready practice – useful when choosing a dependable design-to-code workflow.

design-to-code
design-systems
figma

Read article

Cover artwork for “What the Design-to-Code Loop Unlocks”

Curated

Figma – May 2026

What the Design-to-Code Loop Unlocks

Clear explanation of how design and code workflows are converging. It gave me a clearer model for preserving design intent through implementation – directly relevant when one person owns both design and code.

design-to-code
design-systems
figma

Read article

Cover artwork for “Dixit Dhanani on UI/UX craft”

Curated

LinkedIn – February 2026

Dixit Dhanani on UI/UX craft

A concise roundup of practical UI and UX ideas from Dixit Dhanani. I recommend it as a quick source of craft details worth carrying from design critique into implementation.

ui
ux
craft

Read article

Cover artwork for “UI and UX Patterns Gaining Ground”

Curated

Calmops – February 2026

UI and UX Patterns Gaining Ground

A compact rundown of UI and UX patterns gaining ground. I use it as a quick pattern scan, then pressure-test each idea for usability and build cost.

trends
ui
ux

Read article

Cover artwork for “State of UX 2026: design deeper to differentiate”

Curated

uxdesign.com – January 2026

State of UX 2026: design deeper to differentiate

A perspective on where UX is heading as fast production becomes commonplace. Its case for deeper differentiation is a useful reminder that design-to-code speed only matters when the underlying decisions are strong.

ux
trends
strategy

Read article

Cover artwork for “The New Business Case for Design Systems”

Curated

Figma – January 2026

The New Business Case for Design Systems

How design systems evolved from static libraries to drivers of revenue and product strategy. It strengthened my case for treating systems as product infrastructure, not just tidy design files.

design-systems
strategy

Read article

Cover artwork for “Where Graphic Design Is Heading in 2026”

Curated

itsnicethat.com – January 2026

Where Graphic Design Is Heading in 2026

Where graphic design is heading in 2026, from the It's Nice That editors. It is a useful cultural signal for keeping visual systems current without turning implementation into trend-chasing.

trends
craft

Read article

Cover artwork for “Baymard: year in review 2025 and 2026 roadmap”

Curated

Baymard Institute – December 2025

Baymard: year in review 2025 and 2026 roadmap

E-commerce UX research highlights from 2025 plus what Baymard is studying next. I use the research highlights to challenge familiar interface assumptions before translating them into code.

ux
research

Read article

Cover artwork for “Current Web Design Trends, With Concrete Examples”

Curated

Figma – November 2025

Current Web Design Trends, With Concrete Examples

Figma's overview of current web design trends with concrete examples. I take the useful patterns, test them against usability, and only then carry them into production interfaces.

trends
ui
figma

Read article

Cover artwork for “Design to Code Articles”

Curated

Builder.io – September 2025

Design to Code Articles

Practical guides on shipping faster with design systems and code. Its practical examples reinforce where systems save real production time and where generated code still needs judgment.

design-to-code
design-systems

Read article

Cover artwork for “Branded, Measured, and Future-Ready: Design Systems in 2025”

Curated

designsystemscollective.substack.com – September 2025

Branded, Measured, and Future-Ready: Design Systems in 2025

Thoughtful take on branded, measured, and future-ready design systems in 2025. It helped me frame system quality in outcomes rather than component counts, which matters when design standards meet production constraints.

design-systems
strategy
trends

Read article

Cover artwork for “Design Systems Use Cases: Real-World Examples from IKEA, Atlassian, Adobe and More”

Curated

Into Design Systems – March 2025

Design Systems Use Cases: Real-World Examples from IKEA, Atlassian, Adobe and More

Real-world design system use cases (IKEA, Spotify, etc.) with tokens, accessibility, and scale. It shows how tokens and accessibility survive at scale – practical context for building systems that work beyond the design file.

design-systems
case-studies
accessibility

Read article

Cover artwork for “Zeroheight Design System Report 2025”

Curated

othr.zeroheight.com – February 2025

Zeroheight Design System Report 2025

An industry report on design-system adoption, tokens, governance, and maturity. It clarified where systems create leverage beyond component libraries – useful when connecting design standards to production code.

design-systems
research
trends

Read article

Cover artwork for “Design System Case Studies and Examples”

Curated

Case Study Club – June 2024

Design System Case Studies and Examples

Curated design system case studies from real teams, useful for patterns and storytelling. I use the examples to compare governance and implementation patterns before shaping a system of my own.

design-systems
case-studies

Read article

Cover artwork for “Figma Best Practices for Design and Prototyping Workflows”

Curated

Figma – April 2024

Figma Best Practices for Design and Prototyping Workflows

Official Figma best practices for design and prototyping workflows. I return to it for cleaner files and clearer handoffs, reducing friction when designs become working interfaces.

figma
prototyping

Read article

Cover artwork for “23 Prototyping Resources to Bookmark Right Now”

Curated

Figma – March 2024

23 Prototyping Resources to Bookmark Right Now

Curated list of prototyping resources, useful for leveling up workflow. I use it to compare prototyping approaches before committing to a build, which keeps design-to-code choices proportional to the problem.

prototyping
figma

Read article

Curated – June 2022

Practices That Propel the Best Design Teams Forward

Essential reading on the practices that propel the best design teams forward.

design-systems
craft

Read article

Curated – March 2022

The Guide to Design

A free, self-guided class to help you take your first steps into digital product design.

ux
career

Read article

What I'm reading, and what I'mwriting about design-to-code.

Articles

Invisible Details of Interaction Design

GSAP: Killer Web Animations With Cassie Evans

Designing With Reduced Motion For Motion Sensitivities

prefers-reduced-motion: Sometimes less movement is more

Understanding SVG Coordinate Systems and Transformations

Codrops – experimental interactive design

IAB New Ad Portfolio – HTML5 display guidelines

CSS Utility Classes and 'Separation of Concerns'

The Cost of JavaScript in 2019

From Figma to Production: The Modern Design-to-Code Pipeline in 2026

What the Design-to-Code Loop Unlocks

Dixit Dhanani on UI/UX craft

UI and UX Patterns Gaining Ground

State of UX 2026: design deeper to differentiate

The New Business Case for Design Systems

Where Graphic Design Is Heading in 2026

Baymard: year in review 2025 and 2026 roadmap

Current Web Design Trends, With Concrete Examples

Design to Code Articles

Branded, Measured, and Future-Ready: Design Systems in 2025

Design Systems Use Cases: Real-World Examples from IKEA, Atlassian, Adobe and More

Zeroheight Design System Report 2025

Design System Case Studies and Examples

Figma Best Practices for Design and Prototyping Workflows

23 Prototyping Resources to Bookmark Right Now

Practices That Propel the Best Design Teams Forward

The Guide to Design

What I'm reading, and what I'm
writing about design-to-code.