UIデザインガイドライン

マテリアルデザイン|No.20:About sound|日本語解説

この記事から得られること

この記事では、Google社提供の「マテリアルデザイン」UIガイドラインの「About sound(サウンドについて)」の概要について学ぶことができます。

Material Design : Design section “About sound”
URL:https://material.io/design/sound/about-sound.html

なお、この記事は「約3〜5分」で読める内容となっています。

この記事の前提

この記事では、私が実際に「マテリアルデザイン」を読んだ経験から「理解しておくべき基本的な内容」を抜粋して紹介しています。

また、マテリアルデザインで使用されている専門用語は「英語のまま」使用しています。
理由は、日本語に翻訳しますと不自然な表現となるためです。
少し読みにくい部分もあるかもしれませんが、ご了承ください。

また、この記事は、記事上の各画像を細かく見ていただくためにも「パソコンでの閲覧」を推奨していますが、「スマホのブラウザ」でももちろん閲覧可能です。

なお、この記事を読み進めるなかで、もし分からない専門用語が多い場合は、「マテリアルデザイン」ガイドラインの最初の「概要編」の記事から順番に読み進めることをおすすめします。

マテリアルデザイン|No.00:概要と構成|日本語解説この記事では、Googleが提供しているUIデザインガイドライン「マテリアルデザイン(Material Design)」の概要と、そのコンテンツ構成について学ぶことができます。...

マテリアルデザインにおける “Sound”

マテリアルデザインでは、サウンド(音)を、以下の3つの種類に分類しています。

  • Sound design|操作のフィードバック
  • Music|音楽
  • Voice|音声

それでは、それぞれのサウンドの特徴について解説します。

“Sound design”|操作のフィードバック

1つ目の「Sound design」は、主にユーザーの「操作のフィードバック」に対して使用されるサウンドのことです。

「Sound design」を使用することによって、視覚情報のほかに、聴覚の情報として、ユーザーに「操作のフィードバック」を与えることができます。

例えば、以下のシーンで「Sound design」は使用されます。

  • 通知
  • 操作の完了通知
  • UIのアニメーション時の補完

マテリアルデザインのWebサイト上で、各シーンの「Sound design」例を確認できますので、ご興味がありましたら、ご確認ください。

Material Design : Design section “About sound” > Sound design
URL:https://material.io/design/sound/about-sound.html#types-of-sound

“Music”|音楽

2つ目の「Music」は、「UIの雰囲気(UIのストーリー)」を表現するために使用されます。

「Music」や画像などを組み合わせて使用することにより、ユーザーに対して、UIを操作した際の「楽しさ」や「UI全体の雰囲気」を伝えることができます。

こちらもマテリアルデザインのWebサイト上で、「Music」の例を確認できますので、ご興味がありましたら、ご確認ください。

Material Design : Design section “About sound” > Music
URL:https://material.io/design/sound/about-sound.html#types-of-sound

“Voice”|音声

3つ目の「Voice」は、音声もしくは合成音声によって、「Sound design」「Music」とは異なる情報を表現するために使用されます。

「Voice」を使用することにより、UIでは表現しにくい「複雑な情報」をユーザーに伝えたり、「UIとの対話」をユーザーに提供することができます。

こちらもマテリアルデザインのWebサイト上で、「Voice」の例を確認できますので、ご興味がありましたら、ご確認ください。

Material Design : Design section “About sound” > Voice
URL:https://material.io/design/sound/about-sound.html#types-of-sound

まとめ

繰り返しとはなりますが、マテリアルデザインでは、サウンド(音)を、以下の3つの種類に分類しています。

  • Sound design|操作のフィードバック
  • Music|音楽
  • Voice|音声

それぞれのサウンドの役割を理解し、UIに対して活用することによって、UIデザインの表現の幅が広がると思いますので、サウンドについては理解しておくことをおすすめします。

最後までお読みいただきありがとうございます。
今回の記事は以上です。

この内容がみなさんのUIデザインの勉強になりましたらうれしいです。
引き続き、UIデザインの勉強を一緒にしていきましょう。

続きを学びたい方は

なお、「マテリアルデザインの続き」を学びたい方は、よろしければこちらの記事もご確認ください。

次のガイドラインを学びたい方は
マテリアルデザイン|No.21:Applying sound to UI|日本語解説この記事では、Google社提供の「マテリアルデザイン」UIガイドラインの「Applying sound to UI(UIへのサウンド適用)」の概要について学ぶことができます。...

一つ前のガイドラインを学びたい方は
マテリアルデザイン|No.19:Language support|日本語解説この記事では、Google社提供の「マテリアルデザイン」UIガイドラインの「Language support(多言語対応)」の概要について学ぶことができます。...

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA