Token导航 LogoToken导航TokenDH.com
研究检索需要联网github未标认证来源可访问许可证需确认审计通过

ux-sound-design用户体验声音设计

Agent Skill

用于辅助界面设计、视觉规范、排版、配色、布局和交互体验优化。它适合让 Agent 根据产品场景整理页面结构、生成 UI 方案、检查视觉一致性或改进组件层级。使用时需要结合现有品牌、设计系统和用户任务,不应只堆装饰元素;涉及真实页面改动时,应通过截图或浏览器预览检查文本溢出、对齐和响应式表现。

总安装

2,160

周安装

90

GitHub Stars

85

下载量

720
CodexClaudeCursorGemini CLI

安装说明

本站只整理中文说明和来源信息,不托管安装包,也不代用户安装。

GitHub

来源数

2

许可证

unknown

最后核验

2026-05-01

来源状态

来源可访问

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手,先确认命令和权限,再让它执行。

请帮我安装这个 Agent Skill:ux-sound-design(用户体验声音设计)
来源仓库:https://github.com/guia-matthieu/clawfu-skills
仓库路径:skills/ux-sound-design
安装命令:
npx skills add https://github.com/guia-matthieu/clawfu-skills --skill ux-sound-design
安装前请先检查当前环境是否支持对应 CLI,并向我确认将要执行的命令、安装目录、联网范围和文件读写权限;确认后再执行。

命令行安装

复制命令到本机终端执行。该命令会通过 npx skills 从第三方来源获取 Skill;本站只展示命令,不托管安装包,也不自动执行。

skills.shnpx skills
npx skills add https://github.com/guia-matthieu/clawfu-skills --skill ux-sound-design

简介

用于为数字产品添加恰当的音效与听觉反馈。

  • 适合增强操作确认感与状态感知清晰度。
  • 使用时需考虑文化差异与无障碍兼容性。
  • 避免干扰性噪音影响专注型任务场景。ux-sound-design 属于研究检索类 Skill,可作为该场景下的辅助能力补充。
  • 安装方式:github,提供音效素材库与配置指南。

SKILL.md

UX Sound Design

Create functional and emotionally resonant audio for digital products using Audio UX methodology—from notification sounds to complete sonic systems.

When to Use This Skill

  • Designing notification sounds for an app
  • Creating a complete audio system for a digital product
  • Adding audio feedback to UI interactions
  • Building accessible audio cues
  • Defining audio guidelines for product teams
  • Evaluating and improving existing product sounds

Methodology Foundation

Source: Audio UX + Design Thinking Principles

Core Principle: "Audio UX is the strategic and intentional use of sound to enhance the user experience." Unlike music or entertainment audio, UX sound design serves a function first. The best product sounds are invisible when working correctly and noticeable only when something needs attention.

Why This Matters: Sound is the most underutilized tool in digital product design. Research shows audio feedback improves task completion, reduces errors, and creates stronger brand associations. Yet most products either ignore sound entirely or use generic, forgettable audio.

What Claude Does vs What You Decide

Claude DoesYou Decide
Structures production workflowFinal creative direction
Suggests technical approachesEquipment and tool choices
Creates templates and checklistsQuality standards
Identifies best practicesBrand/voice decisions
Generates script outlinesFinal script approval

What This Skill Does

  1. Designs functional audio cues - Sounds that communicate status, confirmation, and errors
  2. Creates emotional connections - Audio that reinforces brand personality
  3. Builds audio systems - Coherent families of related sounds
  4. Ensures accessibility - Audio for users with visual impairments
  5. Documents audio guidelines - Specifications for consistent implementation

How to Use

Design Product Sounds

Help me design audio for [product/feature].
Interaction: [what the user does]
Feedback needed: [what the sound should communicate]
Brand personality: [tone/feeling]

Create Audio System

Create an audio system for [app/product].
Key interactions: [list]
Brand: [personality traits]
Constraints: [technical limitations]

Review Existing Audio

