不可分の民藝から可分の工業産業へ

デザインエンジニアリングMeetup! Vol.0 での発表資料です。

Transcript

1. 不可分の民藝から可分の工業産業へ
   たふみ
   デザインエンジニアリング Meetup! Vol.0 2023/11/09
   ·
   

   View Slide

2. 不可分の民藝から可分の工業産業へ 1 / 13
   イベントの裏趣旨
   デザイナー, エンジニア, ...
   プロダクト
   民藝的
   デザイナー エンジニア
   デザインシステム等
   工業産業的
   

   View Slide

3. 不可分の民藝から可分の工業産業へ 1 / 13
   イベントの裏趣旨
   デザイナー, エンジニア, ...
   プロダクト
   民藝的
   デザイナー エンジニア
   デザインシステム等
   工業産業的
   

   View Slide

4. 不可分の民藝から可分の工業産業へ 2 / 13
   喋ってる人
   たふみ@CreatorQsF
   U 株式会社スリーシェイク エンジニアインターw
   U 株式会社Gaudiy 業務委R
   U 大学院 Go言語の並行処理を安全にする研究
   中央揃え恐怖症のオンスクリーンプロダクトデザイナー
   

   View Slide

5. 不可分の民藝から可分の工業産業へ 3 / 13
   イベントの裏趣旨
   デザイナー, エンジニア, ...
   プロダクト
   民藝的
   デザイナー エンジニア
   デザインシステム等
   工業産業的
   

   View Slide

6. 不可分の民藝から可分の工業産業へ 3 / 13
   イベントの裏趣旨
   デザイナー, エンジニア, ...
   プロダクト
   民藝的
   デザイナー エンジニア
   デザインシステム等
   工業産業的
   

   View Slide

7. 不可分の民藝から可分の工業産業へ 3 / 13
   イベントの裏趣旨
   デザイナー, エンジニア, ...
   プロダクト
   民藝的
   デザイナー エンジニア
   デザインシステム等
   工業産業的
   個人制作してる物がない
   

   View Slide

8. 不可分の民藝から可分の工業産業へ 4 / 13
   

   View Slide

9. 不可分の民藝から可分の工業産業へ 5 / 13
   GOODの開発手法
   g ユーザーインターフェースデザイh
   a インブラウザデザイV
   g ユーザーインターフェース実r
   a React, TypeScript, Cloudflare PageT
   g サーバーサイ'
   a Go, Cloudflare Tunnel
   

   View Slide

