mattjmdesign
- 18 skills
- 0 followers
- 17 hours ago last updated
- ▌ Git · mattjmdesign bundlePlan or refine Git collaboration, reviewable changes, worktrees, and dependency-update ownership. Use when planning branches, slicing reviewable PRs, coordinating parallel agents, or assigning lockfile ownership.
- ▌ Flow · mattjmdesign bundleMap or review a task from entry to outcome, including mutations, interruptions, and recovery. Use when mapping onboarding, checkout, creation, editing, approval, or account flows including failure and recovery branches.
- ▌ Craft · mattjmdesign bundleBuild, improve, or audit interfaces through product-specific composition, responsive layout, interaction states, accessibility, and rendered verification. Use for visible UI work on web, mobile, or desktop. Use when repairing scanning on a dense screen, refining hierarchy before review, or auditing a flow for state and keyboard support.
- ▌ Setup · mattjmdesign bundlePlan or improve a repository foundation: ownership, commands, configuration, tokens, and a runnable first slice. Use when starting a repository, when fresh checkout install or env setup fails, or when feature ownership is unclear.
- ▌ Slice · mattjmdesign bundleImplement or harden one real product workflow end to end in an existing or new codebase, connecting interface, data, permissions, recovery, and verification. Use when hardening a prototype path, implementing a client feature, or proving auth, recovery, and persistence.
- ▌ Stack · mattjmdesign bundleChoose or revisit a product stack using rendering, data, deployment, and maintenance constraints. Use when comparing frameworks, when SEO, auth, or deploy targets constrain the choice, or when revisiting an existing stack.
- ▌ Intent · mattjmdesign bundleClarify a product idea or reassess a running feature against its intended user, outcome, and scope. Use when a rough idea, client request, or vibe-coding prompt needs a decision-ready brief before design or code.
- ▌ Layout · mattjmdesign bundleDesign or revisit page shells, reading order, responsive structure, and scroll ownership using real content. Use when planning landing, dashboard, auth, or docs shells, or when responsive behavior and scroll ownership diverge.
- ▌ States · mattjmdesign bundleFind and resolve missing states in an existing screen, flow, component, or specification. Use when checking loading, empty, error, permission, offline, or mutation recovery before a review or pilot.
- ▌ System · mattjmdesign bundleAudit or maintain existing tokens, components, and shared layouts; resolve drift with evidence and a migration path. Use when auditing drift, deduplicating components, fixing theme or focus gaps, or updating DESIGN.md before new UI.
- ▌ Tokens · mattjmdesign bundleCreate or extend a small token system with semantic roles, theme pairs, and concrete component usage. Use when starting a UI foundation, when colors or spacing multiply, or before building components or shells.
- ▌ Context · mattjmdesign bundleCreate or revise repository instructions using verified commands, paths, architecture constraints, and review expectations. Use when creating AGENTS.md or CLAUDE.md, when agents invent commands or paths, or when instructions drift stale.
- ▌ Sitemap · mattjmdesign bundlePlan or revise product navigation, route hierarchy, URL state, and access boundaries. Use when creating IA for an app, site, dashboard, or prototype before visual design or implementation.
- ▌ Component · mattjmdesign bundleSpecify or revise a UI component’s API, states, semantics, data ownership, and acceptance behavior. Use when defining props, variants, slots, keyboard behavior, or acceptance criteria before building a component.
- ▌ Hierarchy · mattjmdesign bundleRank a screen’s information and actions; improve headings, decision support, and narrow-screen priority. Use when planning what belongs on a page before layout, visual design, or implementation.
- ▌ Prototype · mattjmdesign bundleBuild or revise a runnable prototype for a client goal, using realistic content and explicit real/mock boundaries to learn through interaction. Use when matching fidelity to the validation question, testing a task flow, or judging layout, motion, or latency in code.
- ▌ Readiness · mattjmdesign bundleAssess whether a build can support its intended demo, pilot, or production use using evidence and blocking risks. Use when a preview looks done, a client asks to launch, or a prototype path now faces real data and users.
- ▌ Requirements · mattjmdesign bundleTurn a brief or existing feature into testable behavior, quality constraints, and explicit data and permission contracts. Use when stakeholder notes, a brief, or a vibe-coded concept needs FR/NFR requirements before design or implementation.