Review these product sounds for UX effectiveness:
[describe current sounds]
Issues: [problems you've noticed]

Instructions

When designing UX sounds, follow this methodology:

Step 1: Understand the Function Categories

Every product sound serves one of these purposes.

## UX Sound Categories

### 1. FEEDBACK SOUNDS
Confirm that an action was registered.

| Type | Purpose | Example |
|------|---------|---------|
| Confirmation | Action completed | Send button click |
| Progress | Something is happening | Upload progress |
| Success | Task finished successfully | Payment confirmed |
| Error | Something went wrong | Form validation error |
| Warning | Attention needed | Low battery |

### 2. NOTIFICATION SOUNDS
Alert user to external events.

| Type | Purpose | Example |
|------|---------|---------|
| Alert | Immediate attention | New message |
| Reminder | Scheduled prompt | Calendar event |
| Update | Information available | Download complete |
| Social | Human interaction | Someone liked your post |

### 3. NAVIGATION SOUNDS
Spatial orientation and movement.

| Type | Purpose | Example |
|------|---------|---------|
| Transition | Moving between views | Screen change |
| Selection | Choosing an option | Menu item hover |
| Boundary | End of scrollable content | List bottom reached |

### 4. AMBIENT/BACKGROUND
Context and mood.

| Type | Purpose | Example |
|------|---------|---------|
| Presence | App is running | Subtle background tone |
| Mode | Current state | Focus mode active |
| Celebration | Achievement | Goal reached |

Step 2: Apply Design Principles

Core principles for effective UX audio.

## UX Sound Design Principles

### 1. FUNCTION FIRST
- Sound must communicate something useful
- Ask: "What information does this convey?"
- If no clear function, consider no sound

### 2. DISTINCT BUT RELATED
- Each sound should be recognizably different
- All sounds should feel like a family
- Use consistent:
  - Tonal palette (key/scale)
  - Timbral characteristics
  - Duration ranges
  - Dynamic levels

### 3. APPROPRIATE URGENCY
- Match sound urgency to message urgency
- Error ≠ always alarming
- Success ≠ always celebratory
- Scale:
  1. Subtle acknowledgment
  2. Gentle notification
  3. Attention-getting alert
  4. Urgent alarm

### 4. CONTEXT AWARE
- Consider when/where users hear this
- Public spaces: shorter, more subtle
- Private: can be more expressive
- Frequency: often-heard sounds must be less intrusive

### 5. ACCESSIBLE
- Don't rely solely on sound
- Always pair with visual feedback
- Consider frequency range (avoid only high frequencies)
- Ensure distinctiveness for users who can't see visual cues

### 6. CONTROLLABLE
- Users must be able to mute/adjust
- Provide volume controls
- Respect system settings
- Never surprise with unexpected sound

Step 3: Create the Sound Palette

Define the raw materials for your audio system.

## Sound Palette Development

### Step 3.1: Define Brand Sound Attributes

Translate brand personality into audio terms:

| Brand Attribute | Sound Translation |
|-----------------|-------------------|
| Playful | Bouncy, melodic, varied pitch |
| Professional | Clean, precise, consonant |
| Innovative | Modern synthesis, unique timbres |
| Warm | Rounded, organic, mid-range |
| Energetic | Fast attack, bright, rhythmic |
| Calm | Soft attack, slow decay, filtered |

### Step 3.2: Choose Your Palette Elements

**Tonal Center**
- Pick a key (e.g., C major, F major)
- All sounds should relate to this key
- Create harmonic cohesion

**Timbre Family**
- Acoustic (piano, bells, wood)
- Synthetic (sine, FM, wavetable)
- Hybrid (processed acoustic)
- Choose based on brand

**Duration Range**
- Micro: 50-150ms (feedback)
- Short: 150-500ms (notifications)
- Medium: 500-1500ms (transitions)
- Long: 1500ms+ (celebrations)

**Dynamic Range**
- Define min/max volume levels
- Relative loudness between sound types
- Error > Notification > Feedback (typically)

### Step 3.3: Document the Palette

[Product] Sound Palette

Tonal Center: F major Character: Warm, professional, approachable

Primary Timbre: Rounded sine with subtle harmonics Secondary Timbre: Soft mallet (marimba-like) Accent Timbre: Clean bell tone

Durations:

  • Feedback: 80-120ms
  • Notification: 200-400ms
  • Transition: 300-600ms
  • Celebration: 800-1500ms

Loudness Hierarchy (relative to baseline):

  1. Alerts: +3dB
  2. Notifications: 0dB (baseline)
  3. Feedback: -6dB
  4. Ambient: -12dB

Step 4: Design Individual Sounds

Process for creating each sound.


## Sound Design Process

### For Each Sound:

**1. Define the Function**

- What exactly does this communicate?
- What action triggered it?
- What should user understand?

**2. Determine Urgency Level**

- 1 (subtle) → 5 (urgent)
- This affects: loudness, duration, pitch, complexity

**3. Consider Context**

- How often is it heard?
- Where is user when hearing it?
- What's user's emotional state?

**4. Design Parameters**

| Parameter | Low Urgency | High Urgency |
| --- | --- | --- |
| Duration | Shorter | Longer |
| Attack | Soft | Sharp |
| Pitch | Neutral | Higher or dissonant |
| Complexity | Simple | More layers |
| Volume | Quieter | Louder |

**5. Create Variations**

- Design 3-5 options
- Test in context
- Get user feedback
- Iterate

### Common Patterns

**Confirmation/Success**:

- Rising pitch (positive)
- Clean, resolved harmony
- Quick, satisfying
- Example: Two notes ascending a third

**Error/Warning**:

- Falling or dissonant
- More complex/harsh
- Attention-getting but not alarming
- Example: Minor second interval, longer duration

**Notification**:

- Distinct melodic motif
- Balanced urgency
- Memorable but not annoying
- Example: 3-4 note sequence

Step 5: Build the System

Create a coherent family of related sounds.


## Audio System Architecture

### Core Sound Set (Minimum Viable)

1. **Generic feedback** - Neutral acknowledgment
2. **Success** - Positive confirmation
3. **Error** - Something went wrong
4. **Notification** - New information
5. **Alert** - Requires attention

### Extended Sound Set

**Feedback family**:

- Tap/click (lightest)
- Selection
- Confirmation
- Success (fullest)

**Notification family**:

- Subtle update
- Standard notification
- Message received
- Urgent alert

**Navigation family**:

- Transition in
- Transition out
- Boundary reached
- Mode change

### Sound Relationships

QUIET ←───────────────────→ LOUD

Feedback Notification Alert Alarm ○ ● ◉ ◎

SUBTLE ←────────────────→ URGENT


### Variation Strategy

For each core sound, create:

- Standard version
- Subtle version (-6dB, shorter)
- Emphasized version (+3dB, fuller)
- This allows contextual flexibility

Step 6: Document and Deliver

Specifications for implementation.


## Audio Guidelines Document

### Overview

[Product] uses sound to enhance user experience through clear feedback, gentle notifications, and brand presence.

### Sound Files

| Sound Name | File | Duration | Usage |
| --- | --- | --- | --- |
| feedback_tap | tap.wav | 80ms | Button presses |
| feedback_success | success.wav | 250ms | Completed actions |
| feedback_error | error.wav | 350ms | Validation errors |
| notif_message | message.wav | 400ms | New messages |
| notif_alert | alert.wav | 600ms | Important updates |

### Implementation Guidelines

**When to Play**:

- Play sounds AFTER visual feedback, not before
- Never play sounds on page load
- Respect system mute settings
- Throttle rapid-fire triggers (max 1 per 100ms)

**Volume Control**:

- All sounds respect master volume
- Users can disable sound in settings
- Haptic feedback should accompany (mobile)

**Accessibility**:

- Every sound has visual equivalent
- Screen reader announcements pair with audio
- Don't rely on sound alone for critical info

### File Specifications

- Format: WAV (for development), MP3/AAC (production)
- Sample rate: 44.1kHz
- Bit depth: 16-bit minimum
- Channels: Mono (reduces file size, consistent playback)
- Peak level: -1dB (avoid clipping)

Examples

Example 1: Mobile App Notification System

Context: Designing sounds for a productivity app.

Input:

Help me design an audio system for a task management app. Key moments: task created, task completed, reminder, all tasks done for the day. Brand is calm, focused, professional.

Output:

Task App Audio System

Brand Sound Translation

Brand attributes: Calm, focused, professional Sound translation:

  • Calm → Soft attacks, rounded tones, major/neutral harmony
  • Focused → Clean, uncluttered, single-element sounds
  • Professional → Refined, not playful, no novelty sounds

Sound Palette

Tonal Center: C major (neutral, universal) Primary Timbre: Soft mallet/vibraphone character Duration Range: 100ms - 800ms Character: Clear, wood-like resonance with gentle decay

Sound Designs

1. Task Created (feedback_subtle)

  • Function: Confirm task was added
  • Urgency: 1/5 (subtle)
  • Design: Single mallet note (G4), soft attack, 120ms
  • Feeling: Gentle acknowledgment, like a soft "got it"

2. Task Completed (feedback_success)

  • Function: Celebrate completion, reward action
  • Urgency: 2/5 (satisfying but not disruptive)
  • Design: Two notes ascending (C4 → E4), 250ms total
  • Feeling: Positive, forward momentum, clean resolution

3. Reminder (notification_standard)

  • Function: Alert user to scheduled reminder
  • Urgency: 3/5 (needs attention but not alarming)
  • Design: Three-note melodic pattern (G4 → C5 → E5), 400ms
  • Feeling: Friendly tap on shoulder, "hey, don't forget"

4. All Tasks Complete (celebration)

  • Function: Reward daily completion
  • Urgency: 2/5 (celebratory but not over the top)
  • Design: Ascending arpeggio (C4 → E4 → G4 → C5), 800ms
  • With subtle reverb tail for satisfaction
  • Feeling: Achievement unlocked, day well done

Audio Guidelines

Sound System: TaskFlow v1.0

Palette:
  tonal_center: C_major
  timbre: mallet_vibraphone
  character: calm_professional

Sounds:
  - name: task_created
    file: sounds/task_created.wav
    duration_ms: 120
    trigger: task.create
    volume: -9dB (relative)

  - name: task_completed
    file: sounds/task_completed.wav
    duration_ms: 250
    trigger: task.complete
    volume: -6dB (relative)

  - name: reminder
    file: sounds/reminder.wav
    duration_ms: 400
    trigger: reminder.fire
    volume: 0dB (baseline)

  - name: daily_complete
    file: sounds/daily_complete.wav
    duration_ms: 800
    trigger: tasks.all_complete
    volume: 0dB (baseline)

Rules:
  - Respect system mute
  - Pair all sounds with haptic (mobile)
  - Throttle: max 1 sound per 200ms
  - No sound on app open

Example 2: E-commerce Checkout Sounds

Context: Adding audio feedback to checkout flow.

Input:

Design sounds for an e-commerce checkout: add to cart, remove from cart, apply coupon, payment processing, purchase complete. Brand is modern, trustworthy, slightly playful.

Output:

E-commerce Checkout Audio

Brand Sound Translation

Modern: Clean synthesis, not acoustic Trustworthy: Consonant, resolved, stable Slightly playful: Small melodic interest, not sterile

Sound Palette

Tonal Center: F major (warm, friendly) Timbre: Rounded digital tones, slight shimmer Character: Friendly but professional, like a good salesperson

Sound Designs

Add to Cart

  • Function: Confirm item added
  • Frequency: High (many per session)
  • Design: Quick upward pitch sweep + soft "pop" (100ms)
  • Very light, satisfying, not attention-grabbing
  • Like dropping something into a soft bag

Remove from Cart

  • Function: Confirm removal
  • Design: Inverse of add—short downward sweep (80ms)
  • Neutral, not negative (removing isn't bad)
  • Quieter than add (-3dB)

Coupon Applied 🎟️

  • Function: Reward, confirmation of savings
  • Design: Small celebratory motif (C5 → A5 → F5), 200ms
  • Sparkle element—feels like found money
  • Distinct from regular feedback

Payment Processing

  • Function: Indicate activity, reduce anxiety
  • Design: Subtle pulsing tone, loopable
  • Calm, confident, "things are happening"
  • Volume very low, background presence

Purchase Complete 🎉

  • Function: Major success moment, emotional peak
  • Design: Triumphant arpeggio with sustained chord (1000ms)
  • The biggest sound in the system
  • Triggers genuine satisfaction response
  • Pairs with visual celebration

Implementation Notes

// Sound trigger logic

// Add to cart - play immediately on success
cartAPI.add(item).then(() => {
  playSound('cart_add', { volume: 0.4 });
  // Throttle: won't play again within 150ms
});

// Purchase complete - play after visual confirmation
if (purchaseSuccess) {
  // Short delay so visual leads
  setTimeout(() => {
    playSound('purchase_complete', { volume: 0.8 });
  }, 200);
}

// Processing - loop while waiting
const processingSound = playSound('processing', {
  loop: true,
  volume: 0.2
});
// Stop when complete
paymentAPI.process().finally(() => {
  processingSound.stop();
});

Checklists & Templates

UX Sound Audit Checklist

## Current State Assessment

□ What sounds exist currently?
□ Are they consistent (family feel)?
□ Do users complain about any sounds?
□ Are sounds controllable (mute option)?
□ Are visual alternatives provided?

## Function Check

□ Every sound serves a clear purpose
□ Users understand what each sound means
□ Urgency matches message importance
□ Frequency considered (annoying over time?)

## Brand Check

□ Sounds match brand personality
□ Sounds distinct from competitors
□ Consistent with visual design language
□ Appropriate for target audience

## Technical Check

□ Files optimized for platform
□ Plays reliably across devices
□ Respects system audio settings
□ No clipping or distortion

Sound Design Specification Template

## Sound: [Name]

### Function
- Purpose:
- Trigger:
- User action that causes this:

### Context
- How often heard:
- User emotional state:
- Environment:

### Design
- Urgency level: _/5
- Duration: _ms
- Tonal content:
- Timbre description:

### Technical
- File: [filename.wav]
- Sample rate: 44.1kHz
- Channels: Mono
- Peak level: -1dB
- Relative volume:

### Relationships
- Replaces: [if replacing existing sound]
- Similar to: [related sounds in system]
- Distinct from: [sounds it must differ from]

Skill Boundaries

What This Skill Does Well

  • Structuring audio production workflows
  • Providing technical guidance
  • Creating quality checklists
  • Suggesting creative approaches

What This Skill Cannot Do

  • Replace audio engineering expertise
  • Make subjective creative decisions
  • Access or edit audio files directly
  • Guarantee commercial success

References

  • Audio UX. "The Future of Sonic Branding" (Lippincott partnership)
  • LANDR. "Audio UX Sound Design" - Practical methodology
  • UX Collective. "How Sound Design Can Make Wonders with Your Brand"
  • Apple Human Interface Guidelines - Sound design section
  • Material Design - Sound in UI

Related Skills


Skill Metadata (Internal Use)

name: ux-sound-design
category: audio
subcategory: sound-design
version: 1.0
author: MKTG Skills
source_expert: Audio UX
source_work: Audio UX Methodology
difficulty: intermediate
estimated_value: $2,000-10,000 per audio system (equivalent design work)
tags: [ux, sound-design, product, notifications, audio-feedback]
created: 2026-01-26
updated: 2026-01-26

适合场景

01

用户想查找某类 Agent Skill 时

02

需要根据任务场景推荐可安装能力包时

03

需要对比不同来源的安装命令和来源信息时

能力概览

能力 1

按任务关键词查找相关 Skills

能力 2

展示可复制的安装命令

能力 3

保留来源站点、仓库和原始说明,方便继续核验

能力 4

展示第三方安全扫描或审计结果

安装后应在对应宿主中按原始 README 的触发条件使用;具体调用方式请以来源页面和 README 为准。

平台分布

Codex

35.12%
按下载量换算253

Claude

29.74%
按下载量换算214

Cursor

18.8%
按下载量换算135

Gemini CLI

9.35%
按下载量换算67

安全审计

Gen Agent Trust Hub

通过

Socket

通过

Snyk

通过

权限和风险

需要联网

该 Skill 可能需要联网访问来源站点、仓库或外部 API;具体网络访问范围需要结合源码和 README 复核。

安装前确认

本站仅展示第三方公开信息,不托管安装包,不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。当前只有一个来源,正式发布前建议补源仓库或其他目录站核验。

来源信息

继续浏览同类 Skills