Brad Woods' Digital Garden
Notes about web design & engineering
What is Juice in software development. What is Game Feel and how it can it be used in non-game software. How software can fulfil emotional requirements. How to create software with soul. Examples of Juice on the web.
User Driven UI
What is a user driven UI. What is the Zone of Proximal Development. How to teach users how to use an app. The pros and cons of different app teaching approaches. An argument for complex instead of simple tools.
3D in CSS
How to create a 3D space using CSS. How to use the CSS perspective property. How to translate and rotate an element in 3D space using CSS. Use cases for the CSS perspective property.
CSS Blend Modes
What are CSS blend modes. How to use background-blend-mode and mix-blend-mode. Interactive examples.
How to wrap text around an image using CSS. How to use the float, shape-outside and shape-margin property. How to create an animated drop cap using CSS.
Global State in Next.js using XState
How to create global state in Next.js using XState
Setting up typography in Next.js using vanilla-extract & Capsize
Setting up CSS font styles in a Next.js app using vanilla-extract and Capsize.
A tool for creating the CSS & HTML for layout components. External site.
A game that introduces Git. Experiment.