本文へ移動
cccskills

「listener」の検索結果

185 件 ・ 関連度順

概要と使いどころ

Create a spacing scale from a base unit with rules for when each step applies. Use when standardising padding and margins. For page-level columns and gutters, use `layout-grid`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Design to iOS and Android conventions — what each OS mandates, where they diverge, and when to unify. Use when shipping native apps. For breakpoint adaptation use `responsive-design`; for matching competitor patterns use `jakobs-law` (interaction-design).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Map the full ecosystem of touchpoints, channels, and relationships across a service. Use when the experience spans more than one product. For one persona's linear journey use `journey-map` (design-research); for backstage operations use `service-blueprint`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Design layouts and interactions that adapt across screen sizes and input methods. Use when one design must serve many viewports. For the underlying column grid use `layout-grid`; for OS-specific patterns use `platform-conventions`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Define an illustration style guide — visual language, colour usage, and application rules. Use when commissioning or standardising illustration. For icons, use `icon-system` (design-systems).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Select and design a navigation pattern — tabs, drawer, hierarchy, or hub — matched to product structure and user tasks. Use when choosing how users move between sections. For the underlying content structure, use `information-architecture` (ux-strategy).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply the Serial Position Effect — first and last items in a sequence are recalled best. Use when ordering menus, lists, and steps. For emphasising one item regardless of its position, use `von-restorff-effect` (ui-design).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply Jakob's Law — users expect your product to work like the others they already use. Use when deciding whether to innovate on a familiar pattern. For OS-mandated conventions specifically, use `platform-conventions` (ui-design).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply the Aesthetic-Usability Effect — polished, consistent interfaces are perceived as more usable and forgive minor friction. Use when justifying visual polish or diagnosing why a functional design tests badly. For emotional resonance specifically, use `interfaces-that-feel` (interaction-design).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply Tesler's Law — every process has irreducible complexity that someone must absorb. Use when deciding whether the product or the user carries it. For reducing apparent choice, use `hicks-law`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Define a responsive grid — columns, gutters, margins, and breakpoint behaviour. Use when establishing page structure. For the spacing scale inside components use `spacing-system`; for cross-device behaviour use `responsive-design`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply the Law of Similarity — shared colour, shape, or size signals that elements belong to one category. Use when signalling relationships across distance. For grouping by position, use `law-of-proximity`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply the Law of Common Region — a shared container, background, or border groups elements regardless of spacing. Use when grouping must survive a tight layout. For grouping by spacing alone, use `law-of-proximity`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Adapt an existing palette to dark mode — surface elevation, contrast rebalancing, and desaturation rules. Use when you already have a light palette to translate. For building the base palette first, use `color-system`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Build a product colour system — tonal scales, semantic roles, and contrast compliance. Use when defining or rebuilding colour from scratch. For dark-mode adaptation use `dark-mode-design`; for chart palettes use `data-visualization`; for multi-brand token architecture use `theming-system` (design-systems).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Specify wireframe layout — content priority, component placement, and annotation. Use when defining structure before visual design. For grid mechanics, use `layout-grid` (ui-design).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply an emotional resonance lens to a UI that is technically correct but flat, prescribing changes at the copy, motion, and interaction layer. Use when a design tests fine but lands cold. For the polish-perception argument, use `aesthetic-usability` (ui-design).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Design the first-run experience — activation path, progressive disclosure, and time to first value. Use for a user's very first session. For the mechanics of the signup form itself, use `form-design`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Design first-click and click tests for findability and navigation. Use when testing whether people can locate something. For full task-based observation, use `test-scenario`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Define actionable principles that resolve trade-offs when the team disagrees. Use when the same decisions keep getting relitigated. For a single project's framing, use `design-brief`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Apply Miller's Law — chunk information into groups of about four to fit working memory. Use when grouping fields, menu items, or steps. For reducing the number of choices offered, use `hicks-law`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Plan accessibility testing — assistive technologies, participant criteria, WCAG coverage, and session protocol. Use when scheduling testing with real AT users. Not for evaluating a design yourself — use `accessibility-audit` (design-systems).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Choose between competing concepts against criteria fixed in advance, and record what each rejected concept was testing. Use when several directions are alive and one has to win. For picking which problem to work on, use `opportunity-framework` (ux-strategy); for deciding by production traffic, use `a-b-test-design`.

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新

Read financials, map competitive landscapes, and argue design decisions in the language of value. Use when defending design to commercial stakeholders. For the live negotiation itself, use `design-negotiation` (designer-toolkit).

日本語の概要は準備中です。原文の説明を表示しています。

Owl-Listener/designer-skills2,9042026年9月6日 更新