Ultimate Designers Lab
23 spaces liveARJoin

Code & AI

Creative Coding

02The curriculum

Modules and topics

18 modules, 193 topics.

Foundational content13 modules

Core content in the space, explaining the essentials of this skill.

01 — Start Here

Understanding Code As A Creative Tool

10 topics

  • What Creative Coding Actually Means
  • Design Beyond Static Screens
  • Why Motion Changes Perception
  • The Difference Between Product Code & Creative Code
  • Code As A Visual Material
  • Interactive Design Thinking
  • Why Modern Designers Need Technical Curiosity
  • Creative Technology Fundamentals
  • The Relationship Between Logic & Art
  • Building Experiences Instead Of Mockups

02 — HTML & CSS For Creative Designers

The Foundation Of Digital Experiences

12 topics

  • HTML Basics
  • CSS Fundamentals
  • Layout Systems
  • Positioning
  • Animations
  • Transitions
  • Responsive Layouts
  • CSS Variables
  • Blend Modes
  • Filters
  • Building Interactive Layouts
  • Why CSS Is More Powerful Than Most Designers Think

03 — JavaScript Fundamentals

Adding Behavior & Interaction

12 topics

  • Variables
  • Functions
  • Events
  • DOM Manipulation
  • Mouse Interaction
  • Scroll Interaction
  • Timing
  • Animation Logic
  • Dynamic Interfaces
  • State Basics
  • Real-Time Interaction
  • Thinking Beyond Static Design

04 — Motion & Interaction Design

Designing Time, Not Just Space

11 topics

  • Motion Principles
  • Timing & Easing
  • Interactive Feedback
  • Scroll-Based Animation
  • Hover Systems
  • Physics-Based Motion
  • Gesture Interaction
  • Emotional Direction Through Motion
  • Motion Hierarchy
  • Interface Choreography
  • Designing Responsive Interactions

05 — p5.js Fundamentals

Generative Design & Visual Experiments

12 topics

  • Canvas Basics
  • Shapes
  • Coordinates
  • Loops
  • Randomness
  • Noise
  • Motion Systems
  • Interactive Sketches
  • Generative Patterns
  • Algorithmic Design
  • Visual Experiments
  • Designing Systems Instead Of Frames

06 — Generative Design Thinking

Creating Systems That Create Visuals

10 topics

  • Rules-Based Design
  • Controlled Randomness
  • Pattern Generation
  • Procedural Thinking
  • Emergent Visual Systems
  • Iteration Through Code
  • Visual Algorithms
  • Systemic Creativity
  • Designing Behaviors
  • Why Generative Design Feels Alive

07 — Three.js Fundamentals

Building 3D Experiences On The Web

12 topics

  • 3D Space Basics
  • Cameras
  • Lighting
  • Materials
  • Meshes
  • Scene Systems
  • Interaction In 3D
  • Animation Basics
  • Spatial Design
  • Web-Based 3D
  • Interactive Environments
  • Why 3D Is Becoming Mainstream

08 — WebGL & Shaders

Real-Time Graphics & Visual Computation

12 topics

  • What WebGL Actually Is
  • GPU Rendering Basics
  • Shader Thinking
  • Fragment Shaders
  • Vertex Shaders
  • Real-Time Visuals
  • Interactive Graphics
  • Procedural Effects
  • Noise Systems
  • Visual Computation
  • Experimental Rendering
  • Why Shaders Feel "Alive"

09 — Creative Frontend Experiences

Designing Websites That Feel Different

10 topics

  • Interactive Landing Pages
  • Immersive Storytelling
  • Experimental Interfaces
  • Scroll Experiences
  • Interactive Typography
  • Audio-Reactive Visuals
  • Dynamic Layouts
  • Cursor Systems
  • Spatial Navigation
  • Web Experiences Beyond Templates

10 — Sound, Interaction & Real-Time Systems

