logo-maker — understand the project, then make a mark worthy of it

A repeatable method for designing logos that look engineered, not generated. The output target is an Apple-grade mark: so simple you could redraw it from memory, instantly legible at any size, often abstract — but every part means something true about the product.

The two unbreakable rules

1. Understand the project before you draw. A logo is an argument about what the product is. You cannot make that argument until you know the product. Always run Phase 0 below.
2. Meaning over decoration. No slop. If the mark is a system-font letter on a gradient, a stock object (book/bubble/globe/rocket), an app-tile widget, or shapes that mean nothing — it is rejected and redrawn. See the slop test.

Phase 0 — understand the project (never skip)

Before any pixels:

• Read the product. Open the repo: README, package metadata, the landing page / app shell, existing brand tokens (colors, fonts in CSS). If it's not code, read whatever describes it.
• Answer five questions in writing:
  1. What does it do, in one sentence a stranger would understand?
  2. Who is it for, and what world does that audience live in?
  3. What is the one idea the mark must carry? (Not three — one.)
  4. What is its name really saying? (Literal meaning, language roots, a letter worth owning.)
  5. What would be the obvious, lazy, slop version — so you can refuse it?
• List 4–6 concrete nouns/verbs from the product's world. These are glyph candidates. Cross out any that are clichés for the category.

Only when these are answered do you proceed.

The Apple test (apply to every candidate)

A mark ships only if it passes all four:

• One breath. You can say what it is in one short phrase.
• From memory. Someone could sketch it after seeing it once.
• Abstract-but-anchored. It can be non-literal, but it resolves to a real meaning when explained — never "it just looks cool."
• Survives 16px. The silhouette still reads at a favicon.

The seven craft principles

1. Free-standing first. Prefer a bare letterform / monogram / symbol that stands on any surface. Reserve the rounded-square "bezel" container for when an actual app icon is explicitly required — otherwise it reads as a widget, not a logo. (This is the most common slop tell.)
2. Flat, not glossy. Two flat colors read "brand"; gradients, bevels and inner-glows read "app tile." Depth comes from the idea, not effects.
3. Build from primitives. Rounded rects (pill radius rx ≈ ½ w), circles, simple Béziers, on a fixed grid. One signature tilt (e.g. −15°) is the system's fingerprint. 2–4 shapes per glyph; if it needs >6, it's too busy.
4. Own one letter (often). The strongest tech marks are one charged letterform. Make that letter unmistakably this brand.
5. Ration the color. Ink + paper + exactly one accent, ideally the brand's namesake or signal color. The accent marks the one thing that matters.
6. Wear the medium's texture, quietly. Borrow the product's own surface (paper grain, screentone, waveform) at low opacity — felt, never loud.
7. Verify by looking, not by reading SVG. Screenshot every candidate and judge it with your eyes. Iterate until it reads.

Process

1. Phase 0 — understand the project (above).
2. Derive the philosophy — one paragraph + the principles in the brand's voice. (Showcase section 01.)
3. Palette & type — ink, paper, one accent (+ deep/bright variants); a distinctive display + clean sans, never Inter/Arial/Roboto. See references/palette-and-type.md.
4. Construct the marks — 3–10 candidates, each one idea, on the shared grid. Mostly free-standing. See references/construction.md.
5. Verify — headless-Chrome screenshot + the Apple test + the 16px row. Fix or cut anything that fails. The verify loop is in references/construction.md.
6. Assemble the showcase — fill assets/identity-template.html: the numbered 01–07 page (philosophy, mark, construction, variations, wordmark, legibility, palette). Open it in the browser.
7. Ship production assets — chosen glyph as clean SVG + favicon + PWA icons. See references/output.md.

Flagship technique (start here)

The single most reliable way to hit an Apple-grade, meaningful mark:

Take the letter the brand owns, then fill or build it from the product's own visual grammar. A reader app → the "A" built from stacked page-panels with one accent panel. An audio app → the letter carved by a waveform. A finance app → the letter ruled like a ledger. The letterform gives instant legibility; the medium's grammar gives the meaning. One accent marks the one thing that matters.

This is the highest-hit-rate pattern — lead with it, then explore others.

Generate many, ship few

Quality is a filtering problem, not a generation problem.

• Produce 8–12 candidates, each a different idea on the same letter/grid.
• Run every one through the Apple test + a screenshot. Most will fail — that is expected and correct.
• Cut the failures. Do not pad the deliverable with weak marks to hit a count. Present only the ones that read, and name a single clear recommended pick.
• A deck of three strong marks beats ten where seven are slop.

The slop test — reject if ANY are true

• A plain letter in a system font (Arial/Helvetica/Inter/Roboto).
• A multi-stop rainbow gradient doing the work instead of a shape.
• A literal stock object for the category (book, speech bubble, globe, rocket, lightbulb, gear) with no twist.
• Boxed in a glossy rounded square so it looks like an app widget.
• More than one accent color, none of which means anything.
• Dissolves into a blob at 16px.
• The symbol could belong to any product in any industry.
• You can't explain in one sentence what it means about this product.

Reference files

• references/construction.md — the grid, primitive vocabulary, the signature tilt, worked letterform examples, and the headless-Chrome verify loop.
• references/palette-and-type.md — color rationing + type pairings.
• references/output.md — exporting SVG, favicon, PWA, .icns.
• assets/identity-template.html — the numbered showcase to fill in.
• examples/azure-scans.html — a worked output (a manga/manhwa reader): ten free-standing "A" constructions, each a single meaning, one azure accent.