Wow students.を支えるatama plusのデザインシステム

https://onecareer.connpass.com/event/339385/

Transcript

1. W o w s t u d e n t s . を 支 え る a t a m a p l u s の デ ザ イン シ ス テ ム 一 ノ 瀬 翔 吾 2025.01.27
2. 自己紹介 atama plus株式会社 Product Engineer 友利奈緒@rettar5 2 一 ノ 瀬 翔 吾
3. atama plus
4. 教育に、人に、社会に、 次の可能性を。 教育を新しくすること。それは、社会のまんなかを新しくすること。私 たちは学びのあり方を進化させます。 学習を一人ひとり最適化し、「基礎学力」を最短で身につける。 そのぶん増える時間で、「社会でいきる力」を伸ばす。 それが私たちの目指すもの。自分の人生を生きる人を増やし、 これからの社会をつくっていきます。 Mission ata ma plusとは 4
5. ⓒ atama plus Inc. 何を目指しているのか 5 Wow students.を支えるatama plusのデザインシステム 社会でいきる力の習 得 「基礎学力」の習得にかかる時間を短くし、「社会でいきる力」を養う時間を増やす これからの社会をつくる人に必要な力とは何でしょうか。 私たちは「基礎学力」と「社会でいきる力」の両方が とても大切だと考えていますが、 日本の教育においては、基礎学力の習得にほとんどの時間を使ってしまって いるのが現状です。 テクノロジーを活用して、基礎学力の習得にかかる時間を短くし、 社会でいきる力を養う時間を増やす。 それが私たちが目指すもの。 まずは、基礎学力にフォーカスして取り組んでおり、 今後社会でいきる力も取り組んでいきます。 基礎学力の習 得 基礎学力の習 得 従来の勉強時間を減らし、 成長時間を増やす
6. Wow students. 生徒が熱狂する学びを。 勉強をワクワクするもの、自分からやりたいものに変え、 生徒一人ひとりの可能性を広げる。 私たちのあらゆる行動は、ただ、そのためにあります。 私たちが何よりも大切にしているのは、 そのために日々全員でプロダクトを磨いています。 「生徒が熱狂する学び」を提供するということ。 atama plusとは
7. ⓒ atama plus Inc. atama plusとは 7 Wow students.を支えるatama plusのデザインシステム 教育に、人に、社会に、次の可能性を。 というミッションを達成するために Wow students. に向かっている
8. ⓒ atama plus Inc. atama plusとは 9 Wow students.を支えるatama plusのデザインシステム Wow students. に向かっている状態 = ユーザーファースト に向かっている状態
9. ⓒ atama plus Inc. atama plusとは 10 Wow students.を支えるatama plusのデザインシステム Wow students. を達成するために 取り組んでいること
10. uniform
11. ⓒ atama plus Inc. uniform 12 Wow students.を支えるatama plusのデザインシステム atama plusには uniformと呼んでいる デザインシステムがある
12. ⓒ atama plus Inc. uniform 13 Wow students.を支えるatama plusのデザインシステム 何を良いデザインとし、 どう実現するかの 「基準」と「手段」を提供
13. ⓒ atama plus Inc. uniform 14 Wow students.を支えるatama plusのデザインシステム その中のひとつに デザイン原則がある
14. uniform デザイン原則
15. ⓒ atama plus Inc. uniform デザイン原則 16 Wow students.を支えるatama plusのデザインシステム Wow students.が 生まれるための 秘けつをまとめたもの
16. ⓒ atama plus Inc. uniform デザイン原則 17 Wow students.を支えるatama plusのデザインシステム atama plusでは、 職種に限定されず すべての人がデザインを行う
17. ⓒ atama plus Inc. uniform デザイン原則 18 Wow students.を支えるatama plusのデザインシステム atama plusのデザインが対象とするのは 生徒が使うプロダクトだけではなく 生徒を取り巻く環境 そのものも含む
18. ⓒ atama plus Inc. uniform デザイン原則 19 Wow students.を支えるatama plusのデザインシステム 紙で配られるテキストや 先生に頑張りを褒めてもらえることなど 生徒が学習を通して経験する さまざまなこともデザインする
19. ⓒ atama plus Inc. uniform デザイン原則 20 Wow students.を支えるatama plusのデザインシステム ①学びに集中できる ②自分の状態がわかる ③自分から進められる
20. ⓒ atama plus Inc. uniform デザイン原則 ①学びに集中できる 21 Wow students.を支えるatama plusのデザインシステム 必要な操作・必要な要素は最小限にし 学びそのものに集中できるように デザインする
21. ⓒ atama plus Inc. uniform デザイン原則 ①学びに集中できる 22 Wow students.を支えるatama plusのデザインシステム 良い例: 問題を解いたあと 解答するボタンを意識せず押せる
22. ⓒ atama plus Inc. uniform デザイン原則 ①学びに集中できる 23 Wow students.を支えるatama plusのデザインシステム 要注意: 制限時間を 必要以上に強調する
23. ⓒ atama plus Inc. uniform デザイン原則 ①学びに集中できる 24 Wow students.を支えるatama plusのデザインシステム 要注意: 集中しているときに 先生に声をかけられてしまう
24. ⓒ atama plus Inc. uniform デザイン原則 ②自分の状態がわかる 25 Wow students.を支えるatama plusのデザインシステム 生徒の取り組みに対して 常にフィードバックがあり 成長を実感できるように デザインする
25. ⓒ atama plus Inc. uniform デザイン原則 ②自分の状態がわかる 26 Wow students.を支えるatama plusのデザインシステム 良い例: 自分がいままでできるようになったことが 常に確認できる
26. ⓒ atama plus Inc. uniform デザイン原則 ②自分の状態がわかる 27 Wow students.を支えるatama plusのデザインシステム 良い例: 手こずった問題ができたときや 目標達成したときに 先生から声をかけてもらえる
27. ⓒ atama plus Inc. uniform デザイン原則 ②自分の状態がわかる 28 Wow students.を支えるatama plusのデザインシステム 要注意: 生徒が気づかない間に 学習状況が変わってしまう
28. ⓒ atama plus Inc. uniform デザイン原則 ③自分から進められる 29 Wow students.を支えるatama plusのデザインシステム 主体的に学んでいけるよう 生徒が自分で選択する感覚を 大切にします
29. ⓒ atama plus Inc. uniform デザイン原則 ③自分から進められる 30 Wow students.を支えるatama plusのデザインシステム そのために 選択肢と選択に必要な情報を提供し 生徒が意思決定できるように デザインする
30. ⓒ atama plus Inc. uniform デザイン原則 ③自分から進められる 31 Wow students.を支えるatama plusのデザインシステム 良い例: 学習開始までの導線には 複数の教材を提示し 選択の幅をもたせる
31. ⓒ atama plus Inc. uniform デザイン原則 ③自分から進められる 32 Wow students.を支えるatama plusのデザインシステム 要注意: 勝手に学習目標が 決められてしまう
32. ⓒ atama plus Inc. uniform デザイン原則 33 Wow students.を支えるatama plusのデザインシステム デザイン原則は 何を良いデザインとし どう実現するかの基準
33. ⓒ atama plus Inc. uniform デザイン原則 34 Wow students.を支えるatama plusのデザインシステム uniformでは どう実現するかの「手段」も 提供する
34. uniform ガイドライン
35. ⓒ atama plus Inc. uniform ガイドライン 36 Wow students.を支えるatama plusのデザインシステム デザイン原則を プロダクトに適用するため FOUNDATION UI PATTERN COMMUNICATION などをガイドラインで提供
36. ⓒ atama plus Inc. uniform ガイドライン FOUNDATION 37 Wow students.を支えるatama plusのデザインシステム
37. ⓒ atama plus Inc. uniform ガイドライン FOUNDATION 38 Wow students.を支えるatama plusのデザインシステム
38. ⓒ atama plus Inc. uniform ガイドライン FOUNDATION 39 Wow students.を支えるatama plusのデザインシステム
39. ⓒ atama plus Inc. uniform ガイドライン UI PATTERN 40 Wow students.を支えるatama plusのデザインシステム
40. ⓒ atama plus Inc. uniform ガイドライン UI PATTERN 41 Wow students.を支えるatama plusのデザインシステム
41. ⓒ atama plus Inc. uniform ガイドライン UI PATTERN 42 Wow students.を支えるatama plusのデザインシステム
42. ⓒ atama plus Inc. uniform ガイドライン UI PATTERN 43 Wow students.を支えるatama plusのデザインシステム
43. ⓒ atama plus Inc. uniform ガイドライン COMMUNICATION 44 Wow students.を支えるatama plusのデザインシステム
44. ⓒ atama plus Inc. uniform ガイドライン COMMUNICATION 45 Wow students.を支えるatama plusのデザインシステム
45. ⓒ atama plus Inc. uniform ガイドライン COMMUNICATION 46 Wow students.を支えるatama plusのデザインシステム
46. ⓒ atama plus Inc. uniform ガイドライン COMMUNICATION 47 Wow students.を支えるatama plusのデザインシステム
47. ⓒ atama plus Inc. uniform ガイドライン 48 Wow students.を支えるatama plusのデザインシステム これらの「基準」と「手段」を ガイドラインとし 社内の誰でも アクセスできるように提供
48. ⓒ atama plus Inc. uniform ガイドライン 49 Wow students.を支えるatama plusのデザインシステム uniformは どう運用されているのか
49. uniformパーティ
50. ⓒ atama plus Inc. uniformパーティ 51 Wow students.を支えるatama plusのデザインシステム デザインシステムと プロダクトが乖離し 「使えないデザインシステム」 になることを避けるため 更新し続ける必要がある
51. ⓒ atama plus Inc. uniformパーティ 55 Wow students.を支えるatama plusのデザインシステム uniformは uniformパーティという組織で運営 uniformパーティのコアな役割は 「判断する」こと
52. ⓒ atama plus Inc. uniformパーティ 56 Wow students.を支えるatama plusのデザインシステム デザイナー2名 エンジニア3名 で専門性を活かし、 適切な人から情報を集めながら その時の最適を判断する責任を持つ
53. ⓒ atama plus Inc. uniformパーティ 57 Wow students.を支えるatama plusのデザインシステム uniformが浸透し 全員が当たり前に使えるように 取り組む役割も持つ
54. ⓒ atama plus Inc. uniformパーティ 58 Wow students.を支えるatama plusのデザインシステム uniformの改善のリード uniformに対する質問への解答
55. まとめ
56. ⓒ atama plus Inc. まとめ 60 Wow students.を支えるatama plusのデザインシステム atama plusでは Wow students. = ユーザーファーストを デザインシステム uniformで 実現している
57. AIで、一人ひとりに、最短で「わかる！」を。