Core principles for working with the skill

A short list of principles that decide the quality of the output. Each one is unpacked in the sections below.

• More context = less guessing. The more you give, the better the output. You can also treat it as discovery and ideation, in which case a minimum is enough.
• The decision is yours. The skill shows options with trade-offs, you choose.
• Watch the confidence markers. 🟢 green is fine as-is, 🟡 yellow needs a check, 🔴 red needs to be filled in before you move on.
• Question the output. Ask "why", request alternatives, tell it to cut.
• Split the project across sessions. 1 deliverable = 1 session. The chat context has a limit.
• The skill is also a consultant. Ask about methodology, ask it to sanity-check your decisions.
• Files = project memory. Decisions are saved in the HTML side panel. That is your bridge between sessions.
• Not sure how? Ask the skill. It knows its own process and will suggest the next step. You do not have to figure it out alone.

You get a set of AI assistant files in variants for different platforms.

• ux-designer-claude/ - Claude Projects (system prompt + knowledge files)
• ux-designer-chatgpt/ - ChatGPT Custom GPT (Instructions + knowledge files)
• ux-designer-gemini-gem/ - Gemini Gems (system prompt + knowledge files, max 10 files)
• ux-designer-ide/ - Claude Code, VS Code, Cursor, Antigravity and other IDEs compatible with the AGENTS.md spec

The skill runs on multiple platforms, but they differ in collaboration quality. Desktop (IDE) versions are usually more comfortable than browser chat. The skill has more control over files, sticks to the process better, and you do not lose context when a file gets large.

• check_circleStrongest recommendation: Claude Code. Wide context window, deeper reasoning than the other models, very good at writing copy. Sometimes a bit slower. An acceptable trade-off for the quality.
• check_circleSolid alternative: VS Code with an LLM plugin (Claude Code, OpenAI Codex, Google Antigravity, Cursor). Full control over files, the skill sticks to the process reliably, easy to come back to the project between sessions.
• infoOK: web versions (Claude Projects, ChatGPT Custom GPT, ChatGPT Projects). Simple to start with, but limited when working with files. Chat handles long documents less well, and you have to re-upload files more often.
• blockAvoid: Gemini Gems (web). It tends to go off-script. It skips instructions, does things its own way, and drifts from the process more often. If you must use it, turn on Canvas (otherwise HTML will render as code).

Pick a platform and follow the instructions. Takes 2-3 minutes.

Type "start" in the chat. The skill will introduce itself and lead you from there. The more context you give upfront, the less it has to guess, but a single sentence is enough.

• If you have a client brief, paste it in. The skill will pull out personas, goals, and differentiators
• Watch the confidence markers (🟢🟡🔴). Green is fine as-is, yellow needs a check, red needs to be filled in
• If the skill misjudged the awareness level, correct it. That changes the whole strategy for the site

The skill shows options with trade-offs. You do not need to know which one is better. Read what each one optimizes for and what it gives up.

• Do not be afraid to mix. "Take the headline from option 2 and the body from option 4" works fine
• If none of the options fit, say why. The skill will propose new ones
• Say "help me decide" when you get stuck. The skill will summarize the pros and cons

Copywriting takes the most time, and this is where the biggest gap between average and great output shows up. AI writes generically unless you give it specific guidance.

• Drop in samples of writing in your style. The skill will pick up the tone, rhythm, and vocabulary
• If you have language guidelines (tone of voice, brand book), hand them over upfront
• Do not accept the first version. Ask for alternatives: "give me 3 variants of this headline"
• Push back on the copy. Ask why it picked that phrasing
• Sanity-check copy against the audience. The skill knows the persona, but you know the client

The skill is not infallible. Your knowledge of the client and the market matters more than its patterns. Push back, ask for alternatives, rein it in when it writes too much.

• "Why is there no section X here?" The skill will explain whether it skipped on purpose or did not consider it
• "Do we still need this?" When a section starts to look redundant after changes elsewhere
• "Give me alternatives" forces options instead of a single answer
• "First identify the point of this item" before changing the text, understand what it is meant to communicate
• "Cut it down." AI writes too much, rein it in
• "Does this overlap with X?" The skill will check for redundancy
• "Critique this wireframe" puts it in audit mode and surfaces weak spots
• If you do not know what comes next, ask the skill. It knows the process and will suggest the next step

The skill thinks for a while because every step processes a lot of context: domain documentation, frameworks, patterns, your files. Time depends on how much input it gets. The more you give, the faster. The longest part is the back-and-forth on section copy, but it is still faster than doing all of it by hand in Figma.

• Discovery + strategy: 10-30 min
• Communication foundations: 1-3h
• Mapping an existing subpage: 5-15 min
• Wireframing a single subpage, section by section: 30-60 min of discussion
• Quick questions, small tweaks: a few seconds
• If you see the skill "thinking", wait. Interrupting bounces you back to the start of the step.

The main deliverable is HTML files. You open them in a browser and show the client without Figma. Every HTML has a Markdown download button, so you have an AI-tool-ready version one click away, without asking the skill to export.

• HTML files: wireframe, project plan, communication foundations, draft messaging. Open in a browser, the client does not need Figma
• Markdown in one click: every HTML has a button that downloads a .md file ready for another AI tool. Faster than asking the skill to export
• Export via the skill: when you want a specific fragment or a custom format, ask directly
• Wireframe to Figma AI: download the .md, paste it as context, get a visual wireframe in minutes
• Wireframe to Google Stitch / Gemini: an initial design with finished copy
• Wireframe to Cursor / Bolt: your vibe-coding assistant gets a plan instead of guessing
• Project plan as a brief for an agency: print the HTML or send a link
• Decisions (HTML side panel) as client documentation: show why each decision was made

The skill reads files. It does not remember the conversation. Anything important has to live in the files.

• After a break, start with "continue from the wireframe". The skill will read the files and pick up the context
• If you changed something in a file by hand, tell the skill. Otherwise it will overwrite your changes
• Decisions are saved in the HTML side panel next to the wireframe. That is your memory between sessions

One big project is too much for a single session. Chat context has a limit. Past about 40% fill, the skill starts losing details, forgetting earlier decisions, and answering less precisely. Break the project into chunks: one deliverable per session.

• Discovery + strategy in session 1. Copy in session 2. Wireframe in session 3. Each session closes one piece.
• Restart the session when answers turn vague or the skill forgets earlier decisions. That is the signal that context is full.
• Decisions are saved in the HTML side panel next to the wireframe. That is your memory between sessions.
• After a break, say "continue from X". The skill reads the files and recovers the context.

The skill has 16 page types, 13 UX frameworks, and research-backed patterns in its backpack. It is not only an executor. It is also a consultant. It will sanity-check your decisions and explain the methodology.

• "Sanity-check my decision" gets a skeptical look at your version and a proposal for what to improve.
• "What should section X contain?" The skill knows the patterns. Treat it like a UX consultant.
• "How should this be done according to methodology Y?" You get an answer referencing the frameworks.
• "Critique this wireframe" runs audit mode and surfaces weak spots.

A few things that drag the quality of the output down.

• Do not accept everything with a quick "ok". The skill will push on, but the output will be worse
• Do not skip Discovery. A wireframe without context is guesswork with nicer formatting
• Do not try to do everything in one session. 2-3h per project is a realistic pace
• Do not copy deliverables without reading them. The skill makes assumptions. You verify

The skill has a built-in feedback channel. A normal conversation is enough, no forms, no account. It works only on desktop (IDE) versions: Claude Code, Cursor, VS Code with an LLM plugin, Antigravity. On web versions, use the email contact below.

Questions? Email tomasz@creativesparks.pl