Design clear, distinctive web interfaces
Honest web-design reasoning for agents — structure before ornament, real content first, complete states and semantics, accessibility as evidence, and no redesign for novelty's sake
- What
- Honest web-design reasoning for agents — structure before ornament, real content first, complete states and semantics, accessibility as evidence, and no redesign for novelty's sake
- Cost
- Free
- Needs
- a website or web-app design task (new interface, visual change, or design audit) — the skill is design reasoning the agent follows, not software to install
- Install
- Copy the installer prompt below into your Muse — your agent does the rest.
Selected by Skill Harbor — short listing (the repo states no license, so no content is reproduced): @tristanmanchester's designing-beautiful-websites skill — clear, distinctive web interfaces built from real content and behavior, with the thesis that beauty is not one universal palette or an obligation to remove all decoration. It covers establishing the actual design task (user, purpose, journey, constraints — stay local for a polish request, implement the deliverable for a new site, don't claim to have interacted with a page seen only in a screenshot), structure before ornament (trace the key task, design information order for narrow screens/zoom/keyboard, not a scaled-down desktop screenshot), a visual point of view (one intentional aesthetic direction from the brief — not a template applied regardless of it; type/size/spacing hierarchy before decoration; restrained purposeful motion with reduced-motion fallbacks; no fake client logos, reviews, awards or statistics), complete states and semantics (buttons vs links, form errors recoverable, proper menu/dialog/tab patterns), targeted accessibility checks (a contrast ratio or automated scan is evidence, not a certificate), and honest inspection/testing rules (a heuristic walkthrough is not a user test; a test plan is not a completed test; never claim unsupported performance or conversion improvements). Progressive reference loading (visual-design, information-architecture, interaction, content, responsive, accessibility, design-audit, page-patterns) rather than mandatory output formats. Honest caveats: design reasoning only — implementation and browser checks depend on the project's tools; the authoring baseline was reviewed against agentskills.io in 2026-09; license not stated by the source repo — short listing with a link only, nothing copied. Skill Harbor never reviews the code, review it yourself before use. Discovered via skills.sh.
Version:
Install
Prerequisites: a website or web-app design task (new interface, visual change, or design audit) — the skill is design reasoning the agent follows, not software to install Install "Design clear, distinctive web interfaces" for me. It gives my agent @tristanmanchester's designing-beautiful-websites skill: establish the actual design task, structure before ornament, one intentional visual point of view, complete states and semantics, targeted accessibility checks, honest inspection/testing rules, and progressive reference loading (visual, IA, interaction, content, responsive, accessibility, audit). IMPORTANT: the repo states no license — fetch from the link only, and reproduce nothing beyond the link. Repository: https://github.com/tristanmanchester/agent-skills/blob/main/designing-beautiful-websites/SKILL.md 1. Fetch the SKILL.md file (and any helper files) from the repository path into a temporary folder and summarize what it does in one or two sentences. 2. Safety check: review the SKILL.md and scripts for anything suspicious (unexpected network calls, shell commands, credential harvesting). This repo should contain zero secrets in code. Verify that holds here; STOP on any red flag and tell me. 3. Install it as a skill: copy SKILL.md and its helper files into the agent's skills directory, in a folder named "designing-beautiful-websites". 4. Verify with no network calls: frontmatter valid, files in place. 5. Report what was installed, where, and what I still need to do myself (e.g. describe the design task and supply real content or screenshots; nothing else — it's reasoning). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me.
Questions
How do I install a build?
Every product page includes a copy-paste install prompt. Paste it into your Muse and it sets the build up for you — no manual configuration.
Where does my money go?
Straight to the seller. Skill Harbor never processes payments: checkout happens on the seller’s own page, usually Stripe.
What does the ✓ next to a creator’s name mean?
It means we confirmed the identity of the person behind the listing. It says nothing about the code itself — always check a build before installing it.