技術とデザインの間

Transcript

1. ٕज़ͱσβΠϯͷؒ
   UI/UXデザイナーLT会
   #uiuxdesignerslt
   Takanori Oki - 2020/09/29
   

   View Slide

2. ࣗݾ঺հ
   

   View Slide

3. 大木尊紀（オオキタカノリ/Takanori Oki）
   • インターネット上では@takanorip(Twitter: @takanoripe)
   • フロントエンドエンジニア、現ClassDo IncのUIデザイナー
   • Web Platform Study Group（WPSG）のOrganizer
   • https://www.youtube.com/channel/UCfToJ-
   sTOqvBnnuVq3zdZhA
   • 好きなもの： Figma、フォント、VTuber
   

   View Slide

4. 6*σβΠϯͷྺ࢙
   

   View Slide

5. ソフトウェア
   エンジニアのための
   UIデザイン概論
   Zennにて好評発売中！
   https://zenn.dev/takanorip/
   books/
   c793924600a6009b43c2
   

   View Slide

6. UIの進化
   • バッチインターフェース
   • パンチカードや紙テープでコンピュータを操作してた
   • Character User Interface
   • キーボード入力＋文字表示でコンピュータを操作
   • Graphical User Interface
   • グラフィック＋ポインティングデバイス or タッチ操作
   

   View Slide

7. UIデザインも
   技術の進化に対応するために
   変化してきた
   

   View Slide

8. UIデザインの進化
   • Windows 95
   • PCが広く普及するきっかけを作った親しみやすいデザイン
   • スキューモーフィズム
   • 現実世界のものを模倣することでわかりやすいデザインを目指した
   • フラットデザイン
   • 様々なデバイスや状態に対応するため、シンプルになったデザイン
   

   View Slide

9. UIデザインの変遷は
   ただのトレンドではなく
   技術や利用環境の変化によるもの
   

   View Slide

10. ΤϯδχΞͱσβΠφʔ
    

    View Slide

11. デザイナーとエンジニアの分業体制は
    本来あるべき姿ではないのか？
    

    View Slide

12. 職種名は採用のために生まれる、という話
    • 採用するには「採用したい人のスキル」を定義する必要がある
    • 母数を増やすために、ここには「汎用的なスキル」が多く含まれる
    • そうすると、ある一定のスキルをもった架空の人物像ができあがる
    • それが「職種」「肩書」になる
    • UIデザイナー
    • ウェブエンジニア
    

    View Slide

13. 分業体制が生まれるということは
    業界が成熟し流入資本が多くなった
    ということを示している
    

    View Slide

14. 良し悪しは置いておいて、
    産業が大きくなった以上分業化は
    避けられない
    

    View Slide

15. 分業体制におけるデザイナーに必要なもの
    • 「デザイン対象の理解、知識」
    • 言い換えれば「材料、素材の知識」
    • 紙の性質を知らなければ印刷物のデザインができないのと同じ
    • エンジニアからデザイナーになるのは、この点で有利だと思う
    • しかし、プログラムが書けることが必須であると思ってない
    

    View Slide

16. プログラミング苦手なデザイナーへ
    • プログラムが書けなくても良い、でも触ってみる体験は必須
    • アプリケーションが作れなくても、アプリケーションやブラウザなどの
    仕組みを理解することが大事
    • 仕組みがわからないデザイナーはどんどん必要とされなくなっていく
    • 工業デザイナーと同じマインドセットが必要になってきた
    • エンジニア勉強会に参加してみる、入門書を読む、etc…
    

    View Slide

17. σβΠϯཧ࿦ͱ
    ηϯεɾΦϒɾϫϯμʔ
    

    View Slide

18. UIデザインは論理的？
    

    View Slide

19. デザインには様々な原理原則がある
    • ゲシュタルト原則
    • グリッドシステム
    • 認知心理学
    • 行動経済学
    • 人間中心設計
    • etc…
    

    View Slide

20. しかし…
    • 完全に論理的ではない（当たり前だけど）
    • 感覚的な良さを排除することはできない
    • 理論：感覚 = 7:3 くらい？
    • デザインの「感覚」が乏しい人でもある程度できるのがUIデザインの
    良いところでもあり悪いところでもあるかも
    

    View Slide

21. UIのセンス・オブ・ワンダー
    • 何をユーザーに届けたいのか次第
    • シンプルで使いやすいけど印象に残るUIデザインが重要
    • どうやって鍛えたらいいの？
    • Dribble?
    • 良いアプリケーションに触れる？
    • 教えて！！！
    

    View Slide

22. ͓ΘΓ
    

    View Slide