本文へ移動
cccskills

「listener」の検索結果

185 件 ・ 関連度順

概要と使いどころ

Critique a rendered screen's colour — contrast ratios, palette coherence, and semantic meaning. Use when reviewing one screen. For a product-wide WCAG audit use `accessibility-audit` (design-systems); for building the palette use `color-system` (ui-design).

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

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

Critique a rendered screen's composition — balance, whitespace, rhythm, and gestalt grouping. Use when a layout feels off but hierarchy is fine. For emphasis and eye flow specifically, use `critique-visual-hierarchy`.

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

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

Critique a rendered screen's typography — scale usage, readability, consistency, and token compliance. Use when reviewing type on a screen. For defining the scale itself, use `typography-scale` (ui-design).

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

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

Articulate a long-horizon product vision that aligns teams and anchors strategy. Use when direction is contested or absent. For near-term project scope, use `design-brief`.

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

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

Build alignment artifacts — responsibility matrices, decision rights, and communication plans. Use when unclear ownership stalls decisions. For persuading in the moment, use `design-negotiation` (designer-toolkit).

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

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

Critique a rendered screen against mood.md, voice.md, and tokens.md. Use when those brand files exist and you are checking compliance. For defining the visual language itself, use `illustration-style` (ui-design).

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

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

Map service delivery across frontstage actions, backstage processes, and supporting systems. Use when staff and operations are part of the experience. For the customer-visible layer only, use `experience-map`.

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

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

Critique a rendered screen's hierarchy — entry point, eye flow, weight distribution, and emphasis. Use when attention lands in the wrong place. For establishing hierarchy in new work, use `visual-hierarchy` (ui-design).

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

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

Critique a rendered screen's density — cognitive load, content prioritisation, scanning patterns, and progressive disclosure. Use when a screen feels overwhelming. For the underlying choice-count principle, use `hicks-law` (interaction-design).

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

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

Identify, score, and prioritise design opportunities against impact and effort. Use when there are more ideas than capacity. For framing the one you choose, use `design-brief`.

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

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

Critique a rendered screen's affordances — what looks clickable, state visibility, CTA clarity, and action discoverability. Use when reviewing an existing screen. For sizing and positioning targets in new work, use `fitts-law` (interaction-design).

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

Owl-Listener/designer-skills2,9032026年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,9032026年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,9032026年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,9032026年9月6日 更新

Select chart types and design data encodings — marks, axes, labels, and accessible chart styling. Use when presenting data graphically. Owns chart selection and encoding only; the categorical colour ramp itself belongs to `color-system`.

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

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

Design content structure, hierarchy, labelling, and the navigation model. Use when organising what exists. For the UI that exposes it use `navigation-patterns` (interaction-design); for user-generated grouping evidence use `card-sort-analysis` (design-research).

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

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

Apply the Zeigarnik Effect — incomplete tasks stay mentally active. Use when designing progress indicators, saved drafts, and return hooks. For the emotional shape of the ending, use `peak-end-rule`.

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

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

Apply the Peak-End Rule — a flow is remembered by its most intense moment and its last. Use when designing completion, celebration, or cancellation moments. For sustaining engagement mid-flow, use `zeigarnik-effect`.

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

Owl-Listener/designer-skills2,9032026年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,9032026年9月6日 更新

Design waiting experiences — spinners, skeletons, optimistic updates, and progressive reveal. Use when content takes time to arrive. For the latency budget itself use `doherty-threshold`; for success confirmation use `feedback-patterns`.

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

Owl-Listener/designer-skills2,9032026年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,9032026年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,9032026年9月6日 更新

Build several genuinely different solutions to the same problem at once, spread across what the user does rather than how it looks. Use when one direction is on the table and the team is about to refine it by default. For choosing between the concepts afterwards, use `concept-selection`.

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

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

Design an A/B experiment — hypothesis, variants, primary metric, and sample size. Use when a change can be measured quantitatively at scale. For observing behaviour qualitatively, use `test-scenario`.

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

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