Designing Reactive Experiences

11 topics

  • Audio Interaction
  • Real-Time Inputs
  • Mouse Tracking
  • Gesture Systems
  • Webcam Interaction
  • Sensor-Based Design
  • Reactive Motion
  • Interaction Feedback Loops
  • Dynamic Systems
  • Interactive Installations
  • Experiential Design Thinking

16 — Creative Coding Breakdowns

Learning Through Real Experiences

11 topics

  • Award-Winning Websites
  • Awwwards Projects
  • Interactive Brand Experiences
  • Experimental Portfolios
  • Generative Art Projects
  • Interactive Installations
  • Immersive Landing Pages
  • Motion-Driven Websites
  • WebGL Experiences
  • Creative Developer Projects
  • Digital Art Systems

17 — Creative Challenges

Learning By Building Interactive Systems

10 topics

  • Build A Generative Background
  • Create A Mouse-Reactive Interface
  • Design A Scroll-Based Story
  • Create A Dynamic Typography System
  • Build An Interactive Hero Section
  • Create A Particle System
  • Build A Motion-Based Landing Page
  • Create An Audio-Reactive Experience
  • Build A 3D Interactive Scene
  • Create A Generative Poster System

18 — Creative Coding Debates

There Is No Single Correct Creative Workflow

10 topics

  • Is Creative Coding Design Or Art?
  • Should Designers Learn JavaScript?
  • Is Motion Becoming Overused?
  • Are Interactive Websites Practical?
  • Does Experimental Design Hurt UX?
  • Is AI Killing Creative Exploration?
  • Are Templates Killing Creativity?
  • Is 3D Becoming A Requirement?
  • Should Designers Think Like Developers?
  • Can Systems Be Emotional?

Context content5 modules

Where this skill meets the other spaces.

11 — Creative Direction Through Code

Using Technology To Shape Emotion

10 topics

  • Emotional Interaction Design
  • Mood Through Motion
  • Spatial Feeling
  • Rhythm In Digital Experiences
  • Tension & Calmness
  • Digital Atmosphere
  • Immersion
  • Interactive Storytelling
  • Designing Presence
  • Why Motion Creates Emotion

12 — Design Systems & Creative Systems

Balancing Structure & Experimentation

10 topics

  • Modular Creativity
  • Reusable Motion Systems
  • Dynamic Components
  • Interactive Tokens
  • Flexible Systems
  • Controlled Complexity
  • Scaling Creative Work
  • Motion Consistency
  • Systemic Interaction Design
  • Experimental Yet Maintainable Design

13 — AI & Creative Coding

Working With AI In Experimental Design

10 topics

  • AI-Assisted Coding
  • AI-Generated Visual Systems
  • Prompting For Interactive Ideas
  • AI In Motion Design
  • AI As A Creative Collaborator
  • Reviewing AI Output
  • Human Direction In Experimental Work
  • The Future Of Interactive Creativity
  • AI & Generative Design
  • Intentionality After Automation

14 — Common Creative Coding Mistakes

Why Some Interactive Work Feels Empty

10 topics

  • Motion Without Meaning
  • Overusing Effects
  • Interaction Overload
  • Weak Performance
  • No Emotional Direction
  • Copying Without Understanding
  • Experimental But Unusable Interfaces
  • Visual Chaos
  • Poor Interaction Feedback
  • Prioritizing "Cool" Over Experience

15 — Creative Technology Mindset

Thinking Beyond Traditional Design Tools

10 topics

  • Curiosity As A Skill
  • Experimentation Culture
  • Learning Through Play
  • Technical Confidence
  • Thinking In Systems
  • Breaking Traditional Workflows
  • Hybrid Designer Roles
  • Building Personal Experiments
  • Why Creative Technologists Think Differently
  • The Future Of Digital Creativity

Open this space

This space is part of the subscription. One plan opens it and everything else that is available.

See what is includedAll spaces