project quicknotes

Step 1: Starting

System Text-to-Speech Ready
Slide: 0:00 / 0:00
Slide 1 of 0Interactive Deck

Full Lesson Reference

Create the Xcode project for a macOS menu bar app.

Create the Project

Open Xcode and create a new project:

  1. Open Xcode
  2. Click "Create New Project"
  3. Select macOS at the top
  4. Choose App
  5. Click Next

Fill in the details:

  • Product Name: QuickNotes
  • Organization Identifier: com.yourname
  • Interface: SwiftUI
  • Language: Swift

Click Next, save to your Desktop, and Create.

Run It

Press Cmd + R. A window should appear with "Hello, world!" — the default template.

We'll replace this with a menu bar app, but first let's confirm everything compiles.

Start Claude Code

Open Terminal:

terminal
cd ~/Desktop/QuickNotes
claude

Tell Claude about the project:

terminal
I'm building a macOS menu bar app called QuickNotes.
It should live in the menu bar — no dock icon, no main window.
When you click the menu bar icon, a popover appears with a text editor.

Let's start by converting this default app to a menu bar app:
- Remove the main window
- Add a menu bar icon (use a note/pencil SF Symbol)
- Show a simple popover when clicked that says "QuickNotes"
- Hide the dock icon

Create CLAUDE.md

Create a CLAUDE.md file for this macOS menu bar app project.

Optional: Want Claude to follow Apple's design conventions automatically? Add the Apple HIG skill file to your project root and reference it from your CLAUDE.md. It teaches Claude about SF Symbols, system fonts, and native macOS patterns.

Checkpoint

By now you should have:

  • Xcode project created
  • App compiles and runs
  • Claude Code connected
  • CLAUDE.md created

What You Learned

  • Creating a macOS Xcode project
  • Running a Mac app from Xcode
  • Menu bar apps have no main window

Exercises

  1. Create the QuickNotes Xcode project with the exact settings above and run it with Cmd + R to confirm the "Hello, world!" template compiles.
  2. Paste the project-intro prompt into Claude Code and review the changes it proposes before accepting them.
  3. Run the CLAUDE.md prompt, then open the generated file and add one line describing your own design preferences for the app.