Menu
Skills neste repositório
O SkillsMP coletou 100 skills de x3allamerican/design-skills-fleetsafety. Abra uma skill para revisar a origem e os detalhes.
x3allamerican/design-skills-fleetsafetyMostrando 40 de 100 skills coletadas.
Use when designing filters for lists, tables, search results. Covers facet patterns (checkboxes, ranges, tags), the apply-filters-as-you-go vs apply-button decision.
Idioma do texto original: inglês
Use when designing or auditing a marketing site footer. Covers the canonical column structure, what belongs in a footer vs nav, how to add a 'big footer' newsletter / link-rich section, and what to skip.
Idioma do texto original: inglês
Use when designing any form (signup, settings, checkout, search). Covers field count, label position, inline validation, error messaging, autofill considerations, and the rules that 2x conversion on signup forms.
Idioma do texto original: inglês
Use when designing GDPR / CCPA cookie consent banners. Covers the patterns that are compliant + not annoying, the 'reject all' button placement, and granular controls.
Idioma do texto original: inglês
Use when designing a marketing hero section. Covers the canonical structure (badge, headline, sub, CTAs, trust strip), modern hero patterns, hero copywriting, hero imagery decisions, and the difference between converting heros and pretty ones.
Idioma do texto original: inglês
Use when designing hover states across a UI. Covers the canonical hover patterns (lift, glow, color shift, scale, content reveal), how to choose, and the hover states for every interactive element.
Idioma do texto original: inglês
Use when establishing an icon library. Covers stroke vs fill, weight, sizing, the choice of icon library (Lucide, Phosphor, Heroicons), custom icon creation, and accessibility.
Idioma do texto original: inglês
Use when commissioning or creating illustrations for a SaaS product. Covers the canonical illustration styles (geometric, isometric, hand-drawn, abstract), when each works, sourcing strategies, and how to maintain consistency.
Idioma do texto original: inglês
Use when designing with inclusion at the center. Covers the difference between accessibility (rules) and inclusion (mindset), the principles of inclusive design, and how to research with underrepresented users.
Idioma do texto original: inglês
Use when designing UI for multi-language support. Covers text length variability, RTL support, date/number formats, and the technical patterns (i18n libraries, key-based translation).
Idioma do texto original: inglês
Use when designing or evaluating a logo. Covers the criteria for a great logo (memorable, scalable, distinctive, timeless), the canonical formats (icon + wordmark, monogram, wordmark only), and what to avoid.
Idioma do texto original: inglês
Use when adding motion to a UI. Covers the principle of motion budget, the types of animations that earn their cost, easing curves, the duration scale, and when to default to no animation.
Idioma do texto original: inglês
Use when designing the mobile app shell (or mobile-web equivalent). Covers tab bar, navigation drawer, header patterns, and the differences between native iOS, Android, and mobile-web.
Idioma do texto original: inglês
Use when designing mobile navigation for a marketing site or web app. Covers hamburger vs bottom-tab vs slide-out, the gesture patterns, and the back-button behavior.
Idioma do texto original: inglês
Use when designing modal dialogs, confirmation dialogs, side drawers, and overlays. Covers when to use each, sizing, escape behavior, focus trapping, and the patterns that don't feel obtrusive.
Idioma do texto original: inglês
Use when designing or evaluating a SaaS marketing site or product UI in 2025+. Covers the canonical modern aesthetic, what's table-stakes, what's overused, and how to make design decisions that age past one trend cycle. Reference for every other skill in this…
Idioma do texto original: inglês
Use when designing for multiple sub-brands (e.g., X3 Compass + X3 Fleet Safety + X3 Investment Group). Covers token inheritance, white-label patterns, and the shared-vs-distinct architecture.
Idioma do texto original: inglês
Use when designing or auditing a marketing site navigation. Covers sticky nav vs scrolling, logo placement, link order, sign-in/sign-up CTAs, mobile patterns, and the underused 'mega nav.'
Idioma do texto original: inglês
Use when designing recurring newsletter templates. Covers single-topic vs multi-topic format, the header / banner, the sub-section pattern, archive linking, and what cadence supports what design.
Idioma do texto original: inglês
Use when designing notification preferences. Covers channel selection (email, SMS, push), event-based vs role-based settings, snooze patterns, and the per-event-type granularity sweet spot.
Idioma do texto original: inglês
Use when designing UI for offline + degraded-network states. Covers the patterns (banner, queue, retry, sync), and what to do when actions can't reach the server.
Idioma do texto original: inglês
Use when designing Open Graph / Twitter Card preview images. Covers sizing, the typography that works at preview size, brand consistency across multiple URLs, and dynamic OG image generation.
Idioma do texto original: inglês
Use when designing the first-time user experience. Covers the canonical onboarding patterns (checklist, progressive disclosure, tour, empty-state guidance), when to use each, and how to balance helpfulness with friction.
Idioma do texto original: inglês
Use when designing pagination for tables, search results, lists. Covers when to use pagination vs infinite scroll vs load-more, and the user expectations for each.
Idioma do texto original: inglês
Use when designing for performance. Covers Core Web Vitals, the design decisions that affect performance (web fonts, images, JS), and the budget framework.
Idioma do texto original: inglês
Use when designing a /press or /newsroom page. Covers the canonical sections (announcements, logos, press kit, media contact), and how to make it useful for both press AND prospective customers.
Idioma do texto original: inglês
Use when designing how pricing is displayed (not what the pricing IS). Covers the psychology of price perception, anchoring, the monthly-annual toggle, currency display, and the small choices that move conversion.
Idioma do texto original: inglês
Use when designing or auditing a SaaS pricing page. Covers the canonical 3–5 tier layout, featured-tier highlighting, per-feature comparison, monthly vs annual toggle patterns, overage handling, and the mistakes that kill conversion.
Idioma do texto original: inglês
Use when designing print and PDF output (invoices, reports, audit packets). Covers print stylesheets, PDF generation libraries, and the layout that survives both.
Idioma do texto original: inglês
Use when designing privacy-policy and terms pages. Covers readability (sections, plain English summaries), the change log, when to require re-consent, and how to balance legal accuracy with usability.
Idioma do texto original: inglês
Use when creating product screenshots for marketing pages and app stores. Covers the staging (real data vs sample), the device frame, callouts, and how to keep screenshots fresh across product changes.
Idioma do texto original: inglês
Use when designing in-product tours and coachmarks for new users. Covers the trigger patterns, the dismiss-respect-the-user principle, and the alternative of contextual help.
Idioma do texto original: inglês
Use when designing a Progressive Web App. Covers the install prompt, offline state, push notifications, and the design differences between PWA and native.
Idioma do texto original: inglês
Use when establishing breakpoints or auditing responsive behavior. Covers standard breakpoints, mobile-first vs desktop-first, the four core responsive patterns, fluid type with clamp(), and the viewports to actually test.
Idioma do texto original: inglês
Use when designing responsive image strategy. Covers srcset, picture element, lazy loading, blur placeholders, and the trade-offs between performance and quality.
Idioma do texto original: inglês
Use when supporting right-to-left languages (Arabic, Hebrew, Persian). Covers direction flipping, layout mirroring, the icons that don't flip, and the CSS logical properties.
Idioma do texto original: inglês
Use when designing the in-product billing UI: current plan, payment method, invoices, upgrade flow. Covers transparency, the cancel flow, dunning, and the trust-building patterns.
Idioma do texto original: inglês
Use when designing a complete SaaS marketing landing page. Covers the canonical 9-section structure, how to choose which sections you need, and the order that converts.
Idioma do texto original: inglês
Use when designing the first-run experience for a SaaS product. Covers checklist patterns, sample data, contextual help, time-to-value benchmarks, and the practices that maximize 90-day retention.
Idioma do texto original: inglês
Use when designing a SaaS pricing page specifically. Covers 3-tier vs 5-tier, anchoring techniques, the toggle, comparison tables, FAQ inclusion, and how to NOT use 'Contact sales' as a black box.
Idioma do texto original: inglês