Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Upcoming SlideShare
企画が考えるスマホUIデザイン
Next

Share

心地よいUIの温度 - 言葉と気遣いで高めるUI -

Event : UI温泉 in 綱島温泉 2015.02.07
Speaker : 割石裕太 / wariemon - UI Designer @KAYAC inc. / OH

UI温泉 - UIと湯を愛するイベント -
4番目のスピーカーとして登壇させていただきました。
UI と 温泉 の共通点として「心地よい温度」を見出し、
そこに至るまでのフローを考えた内容となっております。

Related Books

Free with a 30 day trial from Scribd

See all

心地よいUIの温度 - 言葉と気遣いで高めるUI -

  1. 1. OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. Speaker No.4 / KAYAC inc. 割石 裕太
  2. 2. 割石 裕太 KAYAC inc. Designer (2012.4 - ) 自己紹介 @KAYAC inc. OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  3. 3. @wariemon Art Direction & Web / App / Blanding / Logo Design OH : http://wariemon.com 自己紹介 @OH (Personal Work) OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  4. 4. つくっているもの Filters - Filter Camera & Platform - Lobi - Chat & Game Community - OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. KAYAC 唯一の サービス の UIデザイナー です
  5. 5. Lobi - Chat & Game Community - http://web.lobi.co/ OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  6. 6. Lobi - Chat & Game Community - http://web.lobi.co/ OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  7. 7. Filters - Filter Camera & Platform - http://filters.kayac.com OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  8. 8. Filters - Filter Camera & Platform - http://filters.kayac.com OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  9. 9. Filters - Filter Camera & Platform - http://filters.kayac.com OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  10. 10. UIと温泉 難しいお題… OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 前段 - UIと温泉
  11. 11. UIと温泉の共通点 前段 - UIと温泉 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  12. 12. 心地よい温度を保つことが、 非常に大事。 前段 - UIと温泉 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  13. 13. 人が心地よいと思えること がゴールなのでは。 前段 - UIと温泉 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  14. 14. …ということで、 ここより本編です! 前段 - UIと温泉 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  15. 15. 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 言葉と気配りでさらに高めるUI
  16. 16. 今回はいわゆる デザインそのものより、 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  17. 17. 言葉や、ちょっとした気遣い に注目した内容です。 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  18. 18. 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 意味が伝わるか 呼びかけているか 生きているか 全体把握とコントロール 行動提案 人間的要素
  19. 19. 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 意味が伝わるか 呼びかけているか 生きているか 全体把握とコントロール 行動提案 人間的要素 ユーザーにとって心地よい温度
  20. 20. 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 意味が伝わるか 呼びかけているか 感情はあるか 全体把握とコントロール 行動提案 人間的要素 ユーザーにとって心地よい温度
  21. 21. みなさんのチームの、 ワーディング 担当はだれですか? 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  22. 22. ぼくはこの領域もUIデザイナーが、 担当するべきだと考えています。 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  23. 23. なぜならワーディングは UI の 正しく意味が伝わっているか を司る重要な要素であるからです。 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  24. 24. なぜならワーディングは UI の 正しく意味が伝わっているか を司る重要な要素であるからです。 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  25. 25. ふとした言葉のひとつに、 気配りが足りないだけで、 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  26. 26. 熱は冷めてしまうものです。 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  27. 27. 今回、Filters の新規開発では 私が遷移を全部書き起こし、 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  28. 28. エラーの把握とワーディングも 担当しました。 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  29. 29. 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 全遷移を書き起こし、文言の把握を行います。
  30. 30. 全体を把握しておくことで、 ユーザーの熱を冷まさせることなく 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  31. 31. 次に行う「行動の提案」も 漏らさず行うことができます! 1. 意味が伝わるか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  32. 32. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 意味が伝わるか 呼びかけているか 生きているか 全体把握とコントロール 行動提案 人間的要素 ユーザーにとって心地よい温度
  33. 33. ユーザーに伝わる言葉で、 説明できるようになったら 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  34. 34. 話しかけたり、提案をして、 コミュニケーションに持ち込みましょう。 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  35. 35. 内容は具体的であればあるほど、 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  36. 36. ユーザーは悩むことなく判断すること ができます。 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  37. 37. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. ほぼ一緒に見えますが、
  38. 38. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. ここが違います!
  39. 39. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 提案 になったことで、
  40. 40. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 参加してからのアクションが明確に。
  41. 41. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. ユーザーへの行動の提案 機械的(システム的)文言 正しく伝わる言葉
  42. 42. 2. 呼びかけているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. はじめの地点からすると、ずいぶんと 心地よい温度になったのでは!
  43. 43. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 意味が伝わるか 呼びかけているか 生きているか 全体把握とコントロール 行動提案 人間的要素 ユーザーにとって心地よい温度
  44. 44. 最後は、少し前の2つとは違う アプローチのお話です。 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  45. 45. 事例をベースに 細かな遊び心(気遣い)で 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  46. 46. ユーザーに熱を持ったまま、 サービスに参加して頂けたお話です。 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  47. 47. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 以前までの Lobi のログイン画面
  48. 48. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 問題はないですが、
  49. 49. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 温度の低いものでした。
  50. 50. そして今回、ログイン画面の 大改修を行いました! 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  51. 51. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  52. 52. デザイン自体が大きく変わったことも ありますが、 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  53. 53. ひとつ、生きているように感じる ギミックをいれてみました。 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  54. 54. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 入力画面で間違えると、
  55. 55. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. びっくりします。
  56. 56. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. もちろん正しく入力すると、
  57. 57. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 喜びます。
  58. 58. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. クールなデザイン案より、
  59. 59. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 感情あるキャラクターを表に出し、
  60. 60. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. ログインのフローも一緒に
  61. 61. 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 熱をもって接してくれる。
  62. 62. デザインの改修後、 新規ユーザーの継続率が伸び、 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  63. 63. 新規登録・ログイン の突破率を 上げることにも成功しました。 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  64. 64. 入り口から熱をもって迎え入れれば、 そのあともいい温度を持って 楽しんでくれる。 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  65. 65. 今回の話のまとめとなる お話でした。 3. 生きているか OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  66. 66. 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. 意味が伝わるか 呼びかけているか 感情はあるか 全体把握とコントロール 行動提案 人間的要素 ♨ ユーザーにとって心地よい温度
  67. 67. 数字を上げる施策も、 サービスの体験を変える施策も、 数多ありますが、 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  68. 68. 熱をもった言葉と細かい気配り、 心地よい温度で楽しんで頂く。 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  69. 69. ひとを気遣う視点をもつことと、 ひとをつなぐサービスの発展は、 共にあると思います。 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  70. 70. それではみなさん、 湯冷めしないように暖かくして、 最後までお楽しみください! 心地よいUIの温度 OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design.
  71. 71. OH is a design project by yuta wariishi.  website design, app UI/UX design, Branding & Logo design. http://wariemon.com / wariemon.oh@gmail.com
  • coLp2

    Sep. 15, 2021
  • Thong710504

    Aug. 30, 2021
  • ssuserb61ed7

    Aug. 3, 2021
  • hopple

    May. 17, 2021
  • ssuserdf6d3d

    Nov. 27, 2020
  • RenaShindo

    Oct. 27, 2020
  • ssusera7caeb

    Aug. 9, 2020
  • ssuser8a9028

    Jul. 29, 2020
  • ssuser5240e4

    Jul. 17, 2020
  • ssuserb45a8c1

    Jul. 6, 2020
  • ssuser2580d0

    Feb. 6, 2020
  • MihoAkagawa

    Dec. 4, 2019
  • ssuser70602c

    Nov. 25, 2019
  • SatoshiMatsuoka1

    Nov. 19, 2019
  • rikosakakibara

    Nov. 5, 2019
  • DaisukeTateishi

    Oct. 25, 2019
  • ssuser0a6a99

    Oct. 20, 2019
  • satokeisuke2

    Oct. 16, 2019
  • MasudaRihito

    Sep. 30, 2019
  • pinkbox310

    Sep. 14, 2019

Event : UI温泉 in 綱島温泉 2015.02.07 Speaker : 割石裕太 / wariemon - UI Designer @KAYAC inc. / OH UI温泉 - UIと湯を愛するイベント - 4番目のスピーカーとして登壇させていただきました。 UI と 温泉 の共通点として「心地よい温度」を見出し、 そこに至るまでのフローを考えた内容となっております。

Views

Total views

266,085

On Slideshare

0

From embeds

0

Number of embeds

193,940

Actions

Downloads

4

Shares

0

Comments

0

Likes

337

×