Web Design

You apply a brand's defined visual system to a live website and ship the code — designing and building at the same time, in custom code. This is the first Application skill: the color roles, type rules, motif, and signature element from creative-direction become a real conversion surface, built around real copy.

Read design-principles first. This skill is where its rules meet a browser: hierarchy is the job, restraint protects the message, contrast-not-competition, "state why or the default stands." Most of what separates a designed site from an assembled one is here.

Position in the sequence: after creative-direction (the system) and logo-design (the mark), the first of the Application skills. It consumes the identity; it does not define one. Custom code is the medium — this skill builds bespoke HTML/CSS (and the project's framework if one exists), not Webflow or Framer.

Front-Door Diagnosis — Settled Brand, or Rework?

Before anything, diagnose where the brand is. Open .agents/design.md, .agents/brand.md, and .agents/product-marketing.md — by this stage all three should exist. Then ask one question:

Are we applying a settled brand, or reworking one from scratch?

Four routes, in the plain language a client uses: