noteが目指す創作をつづけるためのエモーショナルデザイン

Transcript

2. note inc. 2 松下ゆき @yuki_doro note株式会社 デザイナー 2014-2018 Yahoo! Japan 2018.11- note
3. note inc. 本日の内容 noteにあげています！ 3
5. どんなサービス？ どんなイメージ？
6. 6 デザイナーがよく記事書いてる… 白くてシンプル… 「クリエイティブ系」っぽい？… 手軽に文章を発信するなら…
7. note inc. エモーショナルデザイン 7
8. note inc. なぜ、エモーショナルデザイン？ noteとエモーショナルデザイン 8 1 2
9. note inc. なぜ、エモーショナルデザイン？ 9 1
10. 10 80% なぜ、エモーショナルデザイン？
11. 11 80% DLされた後使われなくなるAPP なぜ、エモーショナルデザイン？
12. 12 「使えるから使う」の時代は終わった。 なぜならどのサービスも「使える」から
13. note inc. なぜ、エモーショナルデザイン？ 「使える」 「使い続けたい」 13 プロダクトの魅力も必要になった
14. 誰のためのデザイン？ 「使いやすいデザイン」の重要さを 説いた エモーショナル・デザイン 使いやすさだけでなく「情動」のUX もプロダクトの魅力には必要 14 ノーマンにも変遷 なぜ、エモーショナルデザイン？
15. note inc. なぜ、エモーショナルデザイン？ エモーショナルデザイン 15 =トーンと使い心地を通しポジティブな感情をもたらす デザインを行う
16. note inc. プロダクトは いかに「お気に入り」になるか？ 16 なぜ、エモーショナルデザイン？
17. なぜ、エモーショナルデザイン？ 17 おしゃれなあの人 が推してたペン、 気になる… わ〜かっこい い！！まさに欲し かったやつ！！！ 使い心地も機能もよ くて気持ちいい！ いっぱい使っちゃう ライフスタイルに合っ てる！もっとカッコい い自分になれそう！
18. なぜ、エモーショナルデザイン？ 18 本能レベル 人間の認知と情動に関する三つの処理 参照: ドナルド・A・ノーマン「エモーショナル・デザイン」 五感で感じるトーン 色・形のフィーリング 行動レベル 実際の使い心地 機能設計 内省レベル 総合的にもたらされる 感情・状態
19. なぜ、エモーショナルデザイン？ 19 おしゃれなあの人 が推してたペン、 気になる… わ〜かっこい い！！まさに欲し かったやつ！！！ 使い心地も機能もよ くて気持ちいい！ いっぱい使っちゃう ライフスタイルに合っ てる！もっとカッコい い自分になれそう！ 本能レベル 行動レベル 内省レベル 内省レベル
20. なぜ、エモーショナルデザイン？ 20 いい内省＝「こうありたい」自分に重なる
21. なぜ、エモーショナルデザイン？ 21 本能レベル 　Airbnbのエモーショナルデザイン事例 五感で感じるトーン 色・形のフィーリング 行動レベル 実際の使い心地 機能設計 内省レベル 総合的にもたらされる 感情・状態 クオリティの高い写真 画像が大きく旅の イメージが膨らむ 宿泊先を適切に条件絞 り込みが可能、ホスト ともクイックにチャッ トで連絡がとれる 魅力的な宿泊先が選べそう！ 素敵な旅になるんだろうな！ ワクワク感
22. note inc. 実は…デザイナーが潜在的に やってきたこと 愛せるプロダクトの理由は、合理性や機能性だけではない 22 なぜ、エモーショナルデザイン？
23. note inc. 愛は数値で説明しづらかった でも 愛せるプロダクトには理由がある 23
24. note inc. 24 なぜ、エモーショナルデザイン？ 数値で目指す 「使いやすさ」 「感情」 を見越した設計 どっちも大事
25. note inc. 25 • 「使い続けたい」にはプロダクトの魅力も必要になった • エモーショナルデザインはそのアプローチのひとつ • 「本能(トーン)」「行動(使い心地)」から「内省(総合的な印象)」がもたら される なぜ、エモーショナルデザイン？ まとめ
26. note inc. noteとエモーショナルデザイン 26 2
27. note inc. エモーショナルデザインの必然性 27
28. 28 noteとエモーショナルデザイン エモーショナルデザインは必須か？ →NO。圧倒的な機能差や生活必須度で勝負できるのなら不要。 noteは強みのひとつに、エモーショナルデザインを選んできた。
29. note inc. noteのミッション だれもが創作をはじめ、 続けられるようにする。 29 noteとエモーショナルデザイン
30. note inc. 人はポジティブな感情にあると、 好奇心が高まり、より創造的になる 30 noteとエモーショナルデザイン
31. 31 noteとエモーショナルデザイン ポジティブな感情が創作につながるはず 創作をミッションに掲げている以上、感情は避けて通れない要素
32. note inc. エモーショナルデザインの実践 32
33. エモーショナルデザインの実践 33 本能レベル もたらしたい内省を定義し、一貫して設計 五感で感じるトーン 色・形のフィーリング 行動レベル 実際の使い心地 機能設計 内省レベル 総合的にもたらされる 感情・状態 設計に反映していく
34. エモーショナルデザインの実践 34 本能レベル 　　noteの目指すエモーショナルデザイン 五感で感じるトーン 色・形のフィーリング 行動レベル 実際の使い心地 機能設計 内省レベル 総合的にもたらされる 感情・状態 プレーンかつ柔らかく 優しい、使う人を選ば ないトーン 相対評価に寄りすぎな い機能設計 歩みを振り返れる 創作をつづけてる自分って なんだかいい感じ 作っている自分のことが好き
35. note inc. 内省の定義 35
36. 36 noteとエモーショナルデザイン めざす内省（感情・状態）の言語化
37. 37 noteとエモーショナルデザイン 創作をつづけてる自分って、なんだかいい感じ 作っている自分のこと、ちょっと好き 💞 もたらしたい内省
38. 38 noteとエモーショナルデザイン 周りに比べて自分は全然ダメだ… ツールとしてイケてなくてテンション下がる… 💔 こんな内省はいやだ
39. note inc. 内省をふまえ トーンと使い心地を設計 39
40. エモーショナルデザインの実践 40 本能レベル 　　noteの目指すエモーショナルデザイン 五感で感じるトーン 色・形のフィーリング 行動レベル 実際の使い心地 機能設計 内省レベル 総合的にもたらされる 感情・状態 プレーンかつ柔らかく 優しい、使う人を選ば ないトーン 相対評価に寄りすぎな い機能設計 歩みを振り返れる 創作をつづけてる自分って なんだかいい感じ 作っている自分のことが好き 設計に反映していく
41. 41 noteとエモーショナルデザイン 目指す設計方針の言語化 誰でも「自分のための創作の場」と思える 自分の作品に集中できる 創作するほどに、自分を肯定できる
42. 42 noteとエモーショナルデザイン 目指す設計方針の言語化 誰でも「自分のための創作の場」と思える 自分の作品に集中できる 創作するほどに、自分を肯定できる
43. 43 noteとエモーショナルデザイン 誰でも「自分のための創作の場」と思えるには？ →エッジも、強いキャラも「ない」のが「いい」
44. 44 視覚的なノイズの少なさによる、心地よさ 要素を絞っているからこそ、 どんな表現でも受け皿になる noteとエモーショナルデザイン
45. 45 プレーン、でもやさしいビジュアルトーンとライティング イラストも、個性を立てすぎず心地よくなじむ トーンに 無機質すぎず、かつカジュアルすぎないライ ティング noteとエモーショナルデザイン
46. 46 noteとエモーショナルデザイン 目指す設計方針の言語化 誰でも「自分のための創作の場」と思える 自分の作品に集中できる 創作するほどに、自分を肯定できる
47. 47 noteとエモーショナルデザイン 自分の作品に集中するためには？ →「周りと比べる」が目的にならないほうがいい
48. 48 数字上の「人気記事」をフューチャーしすぎない noteとエモーショナルデザイン PVやスキ数上位ではなく、実際 に目を通して記事をピックアッ プ 「ランキング」UIはあえて不在に している
49. 49 自分が取り組みたいジャンルで活動できる noteとエモーショナルデザイン 各ジャンルを明示し、さまざまなクリエイ ター自身が活動したい領域を発見できる ジャンルごとでの活動で挑戦できる取り組み
50. 50 noteとエモーショナルデザイン 目指す設計方針の言語化 誰でも「自分のための創作の場」と思える 自分の作品に集中できる 創作するほどに、自分を肯定できる
51. 51 noteとエモーショナルデザイン 創作するほどに、自分を肯定するためには？ →反響は諸刃の剣なので取り扱いに注意。特に、否定的な反響は…
52. 52 リアクションの機能バランス 明示的にサクッとできるリアクションは「ス キ」に絞っている コメントはあえて上に置きすぎず、さらにコメ ント時の「深呼吸」モーダルを表示 noteとエモーショナルデザイン
53. 53 自身の歩みを振り返れる工夫 クリエイターそれぞれ、どれだけ の歩みがあったかを絶対評価で振 り返ることができる noteとエモーショナルデザイン
54. エモーショナルデザインの実践 54 本能レベル 　　noteの目指すエモーショナルデザイン 五感で感じるトーン 色・形のフィーリング 行動レベル 実際の使い心地 機能設計 内省レベル 総合的にもたらされる 感情・状態 プレーンかつ柔らかく 優しい、使う人を選ば ないトーン 相対評価に寄りすぎな い機能設計 歩みを振り返れる 創作をつづけてる自分って なんだかいい感じ 作っている自分のことが好き 設計に反映していく
55. note inc. エモーショナルデザインの結果観測 55
56. note inc. エモーショナルデザインの 結果観測ってできるの？ →選択肢はある 56 noteとエモーショナルデザイン
57. 57 noteで行っている結果観測手法 定期アンケートでどういうイメージ・感情を得 ている人が多いのかを調査 インタビューによる定性的な反響分析 noteとエモーショナルデザイン
58. 得られた成果① 「場としての雰囲気」が価値としてあげられ、 情緒的な項目への当てはまりが大きいほど、NPSも高くなった 58 noteとエモーショナルデザイン
59. 得られた成果② インタビューでnoteについて 「やさしい反応が多く、治安が良い」「手軽に取り組めるし、書くこと の楽しさに目覚めた」という声が。設計が実感値に結びついている 59 noteとエモーショナルデザイン
60. note inc. 一歩一歩 積み上げている💪 60 noteとエモーショナルデザイン
61. note inc. まとめ 61
62. note inc. 62 • noteがエモーショナルデザインを選んでいる理由→プロダクトの強み作 り、「創作」での必須性 • どう実践してるか→「内省」を定義し、一貫した設計を各要素に取り入れ ていく • 結果観測は→アンケートやインタビューで「感情・イメージ」を定点観測 している noteとエモーショナルデザイン noteとエモーショナルデザイン
63. note inc. 「使いやすい」だけでは辿り着けない、 魅力あるプロダクト設計を 目指しています 63
64. note inc. 魅力あるプロダクトを 作るための学びに 少しでもなっていますように😌 ご静聴ありがとうございました‼ 64
65. note inc. いろんな角度で デザイナーが活躍している会社です💪 全力で募集中！！！ 65 採用ページ https://open.talentio.com/r/1/c/note/pages/34186