WEB・IT業界で働く人々の人生を少し豊かにするメディア

CAREER HACK

任天堂が新人研修で伝えている、あそび心のデザイン|娯楽のUI 公式レポート #1

2018-05-21

任天堂が新人研修で伝えている、あそび心のデザイン|娯楽のUI 公式レポート #1

任天堂の新人研修で語られているのは「あそび心を伝える」という大切さについて。『スーパーマリオメーカー』を例に、UI/UXデザインチーフである正木義文さんが語ってくれた。

[目次]
・「みなさんとクイズをしたいと思います」
・任天堂流「伝え方」のこだわり
 ⅰ教えるよりも体験してもらう
 ⅱファーストインプレッションを大事にする
 ⅲ体験は面白く
・わかりやすさと高機能を兼ね備えた、UIのデザインプロセス
・「あそび心を伝えるUIデザイン」3つのポイント
 ⅰUI脳と娯楽脳の二人三脚
 ⅱ短所を「娯楽脳」で長所へ変える
 ⅲ将棋3席 麻雀5席

「みなさんとクイズをしたいと思います」

※ 2018年4月に開催された「UI Crunch #13 娯楽のUI - by Nintendo -」のレポート記事としてお届けします。


「まずは、みなさんとクイズをしたいと思います」

そんな、あそび心溢れる一言で幕を開けた『娯楽のUI - by Nintendo -』。任天堂で働く現役デザイナーによるデザイン解説セッションだ。

UI/UXデザインチーフである正木義文さんが語ったテーマは「あそび心とUI」について。

開始早々、たくさんの選択肢が羅列されたスライドが映し出された。

+++

クイズの質問は「UIとは何の略か?」を問うもの。持ち時間は5秒と、わずかな時間の中で正解できた参加者は0名だった。

UIデザイナーが集うイベントで、UI(User Interface)についての問題。なぜ、誰も答えることができなかったのだろう。

「この選択肢の数は誰がどう見ても多すぎますよね。答えが分かっていたとしても5秒では見つけられない。明らかに情報過多なので、適切な問題とは言えません。UIが悪いとクイズにもならないんです」

実はこのクイズ、任天堂の新人デザイナーの研修に使われているもの。この研修を通して新人デザイナーはユーザーへの「伝え方」のポイントを学んでいく。

正木さんは続けて、任天堂流「伝え方」のポイントを解説してくれた。

+++

[プロフィール]正木 義文 (MASAKI yoshifumi)  UI/UX デザイン チーフ
多摩美術大学でグラフィックデザインを学んだ後、2005年に任天堂入社。 UI/UXデザイナーとして多数のゲームソフトを開発しつつ、現在はUIデザイン開発チーフとしてゲームソフトのUIクオリティを統括している。 UIデザインのなかに、機能や実用性だけでなく楽しさやユーモアを盛り込むことを得意とする。

《担当プロダクト》
Nintendo Labo (Nintendo Switch, 2018)
どうぶつの森 ハッピーホームデザイナー(ニンテンドー3DS, 2015)
とびだせ どうぶつの森(ニンテンドー3DS, 2012)
nintendogs +cats(ニンテンドー3DS, 2011)
New スーパーマリオブラザーズ Wii(Wii, 2009)
ニンテンドーDSi OSデザイン(ニンテンドーDSi, 2008)

任天堂流「伝え方」のこだわり

image

任天堂では人に何かを伝える際、3つのポイントがあるという。正木さんの解説と共にご紹介しよう。


1,教えるよりも体験してもらう

「よくユーザーの立場になって考えようと言われますが、それよりもまずは自分で一度体験する。どれだけ情報をインプットしたとしても、体験してみなければ分からないことがありますよね。木のないところで木登りの危険さは教えられない。だからこそ、何事もやってみることが重要だと思います」


2,ファーストインプレッションを大事にする

「これはすごく大事なこと。初めての体験は貴重で、1度きりしかないんです。新鮮な気持ちを味わう。同時に裏側で飽きる気持ちが芽生えはじめ、最終的には新鮮さを忘れてしまいます。それでも新鮮な気持ちが嬉しいということは誰もが共感できること。だからこそ、初めての体験が特別で、価値のある時間になるよう、ファーストインプレッションを大事にしています。最初に関心を持つ量が高ければ、そのあとの関心量も大きく変わっていくはずです」


3,体験は面白く

「ここで言う面白さは、感情を動かすことです。単純に喜怒哀楽の『楽』だけを指しているわけではありません。伝え方によって感情が動くものにできます。そして、その動いた感情は次の行動を生み出してくれます。特に想定しないことが起きると感情は大きく動かされるもの。想像の一歩先を行く、予想外のことを提供する準備は体験にはとても重要です」

