Git for Designers
Git tracks changes to your code over time. Think of it as unlimited undo with labels — you can always go back to any previous version.
Why This Matters
Have you ever had this happen?
homepage_final.fighomepage_final_v2.fighomepage_final_v2_ACTUALLY_FINAL.fighomepage_final_v2_ACTUALLY_FINAL_revised.fig
Version control solves this. Instead of file copies, you save snapshots called “commits” with notes about what changed. One file, infinite versions, complete history.
Save points for code
Every commit is a save point. Tried something that didn’t work? Roll back to the previous commit. Made a mistake three hours ago? Find the commit before the mistake and restore it.
Automatic with Claude
Here’s the good news: Claude handles most git operations for you. When you ask Claude to commit changes, it does the git commands. When something breaks, you can ask Claude to help you recover.
You don’t need to become a git expert. You need to understand the concepts and know when to ask Claude to make a commit.
Core Concepts
Repository (repo)
Your project folder with git tracking enabled. Claude sets this up when you start a new project. Everything lives in this one folder.
Commit
A snapshot of your code at a point in time. Each commit has:
- The actual changes made
- A message describing what changed
- A timestamp
- A unique ID
Good commits are like save points you can name. “Added save button” or “Fixed color picker bug” — messages that help future-you understand what happened.
Staging
Before you commit, you “stage” the changes you want to include. This is like selecting which files to save. Usually you stage everything that relates to what you just worked on.
Branch
A parallel version of your code. The main branch is the primary version. You might create a new-feature branch to experiment without affecting main. When the feature works, you merge it back.
For simple projects, you often just work on main. Branches become useful as projects grow.
What Claude Handles for You
When you’re working with Claude, you can just ask for what you need:
Commit these changes with a message about adding the settings screen
Create a new branch for experimenting with the redesign
Show me what files have changed since the last commit
Claude translates your intent into the right git commands. You don’t need to memorize syntax.
Essential Commands
Sometimes you’ll see Claude run these or want to do them yourself. Here’s what they mean:
| Command | What it does |
|---|---|
git status | Shows what’s changed since last commit |
git add . | Stages all changed files |
git commit -m "message" | Creates a commit with your message |
git push | Uploads commits to GitHub |
git pull | Downloads latest changes from GitHub |
git log | Shows commit history |
The basic flow
# See what changed
git status
# Stage everything
git add .
# Commit with a message
git commit -m "Added save button to header"
# Push to GitHub
git pushBut remember — you can just tell Claude “commit these changes” and it runs the right commands.
When to Commit
Think of commits as save points. When should you save?
Commit after completing something
Just got a feature working? Commit.
Commit this — the color picker is working now
Commit before experimenting
About to try something risky? Commit first so you can roll back.
Commit everything first, then let’s try a different approach for the animation
Commit at the end of a session
Stopping for the day? Make sure everything is committed.
Commit all my changes with a message summarizing what we did today
Don’t wait too long
Small, frequent commits are better than rare, massive commits. If you’ve done a lot of work, commit in chunks:
Commit the navigation changes first, then commit the styling updates separately
Recovering from Mistakes
Things will go wrong. Git makes recovery possible.
See what changed
What’s changed since my last commit?
Claude shows you the differences. This helps you understand what happened.
Undo uncommitted changes
If you haven’t committed yet and want to start over:
Discard all changes since the last commit
This reverts to your last save point. Only works for uncommitted changes.
Go back to a previous commit
If you committed something that broke things:
Show me the last few commits
Then:
Go back to the commit from before we changed the API
Claude can help you navigate the history and restore earlier versions.
Recover deleted code
Even if you deleted something and committed, the old version exists in history:
I deleted the helper function we had before. Can you find it in the git history?
Git keeps everything. The history is searchable.
Working with GitHub
GitHub is a website that stores your repositories online. Benefits:
- Backup — Your code isn’t only on your laptop
- Sharing — Others can see and contribute
- Deployment — Many services deploy directly from GitHub
Pushing to GitHub
After committing locally, push to upload:
Push these changes to GitHub
First time? Claude helps you create the repository on GitHub and connect it.
Pulling from GitHub
If you work on multiple computers, or collaborate with others, pull to get the latest:
Pull the latest changes from GitHub
When Things Get Confusing
Git can get complicated with merges, conflicts, and branches diverging. Here’s how to handle it:
Ask Claude for help
I’m confused about the git situation. Can you explain what’s happening?
Claude can analyze the state and explain it in plain terms.
When in doubt, commit what you have
If things are working but you’re confused about git state:
Let’s commit everything that’s working right now before we sort out the git stuff
Get to a stable save point first, then figure out the rest.
Start fresh if needed
Sometimes the cleanest solution is to start over with git:
Can we create a fresh git repository for this project? Keep all the current files but start the git history over.
This loses history but can be worth it if the repo got into a confusing state.
Common Situations
”I want to try something experimental”
Create a new branch called "experiment" and switch to itNow you can experiment freely. If it works, merge back to main. If not, just switch back to main and the experiment disappears.
”My collaborator made changes”
Pull the latest changes from GitHubIf their changes conflict with yours, Claude helps you resolve it.
”I broke everything”
Show me recent commits and what they changedFind the last good one, then:
Let's go back to that commit and start fresh from there“I want to see what I did last week”
Show me all commits from last week with their messagesGit history is searchable. You can find any previous state.
Key Takeaways
- Commits are save points — Make them often
- Claude handles the commands — Just describe what you want
- Everything is recoverable — Git keeps complete history
- When confused, ask Claude — It can explain the current state
- Push to GitHub — Backup your work off your laptop
You don’t need to master git. You need to know that commits are save points, make them regularly, and ask Claude for help when something goes wrong.