Why the Terminal
- Speed — Rename 500 files in seconds instead of clicking through each one.
- Automation — Image optimization, file conversion, and build steps become one-liners.
- Tool access — Figma plugins, font utilities, and static site generators run from the terminal.
- Version control — Git is how teams collaborate on code, content, and design tokens.
Getting Started
Opening Terminal
Press Cmd + Space, type Terminal, and hit Enter. Or find it in Applications > Utilities > Terminal.
Anatomy of a Command
command -flag argument
| Part | What it does | Example |
|---|---|---|
| Command | The program you’re running | ls |
| Flag | Modifies behavior | -l |
| Argument | What you’re acting on | ~/Desktop |
So ls -l ~/Desktop means: list the contents of my Desktop in long format.
Essential Commands
Navigating Files
| Command | What it does | Example |
|---|---|---|
pwd |
Print where you are | pwd |
ls |
List files here | ls |
ls -la |
List all files with details | ls -la |
cd |
Change directory | cd ~/Projects |
cd .. |
Go up one level | cd .. |
cd ~ |
Go to home directory | cd ~ |
Drag a folder from Finder into Terminal to paste its path automatically.
Working with Files and Folders
| Command | What it does | Example |
|---|---|---|
mkdir |
Create a folder | mkdir new-project |
touch |
Create an empty file | touch index.html |
cp |
Copy a file | cp logo.png backup.png |
cp -r |
Copy a folder | cp -r assets/ backup/ |
mv |
Move or rename | mv old.sketch new.sketch |
rm |
Delete a file | rm unused.png |
rm -r |
Delete a folder | rm -r old-project/ |
open |
Open in default app | open mockup.fig |
open . |
Open folder in Finder | open . |
rmdoes not move files to the Trash. They are permanently deleted. Double-check before running it.
Workflows for Designers
Batch Rename Files
Rename every .jpeg to .jpg in the current folder:
for f in *.jpeg; do mv "$f" "${f%.jpeg}.jpg"; done
Resize Images with sips
Built into macOS. Resize all PNGs to a max width of 1200px:
sips --resampleWidth 1200 *.png
Convert HEIC to JPG
for f in *.HEIC; do sips -s format jpeg "$f" --out "${f%.HEIC}.jpg"; done
Optimize Images
If you have ImageOptim installed:
open -a ImageOptim *.png
Generate a File Tree
Useful for documentation or project overviews:
find . -not -path '*/.*' | head -50
Git for Designers
Git tracks changes to files so you can collaborate, undo mistakes, and keep a complete history of your work.
First-Time Setup
git config --global user.name "Your Name"
git config --global user.email "you@example.com"
Daily Workflow
git status
git add .
git commit -m "Update hero section layout"
git push
Common Scenarios
| I want to… | Command |
|---|---|
| Clone a project | git clone <url> |
| Create a branch | git checkout -b feature/new-icons |
| Switch branches | git checkout main |
| Pull latest changes | git pull |
| See commit history | git log --oneline |
| Undo changes | git checkout -- filename |
Installing Tools
Homebrew
The Mac package manager. Install it once:
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
Then install tools:
brew install node # Build tools and scripts
brew install ffmpeg # Video and audio conversion
brew install imagemagick # Advanced image processing
Node.js and npm
Many design tools and static site generators run on Node:
npm install -g live-server
Customizing Your Terminal
Oh My Zsh
Makes your terminal more readable and pleasant to use:
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
Aliases
Add shortcuts to your ~/.zshrc file:
alias ll="ls -la"
alias proj="cd ~/Projects"
alias gs="git status"
alias gp="git push"
After editing, reload with source ~/.zshrc.
Quick Reference
| Action | Command |
|---|---|
| Where am I? | pwd |
| List files | ls -la |
| Go to folder | cd folder-name |
| Go up | cd .. |
| Create folder | mkdir name |
| Create file | touch name |
| Open in Finder | open . |
| Open file | open file.png |
| Copy | cp source dest |
| Move / rename | mv source dest |
| Delete file | rm file |
| Git status | git status |
| Git commit | git commit -m "msg" |
| Git push | git push |
| Clear screen | clear |
| Cancel command | Ctrl + C |