Brad Woods Digital Garden
Brad Woods Digital Garden
Notes about web dev. creative coding
Juice
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.
3D in CSS
How to create a 3D space using CSS. How to use the CSS perspective and perspectiveOrigin properties. How to translate, scale and rotate an element in 3D space.
Animate a mesh across a sphere's surface
How to animate a mesh across the surface of a sphere using three.js and GSAP.
Scroll-driven draw animation
How to create a line drawing effect on scroll using SVG clip-path.
Shaders 101
An introduction to WebGL shaders. What they are. How they work. Why they are valuable.
Scroll-driven camera animation
How to move the camera around a three.js scene as the user scrolls down the page.
How to write
What is the purpose of writing a blog post. How to choose what to write about and how to say it. The value of writing.
Browser adaptation
Exploring the browser as a storytelling medium.
Table of contents
How to create a web page table of contents UI (User Interface).
User-driven UI
What is a User Driven UI. What is the Zone of Proximal Development. Different approaches to teaching users how to use a UI. Using AI in the UI.
CSS blend modes
What are CSS blend modes. How to use background-blend-mode and mix-blend-mode. Interactive examples.
Intersection Observer
What is the Intersection Observer and how to use the it.
News
News sources for web dev. creative coders.
Personalization
Personalization in softare. Examples of personalized UI. The benefits of personalization.
Scroll percent
How to calculate how far the user has scrolled on the page or page section.
JavaScript
Performance
React
State Management
three.js
Web API
HTML
CSS
SVG
Misc.
Design
Story
Game dev. journal
