note_自己紹介_アートボード_1_のコピー_14

Hatena Design Hour #7 に参加してきました!

こんにちは、マスダです。
ついに、社外に出てデザイナーイベントに参加してきました。とても勉強になったイベントなので、印象に残ったことをちょこっとご紹介したいと思います。(私の考えも入り混じったイベントレポートですが、ご容赦ください)

今回参加したイベントはHatena Design Hour #7 。株式会社はてなさんが主催する、Webサービスが大好きなデザイナーのためのイベントです。はてなのデザイナーさんが実際の業務のなかからホットなトピックを持ち寄って、デザインの見どころだとか制作の裏話を紹介してくれました。
そんな中で、自分の印象に残った部分を書いていきたいと思います。

ユーザーとサービスがスムーズに対話できるようなUIが大切

これは、Mackerelというサービスのダッシュボードをリニューアルしたという話の中ででてきたものです。
UIを作る上で大切なことは視覚言語から考えること。視覚言語というのは視覚的に意味を持ったスタイルのことで、フォントとかアイコンとか線とかUIを作る上ででてくる目に見える要素のことだそうです。
視覚言語の役割としては、サービスの情報を線やアイコンなどの視覚言語にしてわかりやすくユーザーに意味を伝えること。たとえば、実線は要素の区切りを表す、点線の中はユーザーがアクションできる範囲を表すとか。ほかにも、動かすことのできる線にホバーすると色が濃くなるだとか、重なるオブジェクトの種類によってレイヤーの透明度を変化させるだとか、ユーザーのアクションによっても視覚言語の表現が変わるようにすることで、なにができるのか(できそうなのか)を伝えることができると言っていました。
また、既存サービスのリニューアルや新機能の追加をするときはすでにある視覚言語と同じルールで作り、ユーザーが迷わないようにすることも大事なんだとか。たしかに、リニューアルのたびにUIのルールが変わっているとユーザーもついていけなくなるよな…と思います。

ブレストは経験差とか知識差を埋めることも目的である

これはサービスのキャラクターを作成する話を聞いていた時に出てきました。ブレストっていろんな角度から意見を出し合うことが目的と思ってしまいがちなのですが、デザイナー歴に差があるとそもそも経験や知識の量が違うので、当たり前が当たり前として通じなくなってしまう時ってあるものです。
なので、わからないことが出てきたら恐れずに「それってどういうことですか?よくわかんないです。」とはっきり伝えてブレストの中でみんなの共通認識を作っていくという作業がとても大切です。
また、本題のキャラクター作りはというと、作成期間は1ヶ月で制作メンバーは2人。ブレスト&ヒアリング、キャラクターの方向性をまとめる・パターン分けする、ラフスケッチ、レビューというのを1〜2週間単位で繰り返したそうです。最後にぽろっと出てきた案が採用されたりなどもあるけれど、それも今まで作ったり考えてきた過程があってこその産物なので、決して過程は無駄ではないとのこと。なるほど〜。

グロースハックしたいなら、仲間を集めよう!

ABテストをしてみたけれど、うやむやになってどこかへ消え去ってしまった…。なんて経験ありませんか?私にはあります。。。
グロースハックを本気でやりたいならば、仲間を集めることがとても大切だそうです。その仲間とは「意思決定権のある人」「コードを触れる人」「体験とビジュアルを把握している人」の3人。最低限、これらの属性を持った仲間を集めることが大切。意思決定権がなければ、これやっていいのかな…?ダメ…?うーん…。と悶々とすることになります。また、実際にコードを触れる人も必要です。Webサービスというもの、コードを触らずして変更できるものはほとんどありません。そして、「体験とビジュアルを把握している人」、これがデザイナーです。デザイナーの役割としては、ユーザー目線で仮説立案をすること、そしてクリエイティブ(グラフィックとか)を作ることだそうです。サービスの骨格ともなるユーザー中心の考え方、とても重要ですよね。
また、ABテストはユーザーがアクションするところ(登録画面とか)を中心に、サービスの成長に影響を与えるところをテストしてみて、効果測定するのがいいそうです。

機能が増えても、もっともっとシンプルにする

これはとある漫画サービスの新機能開発のお話で出てきました。その機能は漫画1話を無料でレンタルすることができるチケット制です。ユーザーから「チケット制ないとかこのサービス使う理由がない」など辛辣なレビューがきたりなど、かなりの要望があったので追加した機能だそうです。
この機能の追加に伴って、レンタルした漫画のレンタル期間だとか、レンタル済みと購入済みのステータスとかを追加で表示しなければいけませんでした。
UIをシンプルにするためには、レンタル済み、購入済み、それ以外のステータスそれぞれで表示する要素の数(レンタル期限などの詳細情報やステータス情報)や表示する位置を同じにしてデザインの統一を図ったそうです。また、チケットを使用するのと購入するのとで異なるアクションであってもUIのフォーマットを統一することでわかりやすくする工夫などもありました。
このように、機能が増えたからといって、むやみやたらにUIのバリエーションを増やさないことがサービスの使いやすさにつながるのだそう。
機能が増えても、よりわかりやすく、もっともっとシンプルに。すごく大事なことですね。


以上、Hatena Design Hourのそれぞれの発表で印象に残ったことでした!はてなのデザイナーさんたち、参加されたデザイナーさんたちいい人ばかりでイベント後の懇親会もすごく楽しくて有意義な時間になったと思います。また京都で開催されたらぜひ参加したいです!

この記事が参加している募集

イベントレポ

この記事が気に入ったらサポートをしてみませんか?