メニュー
このリポジトリの skills
SkillsMP は x3allamerican/design-skills-fleetsafety から 100 件の skill を収集しています。skill を開くとソースと詳細を確認できます。
x3allamerican/design-skills-fleetsafety収集済み skill 100 件中 20 件を表示しています。
Use when adding scroll-triggered animations (reveal on scroll, parallax, sticky elements). Covers when scroll animations work, when they hurt UX, and the implementation patterns (Intersection Observer, CSS scroll-driven animations).
原文の言語: 英語
Use when designing search interfaces in a product. Covers input patterns, instant search, results layout, filters, no-results state.
原文の言語: 英語
Use when designing a dedicated /security page. Covers what to include (data classification, encryption, certifications, sub-processors, incident response), the tone, and how to balance technical detail with reassurance.
原文の言語: 英語
Use when designing the cancellation flow for a SaaS subscription. Covers the principles of frictionless cancel, what to ask during cancel (feedback, not pressure), the confirmation, and the post-cancel experience.
原文の言語: 英語
Use when designing for SEO. Covers semantic HTML, page structure, meta tags, schema markup, internal linking, and the design decisions that affect rankings.
原文の言語: 英語
Use when designing loading states for async content. Covers skeleton loader anatomy, when to use vs spinner, the shimmer animation, and the rules to avoid loader fatigue.
原文の言語: 英語
Use when designing social proof beyond testimonials. Covers customer logo bars, case study layouts, usage stats, integration logos, and the patterns that reduce purchase anxiety without crossing into manipulation.
原文の言語: 英語
Use when designing sortable / groupable tables and lists. Covers click-to-sort patterns, multi-column sort, grouping by category, and visual indicators.
原文の言語: 英語
Use when establishing or auditing a spacing system. Covers the 4px/8px grid, the spacing token ladder, rules for which spacing values go where, vertical rhythm between sections, and the mistakes that make sites feel cramped or sprawled.
原文の言語: 英語
Use when adding schema.org structured data to a site. Covers the schemas that matter (Product, FAQ, Organization, BreadcrumbList), JSON-LD vs microdata, and the rich-result patterns.
原文の言語: 英語
Use when designing for tablet form factor (iPad, Android tablets) and large mobile. Covers landscape orientation, the two-column patterns, and when tablet design diverges from both phone and desktop.
原文の言語: 英語
Use when designing team / user management for a multi-seat SaaS. Covers role models, invite flow, permissions UI, and the patterns for owners vs admins vs members.
原文の言語: 英語
Use when designing terms of service display, click-through agreements, and re-acceptance flows. Covers readability, signature patterns, and audit-trail capture.
原文の言語: 英語
Use when designing testimonial sections. Covers the formats that work (single hero, 3-up cards, full-bleed quote), what makes a testimonial believable, and how to avoid the dead patterns (auto-rotating carousel, headless quotes).
原文の言語: 英語
Use when designing transient feedback: toasts, snackbars, banner notifications, inline messages. Covers when to use each, positioning, duration, dismissal, severity levels, and the mistakes that make notifications annoying.
原文の言語: 英語
Use when establishing the motion tokens for a product. Covers transition properties, the easing curve library, the duration scale, and what to set globally vs per-component.
原文の言語: 英語
Use when designing trust signals (logos, badges, testimonials, security marks, money-back guarantees). Covers what works, what's invisible, and what damages trust by trying too hard.
原文の言語: 英語
Use when establishing or refining a typography system for a SaaS product or marketing site. Covers type stack selection, modular scale, line-heights, letter-spacing, and the type tokens every modern site needs. Includes the Inter/Geist/Söhne tradeoffs.
原文の言語: 英語
Use when crafting or auditing the value proposition for a product or feature. Covers the value-prop equation, the test for whether a value prop works, and patterns to refine vague positioning.
原文の言語: 英語
Use when designing white-label / reseller UIs. Covers the customer-brand-takeover pattern, the brand-config schema, the loading sequence, and the parts that must stay platform-branded.
原文の言語: 英語