「わかりやすさ」と「高機能」を備えた、UIデザインプロセス

image

続いて正木さんが紹介してくれたのが、「あそび心を伝えるUI」について。Wii U用ゲームソフト『スーパーマリオメーカー』のデザインプロセスを例に語ってくれた。

『スーパーマリオメーカー』はマリオが駆け抜けるコースを自分でつくり、遊ぶゲームだ。そのため、初めてゲームをプレイする人でも楽しめる「わかりやすさ」が求められる。一方で、コース作成にもこだわる人向けに「高機能」であることも求められた。

わかりやすさと高機能――相反する(ように感じる)2つの要素をいかに実現したのか。任天堂UIデザイナーがこだわったポイントの一つが「レスポンス」だ。



「『スーパーマリオメーカー』はアイテムを配置すると、1つひとつ何かしらレスポンスがあります。さらに配置が完了しても、レスポンスがあるようにしました。そうすることで、触っているうちに機能が発見されていく。あえて「高機能」を前面に押し出さないようにしています。『発見』という遊びを入れ、わかりやすさを保ちながら、少しずつ高機能を習得してもらう。“こんなたくさんの機能を覚えられないよ”という感情を、“こんなことができるんだ!すごい!”という驚きに変換しています」

もう一つ、正木さんは「プレイヤー以外の周りで見ている人たちも楽しめる」ということにこだわったと解説。Wii Uはゲームパッドとテレビ画面を組み合わせて遊べるのが特徴のゲーム機。その特性を踏まえたUIデザインといえるだろう。

「『スーパーマリオメーカー』はコース作成中、テレビ画面の方には大きな手が表示されます。ここで大切にしているのは、プレイヤー以外の人たちが見て楽しめる画面ということです。実際にコースを作成している人だけでなく、隣で見ている家族、友だちのことも配慮したデザインにしています」

image

「あそび心を伝えるUIデザイン」3つのポイント

最後に、正木さんは「あそび心を伝えるUIデザイン」のための考え方を3つにまとめてくれた。紹介していこう。


1,UI脳と娯楽脳の二人三脚

image

「UI脳」とは、商品機能を満たしたり、説明したりするための思考・知識のこと。「多くのUIデザイナーは誰しもが持っているもの」と正木さんは解説。この知識は業務効率をあげる武器でもある。しかし、その知識は、アイデアに制限をかけてしまうこともあると警鐘を鳴らした。

「たとえば、『スーパーマリオメーカー』でのクリボーがキノコの2つ目を吐き出すシーン。UI脳だけだと、キノコを受付ないように「事前に禁止マークを表示する」、という案で終わっていたかもしれません」

もう一方の「娯楽脳」はあそび心を考え、表現する脳みそのこと。正木さんはこの2つの脳を両立させ、二人三脚でUIデザインを進めていくべきという。

「UI脳のみではアイデアが制限されしまうし、娯楽脳だけではアイデアが溺れていく。UI脳で娯楽脳を支え、娯楽脳でUI脳を加速させる。あそび心を伝えるには、二人三脚のように2つの脳を使ってUIデザインを進めることが大切です」


2,短所を「娯楽脳」で長所へ変える

image

『スーパーマリオメーカー』を例に考えると、「ユーザーに学習してもらわないと“高機能”が習得ができない」ということが短所だった。ただ、そこに遊びの要素を取り入れることで短所が長所に変わった。そこにあったのは発想の転換だ。

「娯楽と認識されないもの、日頃面倒なこと、つまらない行為も『娯楽脳』を使えば遊びに変わる可能性があります。一度も検討せず、これは娯楽とは関係ないものだ…と決めつけてしまうのは非常にもったいないことだと思います」


3,将棋3席 麻雀5席

image

将棋のプレイ人数は2人、麻雀のプレイ人数は4人。上記の数字はそれぞれ一つ多い。つまり「まわりで見ている人もプレイヤーである」という考えを表している。

「ビデオゲームがなかった時代の娯楽の世界、たとえば、将棋や双六、福笑いでもプレイヤーだけが楽しいだけではなく、まわりで見ている人も楽めるといった価値があったのだと思います。娯楽文化が「床」や「テーブル」から、テレビの登場によって「側面」に変わりました。ただ、『娯楽の共有』という価値は、昔も今も全然変わらない。だからこそ、しっかりと付き合うべき。娯楽に触れる人のみが娯楽体験をできるのではなく、娯楽品をとりまく全体が娯楽体験。席をひとつ多く準備しましょう」

こうして幕を閉じた正木さんセッション。次回は「スプラトゥーンUIの狙い」をお届けする。

次回「スプラトゥーンUIの狙い」に続く
※全3回にわたって『娯楽のUI - by Nintendo -』公式レポートをお届けします。



CAREER HACK をフォロー

タグ一覧