Turn supplied brand content and assets into a responsive brand, B2B inquiry, or SaaS website with a runnable preview and verified delivery.
Turn supplied brand content and assets into a responsive brand, B2B inquiry, or SaaS website with a runnable preview and verified delivery.
# Website Design Build ## Task and scope Turn supplied content, existing brand assets, product information, a reference, or a current site into an editable design or runnable website. Cover brand websites, B2B inquiry sites, and SaaS marketing, pricing, sign-in, or lightweight admin pages when requested. Branding or avatar creation, core product rewrites, and complete commerce systems are outside the default scope. ## Start from what the user has Accept a brand introduction, copy, images, screenshots, URL, or repository as the starting input. Infer the audience, primary action, requested pages, delivery stage, and existing constraints. Do not require a sitemap, design questionnaire, stack choice, or Figma file. Ask only when an unknown changes the result, and continue independent content and asset work. A useful request is: “We export wedding flowers to overseas wholesalers. Use this product content and these photographs to build an English inquiry website with a working preview.” ## Workflow 1. Read supplied material completely. Preserve existing brand choices, product truth, code, user edits, and permissions. Record evidence and unknown facts separately. 2. Map visitor questions to content, proof, page sections, and the next action. Write complete copy without inventing customers, certifications, statistics, prices, or product capabilities. 3. Choose visual composition, typography, spacing, image roles, and mobile behavior from the subject and the existing brand. If a companion design Skill is selected, keep one visual direction and resolve conflicts in favor of the brief and accessibility. 4. Build the requested design or runnable pages in the existing project. Use shared components and real routes. Figma is optional. Separate decorative product demonstrations from functioning controls; distinguish UI previews from connected authentication, payments, forms, and saved data. 5. Review desktop and mobile together. Check navigation, forms, focus, long copy, missing assets, reduced motion, language, prices, and real CTA destinations. Apply feedback to affected pages and languages without replacing unrelated manual edits. A passing build does not prove visual or task correctness. 6. Deliver the requested stage through an accessible preview or files. When deployment is requested and authorized, inspect the exact deployed version, domain, and real business flow. Distinguish code, preview, merge, deployment, and production verification. ## Complete package and progressive modules Favorite this Skill and run `aident skills sync` with a bundle-aware CLI to receive the unchanged 16-file upstream package. Its local entrypoint is Chinese; read only the reference needed for this task: first-build, discovery-content, visual-design, responsive-layout, interaction-motion, conversion-flows, implementation, lightweight-admin, localization-regions, or iteration-delivery. It includes project brief, section specification, and delivery ledger templates. These files are not implied to exist after a hosted read. Without local files or a coding runtime, produce the content, scope, visual constraints, and implementation handoff that the host supports, and report the missing execution capability. Do not claim to have built or inspected a website. ## Delivery contract Return the preview or design link and runnable source location; list pages, responsive behavior, working actions, checks actually run, unresolved integrations, assumed sample copy, and deployment status. Preserve the latest approved design and keep facts traceable. A missing final contact link does not block other pages; an unconnected form must never report a successful submission. ## Source and rights Read [the pinned upstream and license](UPSTREAM.md).
