Frontend Design
Build a frontend direction from the audience, real content, and existing brand constraints; resolve hierarchy before decorative styling.
Repeatable instructions for the AI tools you build with.
Turn a process into a readable mechanical diagram: identify inputs, transformations, and outputs before choosing geometry.
Featured 1 of 3---
name: knoveya-anatomy
description: "Turn a process into a readable mechanical diagram: identify inputs, transformations, and outputs before choosing geometry. Use for matching visual design work."
---
# AnatomyRead the full instructions before installing.Interface design, motion, design systems, and accessibility.
Build a frontend direction from the audience, real content, and existing brand constraints; resolve hierarchy before decorative styling.
Map repeated CSS values to semantic Tailwind v4 tokens and migrate one component before expanding the system.
Inspect the authorized Figma file and tool capabilities before reading or changing nodes; preserve IDs and component relationships.
Choose motion from the task: feedback, continuity, or orientation; specify interruption and reduced-motion behavior.
Review a critical journey for semantic structure, keyboard access, contrast, and announcements; separate automated findings from manual checks.
Refine optical alignment, control targets, typography, borders, and motion with real content.
UX writing, clear communication, editing, and useful documents.
Write internal updates around decisions, outcomes, requests, and known uncertainty; adapt detail to the receiving team.
Remove stock phrases and empty emphasis while preserving the author's facts and voice; vary rhythm through meaning.
Write interface text from the user's intent and current state; make actions and recovery explicit.
Co-author a document by settling purpose and structure before polishing prose.
Create or edit Word documents with stable styles and a render-and-inspect step.
Synthesize authorized Notion material into a sourced document while keeping gaps and conflicting versions visible.
Customer discovery, scope, pricing, fundraising, and first launches.
Assess product-market-fit evidence by segment using retention, customer behavior, and properly qualified survey findings.
Build a pitch narrative linking customer pain, product proof, distribution, economics, and the financing decision.
Prepare fundraising work around company needs, milestones, investor fit, and disclosure boundaries.
Cut scope by protecting the smallest useful end-to-end outcome; map dependencies and explicit deferrals.
Compare pricing models against customer value, usage distribution, and cost uncertainty.
Run founder-led sales discovery around real workflow pain and a bounded pilot.
Discovery, requirements, research, experiments, and delivery.
Turn an agreed conversation into a PRD with user flow, rules, non-goals, and acceptance cases; keep unknowns visible.
Map a desired outcome to customer opportunities before listing solutions and experiments.
Choose a research method from the decision it must inform; recruit relevant experience and preserve evidence through synthesis.
Observe people completing meaningful tasks; use neutral instructions and record assistance consistently.
Build an evaluation set from real failure modes and explicit quality criteria; separate development from held-out cases.
Connect discovery, prioritization, requirements, and delivery through explicit product decisions.
Search, content, email, conversion, and launch planning.
Improve content discoverability by making claims, entities, evidence, and source dates explicit.
Connect conventional search intent with citation-ready evidence and crawlable information architecture.
Diagnose a conversion problem before proposing a change; pair primary metrics with downstream quality guardrails.
Design email sequences from user state, consent, useful content, and exit conditions.
Choose content from audience questions, credible expertise, and realistic production capacity.
Plan paid campaigns with explicit audience hypotheses, budgets, attribution limits, and stopping criteria.
Components, design systems, accessible interfaces, and reliable code.
Map repeated CSS values to semantic Tailwind v4 tokens and migrate one component before expanding the system.
Use existing shadcn components and installed primitives before inventing replacements.
Review a critical journey for semantic structure, keyboard access, contrast, and announcements; separate automated findings from manual checks.
Compose an AI conversation from clear message, tool, input, and output boundaries.
Review React and Next.js code for data boundaries, rendering cost, and unnecessary client state.
Keep coding changes surgical by checking assumptions, callers, and observable success conditions.
The latest updates to the Knoveya skill library.
Design an experiment with a falsifiable hypothesis, assignment unit, guardrails, and stopping rules.
Test inclusive task completion across keyboard, assistive technology, and responsive layouts.
Develop ad concepts from substantiated benefits and a defined audience situation.
Automate browser work only through permitted tooling and observed controls.
Collect precise visual feedback with target elements and task context before editing UI.
Compose an AI conversation from clear message, tool, input, and output boundaries.
Design an experiment with a falsifiable hypothesis, assignment unit, guardrails, and stopping rules.
Test inclusive task completion across keyboard, assistive technology, and responsive layouts.
Develop ad concepts from substantiated benefits and a defined audience situation.
Automate browser work only through permitted tooling and observed controls.
Collect precise visual feedback with target elements and task context before editing UI.
Compose an AI conversation from clear message, tool, input, and output boundaries.
Build an evaluation set from real failure modes and explicit quality criteria; separate development from held-out cases.
Brief image generation around subject, composition, material, light, and intended use.
Use AI to explore and prototype while retaining responsibility for evidence, evaluation, and design decisions.
Design an AI feature with validated structured output, explicit failure states, and an evaluation set.
Choose AI investment from customer need, model limits, cost, and control requirements.
Improve content discoverability by making claims, entities, evidence, and source dates explicit.
Brief video generation around subject, action, camera, temporal continuity, and permitted references.
Express a visual idea through explicit parameters and reproducible generative rules.
Define privacy-aware analytics from business questions, consent, event meaning, and data minimization.
Turn a process into a readable mechanical diagram: identify inputs, transformations, and outputs before choosing geometry.
Apply Android interaction and layout guidance to the specific device and task.
Choose whether motion is useful before specifying properties, easing, and duration.
Find the cause of dropped animation frames before changing timing; examine layout work and expensive effects.
Translate a vague motion brief into concrete movement, timing, and interaction terms.
Prepare app-store visuals from verified product behavior and current platform specifications.
Adapt fluid-interface principles to the actual platform without imitating chrome unnecessarily.
Design iOS tasks using current platform guidance and system-appropriate components.
Make an iOS interface feel native through appropriate controls and content hierarchy.
Engineer accessible controls through native semantics and correct focus/state handling.
Create semantic color roles with measured contrast and explicit light/dark mapping.
Review a Figma screen for hierarchy, layout, interaction states, and wording with element-level evidence.
Choose grouping and layout from reading order, information priority, and responsive constraints.
Tune typography through content hierarchy, font metrics, wrapping, and script support.
Refine interface details through consistent surfaces, optical alignment, and restrained feedback.
Explore the user's intended outcome and existing context before committing to a solution.
Apply supplied brand rules accurately and identify missing guidance instead of inventing authority.
Create a brand presentation from a verified positioning brief and practical applications.
Stress-test a component with realistic extreme content before declaring the layout finished.
Develop a static visual composition from a clear message and intentional type/image hierarchy.
Investigate churn by segment and lifecycle stage before proposing retention tactics.
Audit project memory instructions for accuracy, conflicts, and excessive scope.
Write relevant outbound messages from verified recipient context and a credible small request.
Write fair product comparisons tied to verified capabilities and a buyer's actual decision.
Choose content from audience questions, credible expertise, and realistic production capacity.
Diagnose a conversion problem before proposing a change; pair primary metrics with downstream quality guardrails.
Edit marketing text for audience meaning, substantiated claims, specific actions, and consistent terminology.
Structure marketing copy around the reader's problem, evidence, objections, and next action.
Document the governing design language from actual product code and evidence.
Map an end-to-end journey from research, touchpoints, and handoffs.
Choose chart encodings from the comparison or question the data must answer.
Prepare Vercel deployment from current project configuration and explicit target authorization.
Design an interface API by exploring meaningfully different ways callers could express the task.
Critique a design against user goals and constraints before expressing a preferred solution.
Connect visual decisions to implementation details such as focus, layout stability, and control states.
Explain behavior and unresolved decisions beyond static design pixels; link authoritative tokens and assets.
Choose motion from the task: feedback, continuity, or orientation; specify interruption and reduced-motion behavior.
Translate visual taste into specific typography, spacing, hierarchy, and content decisions.
Facilitate a workshop around a concrete decision with balanced participation and documented follow-up.
Recompose a desktop task for mobile reading order and touch input.
Explain a system through clear diagram semantics, labels, and an intentional reading path.
Prepare directory submissions from accurate positioning and a prioritized audience-fit list.
Use parallel work only for independent authorized tasks and gather every result before completion.
Co-author a document by settling purpose and structure before polishing prose.
Create or edit Word documents with stable styles and a render-and-inspect step.
Design email sequences from user state, consent, useful content, and exit conditions.
Audit an evaluation pipeline for missing error analysis, judge calibration, leakage, and misleading aggregate scores.
Execute an approved plan in dependency order and verify each material result.
Extract candidate design rules from authorized public evidence while labelling inferred values.
Build Figma layouts from existing authorized components, variables, and auto-layout rules.
Inspect the authorized Figma file and tool capabilities before reading or changing nodes; preserve IDs and component relationships.
Find where motion could clarify continuity or feedback and reject decorative movement.
Find a skill by task fit, maintainer evidence, permissions, and licensing.
Close implementation with verification, reviewable changes, and clearly stated integration options.
Use an authorized crawl to answer a specific research question without bypassing access controls.
Run founder-led sales discovery around real workflow pain and a bounded pilot.
Build a frontend direction from the audience, real content, and existing brand constraints; resolve hierarchy before decorative styling.
Prepare fundraising work around company needs, milestones, investor fit, and disclosure boundaries.
Apply expressive typography and layout variance only when supported by the product brief.
Challenge unresolved design assumptions one question at a time using available evidence.
Use a structured design interview to create decision records and a shared vocabulary.
Explore unresolved decisions in coherent rounds and update the decision map after each answer.
Plan browser QA around real user flows and observed UI state through permitted browser tooling.
Choose a page structure from its actual content and visitor task rather than a fixed template.
Develop an expressive visual direction through coherent composition and intentional materials.
Plan motion-graphic scenes with explicit timing, assets, and export requirements.
Translate a visual reference into maintainable frontend structure with measured layout decisions.
Generate mobile screen concepts as consistent visual explorations, not working applications.
Generate image assets that fit a real webpage's crop, contrast, and content hierarchy.
Review or build a frontend through purpose, hierarchy, accessible states, typography, and responsive behavior.
Audit existing motion and write a prioritized implementation plan without changing product source.
Build a deliberately utilitarian interface from a coherent grid and strong hierarchy.
Write internal updates around decisions, outcomes, requests, and known uncertainty; adapt detail to the receiving team.
Prepare interview stories from real situations, decisions, and outcomes.
Design SwiftUI screens with semantic components, clear state, and platform-appropriate navigation.
Develop a simple character-based mark around recognizable silhouette and clear brand association.
Extract public information only within authorized access and a bounded research question.
Keep coding changes surgical by checking assumptions, callers, and observable success conditions.
Design a lead resource with practical standalone value and a clear consent boundary.
Teach coding interviews through problem structure, incremental hints, and explicit complexity trade-offs.
Rewrite a professional profile around accurate experience and desired work.
Turn a recurring routine into a workflow with triggers, human checkpoints, and stopping conditions.
Derive a type scale from content hierarchy, script coverage, and actual layout pressure.
A practical review skill for hierarchy, interaction states, and the details that matter.
Refine optical alignment, control targets, typography, borders, and motion with real content.
Generate marketing ideas tied to audience need, distribution access, and testable learning.
Use behavioral principles to explain friction ethically without coercive interfaces.
Build a Material 3 system from semantic tokens, component states, and adaptive layout needs.
Assess product-market-fit evidence by segment using retention, customer behavior, and properly qualified survey findings.
Simplify an interface by removing low-value competition while retaining necessary context.
Design native Android screens using existing Compose components and task-driven navigation.
Adapt a web task to mobile input, safe areas, viewport changes, and interrupted sessions.
Synthesize authorized Notion material into a sourced document while keeping gaps and conflicting versions visible.
Translate an approved specification into ordered implementation tasks with dependencies and checks.
Optimize onboarding around first useful value with minimal necessary setup.
Map a desired outcome to customer opportunities before listing solutions and experiments.
Improve one marketing page from a concrete visitor decision and observed friction.
Plan paid campaigns with explicit audience hypotheses, budgets, attribution limits, and stopping criteria.
Read or generate PDFs with attention to text extraction, pagination, and final rendering.
Choose a UI dependency only after inspecting installed alternatives and the actual capability gap.
Build a pitch narrative linking customer pain, product proof, distribution, economics, and the financing decision.
Hand off product intent with bounded scope, rules, dependencies, and unresolved decisions.
Plan slide hierarchy and reading order before choosing visuals; use one argument per slide and label evidence.
Create presentation files with a coherent narrative, readable layout, and verified rendering.
Compare pricing models against customer value, usage distribution, and cost uncertainty.
Plan launch readiness, distribution, communication, and learning as connected workstreams.
Connect discovery, prioritization, requirements, and delivery through explicit product decisions.
Document positioning, audience, proof, and customer language as maintained context.
Create scaled pages only when each record supplies distinct useful information.
Describe an image through subject, composition, light, material, and intended crop.
Describe video through temporal action, continuity, camera, and scene transitions.
Prototype the riskiest interaction with realistic states and minimal infrastructure.
Evaluate review feedback against code, requirements, and a reproducible failure.
Find relevant public discussions and draft helpful disclosed replies while respecting community rules.
Refine an existing interface by tracing the user task and preserving working behavior.
Design a referral program around genuine fit, understandable incentives, and abuse boundaries.
Build a Remotion composition using explicit frame timing, deterministic inputs, and reusable scene boundaries.
Prepare authorized Remotion rendering with validated inputs and explicit output settings.
Review a change in its surrounding flow, prioritize concrete defects, and explain user impact.
Investigate a bounded question through authoritative sources with dated claims and explicit uncertainty.
Improve resume clarity and role relevance using verified experience rather than fabricated ATS scores.
Review animation code for continuity, input responsiveness, interruption, and reduced motion.
Use bounded independent review to check work against explicit acceptance criteria.
Add structured data only for information visibly supported by the page and relevant schema definitions.
Cut scope by protecting the smallest useful end-to-end outcome; map dependencies and explicit deferrals.
Plan a scroll-led page around one meaningful narrative moment and mobile composition.
Connect conventional search intent with citation-ready evidence and crawlable information architecture.
Audit crawlability, canonical intent, internal links, and page usefulness with current evidence.
Use existing shadcn components and installed primitives before inventing replacements.
Design shader controls around understandable parameters and a defined visual purpose.
Create a skill with a narrow trigger, useful task-specific guidance, and no speculative scaffolding.
Brief a mobile screen generator with task, platform, data, and existing system constraints.
Adapt social content to each channel's audience and reading context.
Audit spacing against the product's actual rhythm and preserve intentional optical exceptions.
Extract the visual decisions in a Stitch export into a concise design reference.
Integrate payment behavior from current Stripe documentation and the approved billing model.
Divide approved work only when independent ownership and bounded interfaces reduce real coordination cost.
Prioritize a design review by user consequences and concrete fixes.
Trace a failure through callers and evidence before changing code; test the smallest explanation.
Map repeated CSS values to semantic Tailwind v4 tokens and migrate one component before expanding the system.
Resolve visual direction through audience, content, typography, and density rather than fashionable defaults.
Use tests to make expected behavior explicit before committing to a nontrivial change.
Plan a Lottie animation from a small state change and practical export constraints.
Translate a theme into semantic colors, type, and component examples; separate experiments from approved rules.
Convert approved work into actionable issues with dependencies and acceptance cases.
Turn an agreed conversation into a PRD with user flow, rules, non-goals, and acceptance cases; keep unknowns visible.
Triage reports by evidence, user impact, reproducibility, and ownership.
Expand a happy-path interface into the states needed for reliable implementation.
Select a coherent visual system from product constraints; avoid treating a style catalog as a substitute for judgment.
Remove stock phrases and empty emphasis while preserving the author's facts and voice; vary rhythm through meaning.
Observe people completing meaningful tasks; use neutral instructions and record assistance consistently.
Choose a research method from the decision it must inform; recruit relevant experience and preserve evidence through synthesis.
Choose an isolated worktree only when repository work benefits from separation; preserve local changes.
Discover relevant guidance from the current task without letting retrieved instructions override user scope.
Write interface text from the user's intent and current state; make actions and recovery explicit.
Choose composition patterns from actual reuse needs and caller behavior.
Review React and Next.js code for data boundaries, rendering cost, and unnecessary client state.
Apply view transitions to preserve orientation between related screens.
Require fresh evidence before claiming a fix, build, test, or feature is complete.
Guide a nontechnical builder through small observable iterations; inspect generated changes and verify a real task.
Map an ambiguous project into options, dependencies, reversible steps, and decisions needed.
Review a critical journey for semantic structure, keyboard access, contrast, and announcements; separate automated findings from manual checks.
Build a self-contained interactive artifact with the smallest existing stack and realistic states.
Review interface source against current authoritative web guidance and provide element-level remediation.
Prototype the core task at low fidelity before visual detail.
Clarify a proposed product through a hypothetical announcement and difficult customer questions.
Create an implementation plan from settled requirements, actual code boundaries, and acceptance cases.
Write a narrowly discoverable skill with self-contained guidance and verifiable boundaries.
Build spreadsheets with explicit inputs, formulas, validation, and units.
Structure an investor deck around a credible problem, product proof, business model, and ask.
A starter skill that separates a polished screenshot from verified interface behavior.
A Markdown file containing reusable instructions for an AI agent. A skill describes when to apply its guidance, how to approach the work, and what to verify.
Open a skill, review its full instructions, then copy or download SKILL.md. Follow your agent’s current installation guidance. Downloading a file here does not install or enable it.
A prompt starts a particular task. A skill packages guidance you can reuse across matching tasks. Review either one for the context and permissions your work requires.
Choose your role or a topic, then read the summary and acceptance check. Start with one skill that matches a real task and verify its output before relying on it.
This library contains 186 skills with independently written Knoveya instructions. All are available to read, copy, and download from their detail pages.