鹏叔(https://pengtech.net)

导航

Material Design基础 - 声音

声音 (sound)

关于声音

声音以改善用户体验的方式传达信息。

原则

声音以表达产品个性和美学的方式传达有用的反馈。

  • Informative
    声音应该是直观的、功能性的和可理解的。

  • Honest
    声音应该是产品品牌标识和美学的真实代表。

  • Reassuring(安心)
    声音应该创造一种舒适和安全感 - 只有在需要的时候才呼吁采取行动。

声音的类型

UI中的声音应该像一个协调良好的管弦乐队一样工作,既可以相互配合,也可以在周围的界面中工作。

UI 中出现三种类型的声音:声音设计、音乐和语音(voice)。每种类型都以不同的方式传达信息和品牌标识。不同类型的声音可用于创建特定效果,并且多个声音可以单独存在或一起存在于同一 UI 中。

虽然音乐和语音是产品音景的一部分,但这些指南侧重于UX声音。

声音设计(Sound design)

数字 UI 的大部分内容都以可视化方式传达。声音可以增强这些信息的表达方式,并提供另一种与用户联系的方式。声音设计可以传达信息,表达情感,并教育用户有关交互的知识。

声音设计可用于:

  • 将 UI 元素与特定声音相关联
  • 表达情感或个性
  • 通过将交互与某些声音相关联来传达分层结构
  • 提供感官反馈

例如:

  • 通知在传达 UI 信息的同时表达个性。
  • 将声音与 UI 元素相关联可以确保用户成功完成操作。
  • 声音可以通过伴随的操作来补充视觉UI。

音乐

音乐主要用于在UI中讲故事和表达情绪。当与图像或动作搭配时,音乐可以提升产品的总体叙事和感觉。

音乐可以在 UI 中用于:

  • 情感共鸣的背景
  • 广告
  • 提供愉悦时刻
  • 讲故事

语音(voice)

语音和文本到语音转换都使用口语在声音设计和音乐无法传达的地方传达信息。

语音可以在 UI 中用于:

传达复杂信息
提供对话和对话
增强语气和个性

将声音应用于 UI

声音可以表达交互并加强特定的功能.

声音使用案例

声音可以提供反馈,或者在应用于重要时刻增强用户体验。

声音作为反馈

通过将操作或状态更改链接到音频提示,可以将声音应用于交互。这些声音被称为耳标,它们可以表示信息,动作或事件。它们的声音可以强化交互的意义以及产品的美学,情感和个性。

为了将耳标适合特定的环境,它可以使用来自现实世界情况的灵感进行设计,也可以专门发明以表达抽象概念。基于现实世界经验的熟悉声音被称为拟态。

声音作为装饰

用于装饰的声音可以放大富有表现力或俏皮的时刻。它通常用于传达情绪状态。这种类型的声音应该明智地使用,并保留在具有高情感共鸣的时刻。

谨慎使用装饰性声音,仅限于强化产品主题和独特声音的时刻。

何时不使用声音

在UI设计中建立沉默与知道何时应用声音同样重要。在许多情况下,声音是不需要的,它实际上会分散用户的注意力和舒适度。与在视觉设计中使用负空间类似,沉默为其他元素获得焦点创造了一个空间。

例如,声音通常不适合:

  • 需要隐私或自主性的UI
  • 设置了免打扰的用户
  • 经常执行的操作

在任何情况下,声音都应该提升视觉体验,而不是减损视觉体验。

Hero sounds

Hero sounds是产品和品牌的代表,突出了重要时刻,唤起了情感状态或表达了庆祝。

它们发生在关键交互中,例如:

  • 庆祝用户采取的重大积极行动
  • 欢迎用户使用新的应用或体验
  • 确认产品用途的关键时刻

Hero sounds很少出现,并且由于它们的突出性,它们应该以一致的方式应用。
声音可以表达成功感、成就感或奖励感。此 UI 使用英雄声音来庆祝用户完成收件箱中的所有项目。

Notifications

通知是引起用户注意的突出请求。它们的主要作用是帮助引导用户的注意力,并且它们提供了一个机会,为强调的交互提供自定义的声音标识。由于它们在 UI 中比其他声音更频繁地出现,因此它们通常应比英雄声音短,并且适合多次播放。

环境因素

通知应设计为从用户与产品的可变距离范围内以及嘈杂的环境等场景中听到。声音本身可以变化以吸引耳朵的焦点,使用节奏,音调和频率变化。

建议提供允许用户个性化通知的选项,其选项范围从基本的非装饰性声音到丰富的装饰性声音。

通知和告警

通知可以使用自定义声音传达可操作的 UI 元素。
警报使用更明亮的音色和充满活力的构图来引起注意或传达紧急信息。

铃声、闹钟和计时器

铃声,闹钟和计时器是通常具有俏皮风格的警报。它们可以定制,以适应用户偏好和品牌个性。

系统声音

主要用户体验声音

主要 UX 声音由操作系统(或设备)生成,以提供用户反馈。他们可以将声音添加到任何交互中,例如:

* 菜单导航
* 确认用户的直接操作

  • 数据输入

它们应该与产品的声音美学相协调,同时保持简单和低调。

用途

这些声音比 UI 中的其他声音更频繁地出现。因为它们在整个体验中都是重复的,所以它们应该适合频繁播放(而不会感到烦人或多余)。

例如:

  • 当用户点击在导航按钮时, 使用温和的声音给用户以反馈, 从而提高UI的易用性。
  • 当用户点选中某项内容时, 使用温和的声音给用户以反馈, 从而提高UI的易用性。

辅助 UX 声音

辅助 UX 声音在 UI 中播放的频率较低。它们应该反映产品的个性,但它们主要用于功能目的,通知用户状态更改或指示不频繁的操作。
例如:

  • 可以用微妙的音调表示内容刷新。
  • 可以用某种音调通知用户当某些内容不可操作。

环境声音

环境声音是一种装饰性的声音,在传达产品的个性或品牌的同时表达情感。

它可以放置在需要强大声音元素的体验中的任何位置,例如:

启动流程,欢迎听众体验
主屏幕的伴奏,用于在 UI 中表达情感基调和用户的位置
环境声音应该提供氛围,而不是减损用户执行任务。它还可以通过更改音乐的音调来指示状态的变化来提供提示。

环境声音可以基于音乐、环境声音或其他创造氛围的声音。

声音的属性

声音可视化

声音具有可测量的特征,可以指示声音在产生所需效果方面的效果。描绘这些特征的技术称为声音可视化。在图形上,x 轴描绘一个特征(如时间),y 轴描绘另一个特征(如振幅)。在某些情况下,仅使用单个轴绘制特征。

这些指南描述了如何将声音可视化为时间,频率(声音的高音调或低音调)或音色(声音的特征)的函数。

时间

要将声音表示为时间的函数,在 x 轴上显示时间,在 y 轴上显示振幅。此图显示了声音随时间变化的形状,因此其峰值的清晰度(或柔和度)是显而易见的。

频率

将声音表示为频率函数的一种方法是在 y 轴上显示振幅,在 x 轴上显示频率。这显示了一种声音相对于另一种声音的音高。

音色

要将声音表示为音色的函数,可以在 y 轴上显示振幅,在 x 轴上显示音色属性。音色的许多方面都可以直观地表示,您可以选择要显示哪些方面很重要。

声音的音色描述了它的质量和特征(不考虑它的音高或音量)。

音色的种类

在探索不同的音色时,有许多特征需要考虑。音色的一个方面可以根据您的用户体验进行样式设置,即亮度(高频声音的数量):

明亮的声音具有更多的高频内容,使其具有更大的存在感。
哑音声音的高频内容较少,使其声音微妙而安静,尤其是在嘈杂的环境中。

每种声音类型都适用于不同的环境。更明亮的音色感觉更丰富和俏皮。柔和的音色感觉更沉重,更严肃。

在选择产品的音色时,请考虑其受众和每个声音播放的背景。

音调

音调是指两种类型的声音:

音调声音,本质上更具音乐性,包括旋律,主题(motif)和和声
无调性声音(也称为非谐波声音),类似于日常声音或噪音 - 它们不符合传统的音乐作品
声音可以使用音调或无调性元素进行设计,有时声音将由两者组成。音调声音最能传达个性、情感和状态变化,而无调性声音则更好地支持运动过渡并表达触觉反馈感。

音调声音

旋律是一种音调声音,具有短而有节奏的奇异音高序列。简单明了的旋律可以在UI中重复,并且干扰最小。

共用主题

主题是重复的旋律,使其成为可识别的模式。共用主题可以快速有效地传达简单的情感和信息线索。

无调性声音

无调性声音通常适用于不是旋律的声音,这意味着触觉反馈,运动或拟态的感觉。

拟态声音

当交互具有很强的现实世界关联时,例如与相机一起单击照片快门时,应使用拟态声音。其他非谐波声音包括关闭卡片时的轻扫声,或附加到选择项目的点击声。

dynamics

在声音设计中,动力学是指在微观尺度(音量变化为单个声音)或宏观尺度(音量变化为一组声音)上的变化或响度的变化。动态变化使声音感觉自然而逼真。动态变化可以突出感兴趣的声音时刻,通过音乐叙事创造进步感,并赋予声音自然的品质。

Envelope

声音的包络是指声音振幅随时间的变化。包络由许多技术组件组成,但两个最基本的是声音的上升(攻击)和下降(衰减)。

  • Attack是指声音在达到最大振幅之前的初始速度。

  • decay是指声音振幅在受到攻击后(直到其振幅为零)减小的量和速度。衰变越大,声音的感觉就越长,越慢。

音效

混响和延迟是可以增加空间感和深度感的效果。为了防止音效在耳塞声音中变得过于突出,应谨慎使用它们。

声音的混响和延迟越多,声音就越湿,而不是干涩。

混响

混响或混响效果是应用于声音的效果,使其更具存在感。当巧妙地使用时,它会产生在现实环境中听到声音的效果。

延迟

与混响类似,延迟使用原始声音的回声与该声音混合在一起以创建装饰效果。应有目的地谨慎使用延迟。

声音编排

可以编排声音以表达层次结构,关系并优化您的产品体验。

声音层次

在编排产品中播放的声音时,每个声音都应反映其在 UI 层次结构中的重要性级别。声音的突出性和个性应该适合其水平,并且相同类型的声音(例如英雄声音)具有相同的层次结构级别。

High in the hierarchy

层次结构中较高的声音是品牌或产品的重要表示形式。

Peer sounds

在用户流中,彼此跟随或之前的声音应具有相关的属性(如音色、旋律)。

Priority Sounds Type of sounds
1 Brand sounds Mnemonic
2 Hero sounds Celebration moments
3 Alerts and notifications Ringtones and alarms Notifications
4 Primary UX sounds Main UX sounds
5 Secondary UX sounds Functional sounds

//TODO: to complete the traslation of Sound choreography (声音编排)

声音资源

下载这组音频文件以在您自己的产品中使用,包括适用于各种场景的声音:

  • Alerts and notifications
  • Hero sounds
  • Primary system sounds
  • Secondary system sounds

DOWNLOAD MATERIAL PRODUCT SOUNDS

在 CC-BY 4.0 许可下可用。下载这些文件即表示您同意 Google 服务条款。Google 隐私权政策介绍了此服务如何处理数据。

参考文档

Material Sound

posted on 2022-07-15 17:14  eagle.supper  阅读(87)  评论(0编辑  收藏  举报