10. 不可分の民藝から可分の工業産業へ 5 / 13
    GOODの開発手法
    i ユーザーインターフェースデザイp
    c インブラウザデザイX
    i ユーザーインターフェース実t
    c React, TypeScript, Cloudflare PageV
    i サーバーサイ(
    c Go, TiDB, Cloudflare Tunnel
    今発表しているMacで
    
    サーバーが動いてます
    絶対触わるな！
    

    View Slide

11. 不可分の民藝から可分の工業産業へ 6 / 13
    限られたリソース 負荷分散との戦い
    =
    

    View Slide

12. 不可分の民藝から可分の工業産業へ 7 / 13
    カウンター同期に必要な負荷分散
    s ハードウェアのスペックは十Q
    s ネットワークの帯域が不十A
    s いかに混まないようにAPIを叩くか
    

    View Slide

13. 不可分の民藝から可分の工業産業へ 8 / 13
    負荷分散のそれぞれでの戦い
    a ユーザーインターフェースデザイb
    e
    a ユーザーインターフェース実i
    e 通信量を見積もり、
    いかに減らせるかに注`
    a サーバーサイ4
    e スループットを上げることに注力
    

    View Slide

14. 不可分の民藝から可分の工業産業へ 8 / 13
    負荷分散のそれぞれでの戦い
    a ユーザーインターフェースデザイb
    e
    a ユーザーインターフェース実i
    e 通信量を見積もり、
    いかに減らせるかに注`
    a サーバーサイ4
    e スループットを上げることに注力
    

    View Slide

15. 不可分の民藝から可分の工業産業へ 9 / 13
    “それぞれ” にしない戦い
    

    View Slide

16. 不可分の民藝から可分の工業産業へ 9 / 13
    “それぞれ” にしない戦い
     通信は10秒に1C
     10秒 / 30人 = 0.3秒に1回捌i
     カウンターのアニメーショa
     カウントアップのみに見せW
     リアルタイムの増加に見せる
    
    → 良いバランスを取れる
    

    View Slide

17. 不可分の民藝から可分の工業産業へ 10 / 13
    プロダクト開発は本来不可分
    デザイン サーバーサイド
    クライアントサイド
    

    View Slide

18. 不可分の民藝から可分の工業産業へ 10 / 13
    プロダクト開発は本来不可分
    デザイン サーバーサイド
    クライアントサイド
    例: 遅延をデザインで隠す必要性に気がつかない
    

    View Slide

19. 不可分の民藝から可分の工業産業へ 10 / 13
    プロダクト開発は本来不可分
    デザイン サーバーサイド
    クライアントサイド
    例: 値が小さくなったときにカウンターを下がる方向へ回してしまう
    

    View Slide

20. 不可分の民藝から可分の工業産業へ 10 / 13
    プロダクト開発は本来不可分
    デザイン サーバーサイド
    クライアントサイド
    例: 不必要にリアルタイムに更新できるように頑張ってしまう
    

    View Slide

21. 不可分の民藝から可分の工業産業へ 10 / 13
    プロダクト開発は本来不可分
    デザイン サーバーサイド
    クライアントサイド
    機能単位を軸として全部やる = 良いバランスを取れる
    

    View Slide

22. 不可分の民藝から可分の工業産業へ 11 / 13
    不可分を分割する理由
    R チームをスケールするたb
    g「速く行くなら1人で行け、
    遠くに行くならみんなで行け8
    R プロダクトをより良くするたb
    g 専門家に任せるべき部分がある
    

    View Slide

23. 不可分の民藝から可分の工業産業へ 11 / 13
    不可分を分割する理由
    R チームをスケールするたb
    g「速く行くなら1人で行け、
    遠くに行くならみんなで行け8
    R プロダクトをより良くするたb
    g 専門家に任せるべき部分がある
    綿密なコミュニケーションが必要になる
    

    View Slide

24. 不可分の民藝から可分の工業産業へ 11 / 13
    不可分を分割する理由
    R チームをスケールするたb
    g「速く行くなら1人で行け、
    遠くに行くならみんなで行け8
    R プロダクトをより良くするたb
    g 専門家に任せるべき部分がある
    綿密なコミュニケーションが必要になる
    

    View Slide

25. 不可分の民藝から可分の工業産業へ 12 / 13
    共通言語としてのデザインシステム
    デザイナー エンジニア
    デザインシステム
    本当に必要なコミュニケーションに注力できるようにする
    

    View Slide

26. 不可分の民藝から可分の工業産業へ 12 / 13
    共通言語としてのデザインシステム
    デザイナー
    

    View Slide

27. 不可分の民藝から可分の工業産業へ 12 / 13
    共通言語としてのデザインシステム
    エンジニア
    

    View Slide

28. 不可分の民藝から可分の工業産業へ 13 / 13
    共通言語の設計
    V 思想をのせQ
    W 例: コンポーネントの型をデザイナーが書0
    V 揃えQ
    W 例: バージョン · 名前 · 等々…
    

    View Slide

29. 不可分の民藝から可分の工業産業へ 13 / 13
    共通言語の設計
    V 思想をのせQ
    W 例: コンポーネントの型をデザイナーが書0
    V 揃えQ
    W 例: バージョン · 名前 · 等々…
    可分の工業産業へ
    

    View Slide

30. 不可分の民藝から可分の工業産業へ
    たふみ
    デザインエンジニアリング Meetup! Vol.0 2023/11/09
    ·
    

    View Slide