Tag · 21 guides
Automation
Every guide tagged automation, sorted by most recent.
CO Codex Skills vs Plugins: What Designers Actually Need
Skills teach Codex how to run your workflow. Plugins connect Codex to tools and package reusable setups. Here is the practical designer version, with examples for design QA, docs, inbox triage, and design-system audits.
SE Set Up Codex for Designers
OpenAI Codex is a coding agent you can use from the app, terminal, IDE, cloud, and mobile. This designer-friendly setup guide shows what to install, what to connect, and the first safe tasks to run.
5 GitHub Actions Every Designer Should Automate
You do not need to become a DevOps person. Five small workflows that catch broken tokens, build your docs site, lint your code, and turn random scripts into one-click tools.
HO How to Create Custom Skills for Claude Code
Build reusable slash commands that teach Claude Code your workflows, writing voice, and design system rules. No coding required.
Set Up Claude Code (Step by Step for Designers)
Install Claude Code, open it in a folder, and run your first AI tasks. No coding background, no terminal experience needed. Just follow along.
AU Audit a Design System in 30 Minutes
A step-by-step workflow to audit any design system using AI tools. Check token naming, component health, accessibility, and visual consistency in one session.
CL Claude Skills vs Cowork: What's the Difference?
Skills teach Claude how to do design work. Cowork runs Claude on more work at once. Here's when to reach for each, with five copy-paste skills designers actually use.
AU Automate Browser Testing Without Writing Code
Screenshot your whole design system, catch visual bugs before they ship, and audit every page automatically, using Playwright without touching a test file.
PR Prompting Basics for Designers
Write better prompts for AI tools. Practical patterns for design work: component generation, token audits, documentation, and more.
UN Understand MCP in 10 Minutes (and Why It Changes Your AI Setup)
The one protocol that lets AI read your Figma, GitHub, and docs directly. A plain-English explainer for designers, with examples of what it unlocks in real work.
How I Wake Up to Fresh YouTube Transcripts in Obsidian
A practical walkthrough of the small automation flow I use to collect new YouTube videos overnight, turn their captions into markdown transcripts, summarize the useful ones, and sync everything into Obsidian before I start work.
Build Free Design System Docs with Astro Starlight
Mintlify is $120 a month. Supernova is enterprise pricing. Astro Starlight is free, fast, and good enough for most design system teams. Here is the full setup, the styling, the Figma embeds, and the AI-assisted automation.
Automate the Boring Parts of Your Design System
Most design system problems are not caused by lack of intention. They are caused by inconsistent execution. GitHub Actions fix that by running the boring parts every single time.
How to Use GitHub Actions With AI
AI is good at generation. GitHub Actions are good at repeatable execution. Pair them and you get the reliability layer most AI-assisted design workflows are missing.
How to Create a GitHub Action (and Why It Matters)
If you already use GitHub, Actions give you a way to say 'when this happens, automatically do this'. A step-by-step beginner guide for designers.
Generate Component Documentation with AI
Use Claude Code, Codex, Cursor, or another repo-aware AI tool to scan your component library and generate specs, props tables, and usage guidelines in minutes.
Set Up a Token CI/CD Pipeline
Build an end-to-end pipeline from Figma to npm: Tokens Studio syncs to GitHub, Style Dictionary transforms, GitHub Actions publishes.
Pull Component Data from the Figma API
Programmatically access your Figma components, styles, and variables. Build audits, reports, and automations on real data.
Automate Design Token Publishing with GitHub Actions
Auto-publish your design tokens on every push. No more manual exports, no more out-of-sync code.
ST Stop Being Afraid of the Terminal
A designer-friendly walkthrough of the black screen, the commands you actually need, and why the most powerful AI tools live here.
SE Set Up Figma MCP for Design-to-Code
Complete guide to configuring the Figma MCP server with Cursor and Claude Desktop. Connect your designs directly to your AI coding tools.