Use when a premium website build needs build-coupled UX and visual-quality orchestration before design-system and page-builder; use the external design-system-skills engine for general visual doctrine.
Use when a premium website build needs build-coupled UX and visual-quality orchestration before design-system and page-builder; use the external design-system-skills engine for general visual doctrine.
Upstream website skills and external design doctrine
yes
Define an implementable experience direction
Stop when strategy or content hierarchy is absent
Workflow
Load the external design doctrine and validate upstream strategy
Choose hierarchy, interaction, typography direction, states, and responsive behaviour
Test distinctiveness, accessibility, multilingual growth, and low-bandwidth constraints
Stop on a banned default or unsupported pattern, repair the direction, then hand decisions to design-system and page-builder.
Outputs
Artefact
Consumer
Acceptance condition
Premium UX direction and implementation brief
Design-system and page-builder
Names type rationale, hierarchy, components, states, breakpoints, motion limits, and quality risks
Evidence Produced
Evidence
Consumer
Acceptance condition
Decision and review record
Design and release owners
Links each major visual choice to brand, behaviour, accessibility, or performance evidence
Capability Contract
Read, search, and visual inspection are required. Planning is read-only by default; editing design artefacts or code requires implementation authority. Asset licensing, external publication, spending, and production mutation require explicit authority.
Degraded Mode
Without rendering, fonts, assets, or the external doctrine, return the narrowest qualified direction, mark visual checks not assessed, and do not certify premium quality.
Decision Rules
Choice
Action
Failure or risk avoided
Brand and content justify a distinctive display face
Specify it with performance fallback
Generic AI-default typography
Interaction adds no task value or harms 3G use
Remove or simplify it
Decorative friction
Quality Standards
State the chosen typeface and reason before visual production; cover error, empty, loading, focus, and disabled states; meet accessibility and Africa performance constraints.
Anti-Patterns
Choosing Inter or a bare system stack as the primary face. Fix: select a brand-fit permitted face and document why.
Using a purple gradient as premium shorthand. Fix: derive colour and contrast from brand evidence.
Designing only the homepage. Fix: define shared patterns for every template family.
Ignoring non-happy states. Fix: specify error, empty, loading, focus, and disabled behaviour.
Certifying quality without renders. Fix: mark visual assessment not assessed and require visual QA.
Worked Example
For a Kampala advisory firm, choose a licensed editorial serif supported by its authority positioning, pair it with a compact sans for mobile utility, and test both under the 3G font budget before handoff.
references/mobile-dashboard-website-patterns.md - mobile navigation, first-visit guidance, dashboard/proof presentation, and mobile quality checks.
references/premium-website-gate.md - scoring and blocking defects.
../premium-website-product/references/premium-website-market-asset-gate.md - website-as-premium-product, content, SEO, launch, stack, and agency proof gate.
references/source-register.md - provenance disposition and rights gate; no active source path is asserted.
World-class UX foundations (book-derived)
Required reading before kicking off a premium engagement:
references/levy-four-tenets.md — Four-tenet framework (Business Strategy + Value Innovation + Validated User Research + Killer UX Design); Top-10 anti-patterns to reject in client briefs.
references/enterprise-five-outcomes.md — Five mandatory outcomes (Useful / Easy / Efficient / Pleasing / Accessible) as a pre-launch gate. One No = no launch.
references/pm-collaboration-rules.md — Fekeshazi 5+1 (5-10 min to explain, design as ongoing process, etc.) and the "don't hide important functions in menus" rule.
If a brief fails Levy's Top-10 check or omits any of the 5 outcomes, push back before scoping.
