メニュー
このリポジトリの skills
SkillsMP は peterbamuhigire/design-system-skills から 90 件の skill を収集しています。skill を開くとソースと詳細を確認できます。
peterbamuhigire/design-system-skills収集済み skill 90 件中 40 件を表示しています。
Use when a font category is known and local premium files must be checked before choosing the OFL baseline. Unlike font-selection-and-pairing, this resolves availability and licence evidence; embedding routes to font-embedding-and-licensing.
原文の言語: 英語
Use when configuring variable-font axes, optical sizing, numerals, or OpenType features after a face is chosen. Unlike font-selection-and-pairing, this implements type mechanics; embedding and licence work routes to font-embedding-and-licensing.
原文の言語: 英語
Use when verifying or fixing text, UI, focus, border, status, or data colours for contrast and colour-vision accessibility. Unlike color-system-and-palette, this is the focused WCAG/APCA and non-colour-cue gate, not palette creation.
原文の言語: 英語
Use when generating a starting website palette from brand hues, imagery, audience, mood, or colour harmony. Unlike color-system-and-palette, this selects candidate colours; semantic roles, ramps, dark themes, and final contrast contracts are downstream.
原文の言語: 英語
Use when building a cross-format colour system with an authored anchor, perceptual ramps, semantic roles, contrast contracts, and theme mappings. Unlike color-selection, this operationalises a palette; focused contrast audit routes to…
原文の言語: 英語
Use when building, adding, or auditing a dark mode — or any multi-theme (light/dark/high-contrast/dimmed) system — for a website, app/web UI, dashboard, or themed document. Builds a true dual-mode semantic palette where dark is a deliberate remap (lowered…
原文の言語: 英語
Use when constructing or specifying a logo, wordmark, lockups, clear space, responsive marks, favicons, or app icons. Unlike brand-visual-identity, this owns mark geometry and reduction; strategy, palette, typography, and the broader system remain upstream.
原文の言語: 英語
Use when a screen, page, slide, or cover needs a deliberate focal point, reading order, figure-ground separation, and visual tension. Do not use for choosing columns or spacing units; route those scaffold decisions to layout-grid-and-spacing.
原文の言語: 英語
Use when an article, essay, documentation page, case study, or web report needs sustained-reading measure, rhythm, landmarks, notes, figures, or captions. Do not use for editable DOCX or print-PDF production; route those artefacts to the document skills.
原文の言語: 英語
Use when a page, screen, slide, or document needs its column scaffold, margins, gutters, spacing rhythm, or alignment system defined. Do not use for hierarchy inside an established grid or for breakpoint behaviour; route those to composition or responsive…
原文の言語: 英語
Use when a browser-rendered page, component, dashboard, or email must adapt across widths using intrinsic layout, fluid values, breakpoints, or container queries. Do not use to establish the base grid or for fixed-canvas documents; route those to…
原文の言語: 英語
Use when a UI, website, dashboard, deck, or rendered artefact needs one defensible visual signature before high-fidelity build. Do not use for detailed token production or final QA; route those to the relevant design-system or audit skill after direction is…
原文の言語: 英語
Use when a web, iOS, or Android form needs field anatomy, validation, errors, multi-step flow, accessibility, or submission recovery. Do not use for general page layout or backend-only validation; pair with platform implementation and contract skills.
原文の言語: 英語
Use when an interface flow needs a proven behaviour, navigation, action, layout, or data-display pattern selected from task and context. Do not use for visual styling or per-component state fidelity; route those to practical-ui-design or component-states.
原文の言語: 英語
Use when a web, SaaS, dashboard, iOS, or Android product must communicate premium value through trust, clarity, restraint, sensory polish, and service detail. Do not use as a substitute for the platform, accessibility, or design-system implementation skill.
原文の言語: 英語
Use when a design or feature must converge through repeated demo, feedback, dogfooding, selection, and decision capture. Do not use merely to choose one prototype's fidelity; route that artefact decision to wireframing-and-prototyping. through).
原文の言語: 英語
Use when an existing interface or flow needs an expert, no-users inspection against Nielsen/Tognazzini heuristics with screen evidence and 0–4 severity. Do not use for empirical usability testing or a broad 0–100 visual audit; route those to research or…
原文の言語: 英語
Use when evidence must be synthesised into a persona, JTBD, end-to-end journey, experience map, or service blueprint across channels and frontstage/backstage work. Do not use for a single-screen flow or primary user research collection.
原文の言語: 英語
Use when a design decision needs a cautious cognitive rationale involving Gestalt grouping, affordances, memory, attention, mental models, or bias. Do not use as proof of user behaviour or for heuristic inspection; route claims to research/testing or…
原文の言語: 英語
Use when planning moderated usability sessions, participant tasks, observation evidence, interviews, surveys, card/tree tests, diary studies, or findings synthesis. Do not use for expert-only heuristic inspection or unsupported personas; route those to…
原文の言語: 英語
Use when a flow or feature needs sketches, wireframes, wireflows, or a clickable/coded prototype and the fidelity must match the learning question. Do not use to run a multi-round convergence process or produce final visual design; route those to demo-driven…
原文の言語: 英語
Use when a clinical, EHR/EMR, patient portal, telemedicine, medication, wellness, or ageing-care interface needs safety-centred web, mobile, or tablet UX. Do not use for medical advice, clinical-rule authoring, or compliance certification; require…
原文の言語: 英語
Use when a lawyer, law firm, chambers, solicitor, barrister, or legal consultancy website needs ethical trust signals, practice-area structure, attorney profiles, or intake UX. Do not use for legal advice or generic sector selection; verify current…
原文の言語: 英語
Use when a website needs an evidence-based sector direction for travel, consulting, education, nonprofit, professional services, portfolio, or another industry without a dedicated skill. Do not use for legal, healthcare, fintech, or ecommerce UX; route those…
原文の言語: 英語
Use when an Android phone, tablet, foldable, or Compose screen needs native Material navigation, components, states, accessibility, and adaptive behaviour. Do not use for iOS conventions or cross-platform unify/diverge decisions; route those to iOS design or…
原文の言語: 英語
Use when an App Store or Google Play listing needs icon, screenshot narrative, preview video, captions, feature graphic, localisation, or current asset-spec planning. Do not use for in-app UI or growth strategy beyond the store surface; verify current…
原文の言語: 英語
Use when one product must ship as idiomatic iOS and Android and needs explicit unify/diverge decisions for brand, IA, flows, navigation, controls, motion, gestures, and system chrome. Do not use to perfect only one platform; route that work to the iOS or…
原文の言語: 英語
Use when an iPhone, iPad, SwiftUI, or UIKit screen needs native Apple navigation, controls, states, Dynamic Type, VoiceOver, and adaptive window behaviour. Do not use for Android conventions or cross-platform unify/diverge decisions; route those to Android…
原文の言語: 英語
Use when a mobile screen needs touch-target sizing, thumb reach, tap/press/swipe/drag/pinch rules, gesture alternatives, discoverability, conflict resolution, or truthful iOS/Android haptics. Do not use for navigation architecture or motion choreography; pair…
原文の言語: 英語
Use when designing per-control feedback for presses, toggles, inputs, selections, optimistic actions, haptics, or delight moments. Use motion-design for the product-wide timing, easing, transition, choreography, and reduced-motion system.
原文の言語: 英語
Use when defining system-level motion timing, easing, transitions, choreography, loading motion, or reduced-motion behaviour across web and native products. Use micro-interactions-and-feedback for the feedback anatomy of one control.
原文の言語: 英語
Use when handing a design to engineering through token-referenced redlines, component and screen behaviour, states, breakpoints, accessibility notes, edge cases, and testable acceptance criteria. Use design-tokens-and-naming to define tokens and…
原文の言語: 英語
Use when defining, naming, mapping, or exporting primitive, semantic, and component design tokens for colour, type, space, radius, elevation, motion, themes, or brands. Use component-library-architecture for component APIs and design-handoff-and-dev-spec for…
原文の言語: 英語
Use when structuring current Figma files, variables, modes, auto-layout, component properties, Dev Mode, branches, or library publishing. Use design-tokens-and-naming for the platform-neutral token contract and design-handoff-and-dev-spec for delivery…
原文の言語: 英語
Use when writing error, empty, success, loading, offline, validation, toast, banner, permission, destructive-action, or HTTP-status messages. Use ux-writing-and-microcopy for ordinary interface labels and empty-error-and-loading-states for visual state design.
原文の言語: 英語
Use when defining or governing a product voice chart, tone map, terminology glossary, content style guide, or voice tiebreaker. Use ux-writing-and-microcopy for interface strings and error-empty-and-system-messaging for state-specific messages.
原文の言語: 英語
Use when turning an art-direction brief into generated imagery, prompts, negative constraints, reject gates, provenance notes, and post-processing instructions. Use photography-art-direction for sourced photos and visual-product-slop-audit for product-wide…
原文の言語: 英語
Use when designing or auditing an icon family, grid, keylines, stroke, terminals, metaphors, optical corrections, small-size fitting, naming, or export contract. Use illustration-style-and-systems for expressive scenes and component-library-architecture for…
原文の言語: 英語
Use when defining, building, or auditing an illustration language, spot-art set, scene system, character rules, or ownable visual motif. Use photography-art-direction for photographs and iconography-system-design for reductive grid-bound glyphs.
原文の言語: 英語
Use when sourcing, selecting, shooting, treating, cropping, or licensing photography and producing a photographic art-direction brief. Use ai-image-generation-art-direction for model generation controls and illustration-style-and-systems for drawn imagery.
原文の言語: 英語