# Getting Started with GalleryPlanner

The fastest way to start a gallery wall in GalleryPlanner is to set your wall size, add the frames you own, and place a rough layout in a few minutes. This quick-start guide shows you the shortest path from blank canvas to first draft.

## What You'll Need

Before you begin:

- **Wall measurements:** Width and height of the area where you want your gallery wall
- **Frame inventory:** Dimensions of the frames you own (or plan to buy)
- **5 minutes:** That's it!

**New: Guided Setup.** Starting a new project on desktop or mobile now opens Guided Setup (unless you've turned it off in Settings) — a five-step walkthrough that covers this exact flow: pick a wall size and color, add frames and choose an Auto-Layout (or apply a Starter Layout and keep it as is), then optionally add photos and let Smart Fill match them to frames. Follow it and you'll land on a finished first draft without touching this guide. Prefer to explore on your own? Skip it anytime and replay it later from the Help menu on desktop or the Menu on mobile. The steps below describe the manual flow, which works the same on desktop and mobile.

---

## Step 1: Set Up Your Wall (30 seconds)

When you first open [GalleryPlanner](/), you'll see the **Wall Properties** panel (Guided Setup starts here too).

1. Enter your wall **width** (e.g., 96 inches for an 8-foot wall)
2. Enter your wall **height** (e.g., 72 inches for 6 feet)
3. Dimensions update live as you type

**Pro tip:** Measure the actual area where you want frames, not your entire wall. If you're planning a gallery wall above a sofa, measure from the top of the sofa to the ceiling.

**Not sure about dimensions?** Start with a standard 96" × 72" wall to experiment—you can always adjust later.

---

## Step 2: Add Frames to Your Library (1 minute)

Now it's time to add the frames you own (or want to buy).

**Don't have frames yet?** Skip ahead to [Start from a Starter Layout](#option-a-start-from-a-starter-layout) in Step 3. A layout puts a full set of frames on your wall, and you can swap in real sizes later.

### Using Standard Sizes

Most frames come in standard sizes. Here's how to add them:

1. On desktop, click **Add Frame** in the **Frames** panel and open the **Common** tab. On mobile, tap **Library**, then **Common**
2. Browse the common sizes: 4×6, 5×7, 8×10, 11×14, 16×20, etc.
3. Click a size to add it
4. Add another of the same size the same way (on desktop, click it again; on mobile, the picker closes after each add, so reopen **Common**). Five 8×10 frames means adding 8×10 five times

### Using Brand Presets

Buying frames from IKEA, Pottery Barn, West Elm, or CB2? Skip the tape measure:

1. Click **Add Frame** in the **Frames** panel and choose the **Brands** tab (on mobile, tap **Brands** in the Library sheet)
2. Pick a brand, then click a frame tile
3. The frame lands in your library with the real outer size and moulding already set, plus the mat opening when the frame comes with a mat

IKEA presets are free. Pottery Barn, West Elm, and CB2 are part of Pro. For every IKEA size and what print fits each mat, see the [IKEA frame size guide](/learn/ikea-frames-gallery-wall-sizes).

### Creating Custom Frames

Have an unusual frame size?

1. Click **Add Frame** in the **Frames** panel and open the **Custom** tab
2. Enter the glass size as the width and height: the size on the label (an "8×10 frame"), or the inside edge of the frame where the glass sits, not the outside edges
3. Set **Border** to the moulding width (the frame itself); GalleryPlanner adds it around the outside. For a canvas, panel, or unframed print, enter the piece's actual size and set **Border** to 0
4. Choose a frame color (black, white, wood, gold, or custom)
5. If the frame is matted, turn matting on, enter the mat opening (the window the photo shows through), and pick a mat color
6. Click **"Add to Library"**

**Example:** Let's say you have:
- 3 black 8×10 frames
- 2 black 5×7 frames  
- 1 large 16×20 frame

Add each of these to your library by clicking its size (once per frame).

### Importing in Bulk

Have a long list of frames to enter? On desktop, click **Add Frame** in the **Frames** panel and open the **Bulk** tab (on mobile, tap **Bulk** in the Library sheet):

- **Paste a list** — e.g. `8×10, 11×14, 16×20` — and GalleryPlanner parses the dimensions into frames.
- **Download CSV template** — fill in dimensions, color, mat color, label, and quantity, then upload it. The template round-trips with the Pro **Shopping List** export, so you can edit a previous project's frames and re-import them.

**Smarter Library:** Identical frames now stack automatically in your frame list. Matching frames get a separate row for each state (**Placed**, **Staged**, or still in inventory) with a count badge, so you can tell at a glance what is on the wall versus still waiting in inventory.

If you are planning around a TV, sofa, window, or other real wall feature, add Wall Objects (Pro) before you start arranging frames. On desktop, click **Add Frame** in the **Frames** panel and open the **Objects** tab. On mobile, tap **Object** in the Library sheet. Either way, that gives Auto-Layout and Smart Fill a real obstacle to work around instead of a fake locked placeholder.

---

## Step 3: Design Your Layout (2 minutes)

Now for the fun part—arranging your frames!

### Option A: Start from a Starter Layout

Want a proven arrangement instead of a blank wall? GalleryPlanner has over 100 **Starter Layouts**, from simple grids to salon walls.

1. On desktop, click **Add Frame** in the **Frames** panel and open the **Layouts** tab. On mobile, tap **Layouts** in the Library sheet.
2. Use the filter button to narrow by category, frame count, shape, or free vs. Pro
3. Click a layout, and it lands centered on your wall in your default frame color (on a staircase wall, centered above the stairs; with Pro, on a flat wall it's centered at your Eye level when it fits)
4. Change any frame's size in **Properties** to match what you own, and move or delete frames as you like

Picking another layout later asks first: **Swap layout** replaces the current one and moves your photos into the new frames, even after you've edited it, and **Add alongside** keeps both. Undo steps back either way. Most layouts are free; three collections (Curated Finds, The Townhouse Collection, and Editorial Mix) are part of Pro. For worked examples with real frame sizes and hanging tips, browse [Example Layouts](/examples).

### Option B: Place Your Whole Library Fast

If you want a quick first pass without comparing layout options:

1. Open the **Frames** panel (desktop) or the **Library** sheet (mobile)
2. Click or tap **"Place all frames"**
3. GalleryPlanner fits as many frames as it can onto the wall
4. Any extras are staged neatly below the wall so you can place or ignore them later

Staged frames are easy to spot: anything not fully on the wall shows an amber outline right on the canvas, plus a small **STAGED** badge on frames big enough to fit it.

This is the fastest way to get your real inventory onto the wall and start editing.

### Option C: Let Auto-Layout Do It

1. Open the **Auto-Layout** section in the sidebar (on mobile, the **Smart** tab)
2. Choose a layout style:
   - **Curated (Pro):** Lays out your frames like a real gallery wall, near eye level (above the stairs on a staircase wall)
   - **Grid:** Clean, organized rows and columns
   - **Masonry:** Staggered, brick-like pattern
   - **Skyline:** Frames align at top or bottom
   - **Organic:** Relaxed, asymmetrical, collected-over-time feel
   - **Center Out:** Radiates from a focal point
   - **Tidy Up:** Cleans and aligns an existing layout
3. Click **"Generate Layouts"**

In seconds, GalleryPlanner will create a balanced layout using your frame inventory. Don't love it? Click "Regenerate Layouts" for a new arrangement. Preview thumbnails match your actual wall shape, including staircase walls.

**Library shortcut:** Click a placed or staged library row to instantly select all matching frames on the canvas.

### Option D: Design Manually (More Control)

Prefer a hands-on approach?

1. **Drag frames** from your library onto the canvas
2. **Position them** where you want using click-and-drag
3. Watch the **spacing guides** as you drag: gap labels turn blue when two gaps match, and frames snap into equal spacing
4. Select a frame to reveal the **floating toolbar** above it for quick align, rotate, distribute, lock, and resize-mode actions

**Pro tip:** Start with your largest frame first—place it where you want the focal point, then build around it.

**Distribute tip:** Select 3 or more frames, then use **Distribute Horizontal** or **Distribute Vertical** from the floating toolbar to equalize the gaps between them in one click.

**Grouping tip:** Once you like a cluster, press `Cmd/Ctrl+G` to group it so the arrangement moves as one piece. Use `Cmd/Ctrl+U` or `Cmd/Ctrl+Shift+G` to ungroup later.

**Mobile pro tip:** When you're moving a frame on your phone, press and hold it for a moment first so you pick up the frame instead of panning the wall. The brief delay is normal.

---

## Step 4: Customize Your Design (1 minute)

Once your frames are on the wall, fine-tune the details.

### Adjust Frame Properties

Click any frame on your canvas to open the **Properties Panel**:

- **Position:** See exact Left and Top distances from the wall edges
- **Size:** Width and height (custom frames can be resized)
- **Rotation:** Rotate to landscape or portrait
- **Frame Color:** Change the color even after placement
- **Matting:** Toggle matting on/off
- **Mat Color:** Adjust the mat color for matted frames
- **Hanging hardware:** Tell GalleryPlanner what's on the back (Sawtooth, Wire, D-ring, Two D-rings, or Adhesive) so the Hanging Guide can list nail positions (Adhesive needs no nail)

### Add Photos (Optional)

Want to see what your gallery wall will look like with actual photos?

1. Open the **Photos** tab (on mobile, **Library → Photos**) and click **Add Photos**
2. Choose photos from your device
3. Drag a photo onto a frame (on mobile, tap an unframed photo, then tap a frame)
4. The photo fills the frame automatically

Once a photo is in a frame, the Photo properties panel gives you per-photo controls:

- **Fit** — pan, zoom, rotate the photo, or hit **Reset Crop** to recenter at 100% in the mat opening.
- **Levels** — adjust **Brightness**, **Contrast**, and **Midtone** sliders to balance how each photo reads on the wall. Tap **Auto Level** (Pro) to set all three automatically based on the photo's visible cropped region.

On mobile, these live in the **Edit** sheet: the **Fit** tab for crop and rotation, and the **Levels** tab for the brightness/contrast controls.

**Find a photo on the wall:** Lost track of where a photo ended up? On desktop, right-click its thumbnail in the **Photos** tab and choose **Show on wall** — the canvas jumps to the frame using it. On mobile, tap a placed photo in the Library sheet (with no frame selected) and the canvas jumps there.

**Privacy note:** Your photos are never uploaded to our servers. [Read our privacy policy](/privacy).

---

## Step 5: Export Your Design (1 minute)

You've created your layout—now let's export it so you can hang it in real life!

### Option 1: Hanging Guide (Pro Only)

The PDF gives you exact measurements, a graph-paper Measurement Schematic, and a frame table for the install:

1. Use **"Export"** in the desktop toolbar, or **"Share"** in the mobile bottom toolbar
2. Select **"Hanging Guide"**
3. Print it and use it as your installation blueprint

**What you get:**
- A numbered overview of your wall, with each frame marked
- A table with each frame's size, From Left and From Floor distances (From Stairs on a staircase wall), and where its center sits (plus each frame's label when any frame on the wall has one, and mat opening when a frame has a mat)
- A Measurement Schematic showing spacing and alignment
- Nail positions for every frame with **Hanging hardware** set, also marked on the Measurement Schematic

Preview example output: [Sample Hanging Guide PDF](/examples/pdf_hanging_guide.pdf)

### Option 2: Export a Snapshot Image

1. Use **"Export"** → **"Snapshot"** (desktop), or **"Share"** → **"Snapshot"** (mobile)
2. Use the image as a visual reference while hanging or shopping

**Free Standard Snapshot:** JPEG export at standard resolution with a watermark.

**4K Snapshot Export (Pro):** Ultra-HD PNG export at 3840px with no watermark.

### Option 3: Import / Export Project

Come back later to make changes, or move your project between devices:

**Access note:** **Export Project** and **Import Project** are available on all tiers.
**Free access note:** Free users can edit one project at a time. Additional imported projects open in view-only mode unless you upgrade to Pro.

1. Export your project:
   - Desktop: click **"Project"** → **"Export Project"**
   - Mobile: tap the project name at the top, then use **Export Project**
2. Download the `.gwall` file
3. Import it anytime:
   - Desktop: **"Project"** → **"Import Project"**
   - Mobile: project name → **"Import Project"**

**Backup note:** **Export Project** creates a portable copy that includes your walls, layouts, and project library. On iPhone and iPad, very large exports can still fail, so keep the file in Files or iCloud once it is ready.

**Auto-save:** GalleryPlanner saves your work in this browser on this device by default, so you can usually close the app and return later. If you prefer more control, open **Settings** and turn off **Auto-save changes** (under Editing) so project changes stay unsaved until you save them yourself. For important projects, also save a `.gwall` backup.

**Install tip:** Supported browsers can install GalleryPlanner for quicker launch (on iPhone and iPad, use **Add to Home Screen** in Safari). It doesn't replace saving a `.gwall` backup for important work. A GalleryPlanner app for iPhone is coming soon.

### Option 4: Export Bundle (Pro)

Need several outputs in one pass?

1. Open **Export Bundle** from the desktop **Export** menu or the mobile **Share** sheet
2. Choose which files you want to include
3. Run them together in one flow instead of exporting each file type separately

**Typical bundle options include:**
- Hanging Guide
- Shopping List
- Print-Ready Photos
- Snapshot Image (4K PNG)
- Export Project

---

## What's Next?

Congratulations! You've designed your first gallery wall in GalleryPlanner. 🎉

### Ready to Hang Your Wall?

Follow your exported PDF guide to install with confidence. Key tips:

- Mark nail positions with a pencil before hammering
- Use a level to keep frames straight
- Start from the center and work outward
- Step back frequently to check your progress

### Planning More Than One Wall?

A hallway plus a staircase, or a whole room? **Add Wall** (Pro) lets one project hold more than one wall, all sharing the same photo library. Your first wall is always free — adding a second wall is where Pro comes in. Learn how in our guide to [planning multiple gallery walls](/learn/planning-multiple-gallery-walls).

### Want to Learn More?

Explore these resources to master GalleryPlanner:

- **[Complete User Guide](/learn/galleryplanner-user-guide):** Deep dive into all features and pro tips
- **[Understanding Auto-Layout](/learn/understanding-auto-layout):** Learn how the layout algorithms work
- **[Gallery Wall Design Principles](/learn/complete-guide-to-gallery-walls):** Design theory and best practices

---

## Quick Tips for Beginners

### ✅ Start Simple

Your first project doesn't need to be complicated. Try a basic 3-frame horizontal row or a simple 2×2 grid to get comfortable with the tools, or apply a small Starter Layout (filter by **2-4** frames) and edit from there.

### ✅ Use Auto-Layout as a Starting Point

Even if you want full creative control, generate an Auto-Layout first to see what's possible, then adjust it manually.

### ✅ Experiment Freely

You can't break anything! Try different layouts, colors, and arrangements. If you mess up, clear the canvas and start over (**Clear Canvas** in Wall Properties on desktop; on mobile: **Edit** with no frame selected → **Clear Canvas**).

### ✅ Measure Your Frames Accurately

The most common mistake? Entering the outside edges of the frame as its size. GalleryPlanner wants the glass size (the size on the label, like 8×10) plus the border width, and it works out the outside size for you. If the frame has a mat, measure the mat opening separately.

### ✅ Check Your Design on Mobile

Planning to shop for frames later? Save a `.gwall` backup and open it on your phone. It is the safest way to carry your project between browsers or devices.

If you use GalleryPlanner often on your phone, a Home Screen shortcut keeps it one tap away while you measure walls, shop for frames, or reference your layout.

---

## Troubleshooting: First-Timer FAQs

**"I don't see my frames on the canvas after adding them to the library."**

→ You need to *drag* frames from the library onto the canvas. Adding them to the library just makes them available—placement is a separate step.

**"Auto-Layout says 'Add frames first to use Auto-Layout.'"**

→ Your library is empty. Add at least one frame and try again. If you see 'All frames locked,' unlock a frame first.

**"I can't move my frame exactly where I want it."**

→ Frames snap to a grid by default for alignment. Press `S` to toggle snap-to-grid off for free movement, or use the snap toggle in the canvas control bar.

**"Where did my project go?"**

→ Projects save locally on this device unless browser storage is cleared. If you turned off auto-save in **Settings**, use the manual save control before closing or switching projects.
→ Check that you're using the same browser. Projects are saved separately in each browser. For cross-device access, use **Export Project** and then **Import Project**.

**"How do I group frames?"**

→ Select multiple frames on the canvas, then press `Cmd/Ctrl+G` or use the context menu to group them. Use `Cmd/Ctrl+U` / `Cmd/Ctrl+Shift+G` to ungroup.

**"Where is Dark Mode?"**

→ Open **Settings** from the desktop header or the mobile menu, then choose **Light**, **Dark**, or **System** theme.

---

## You're Ready!

You now know enough to build clean, practical gallery wall layouts in GalleryPlanner. The more you use it, the faster and more confident you'll become.

[Launch GalleryPlanner →](/)

**Questions?** Visit our [Help Center](/help) or email [hello@gallery-planner.com](mailto:hello@gallery-planner.com).