設計できるエンジニアになるには / Design Guidelines for all engineers

設計できるエンジニアになるには

設計する例 MVCモデルを採用しよう

その設計の上で開発する例ビューを実装しよう

「開発しやすい」を設計する視点エンジニアが理解していることを理解する = 二次的理解

設計者とは何かシステムを設計するエンジニア（設計者）は、その設計の上で開発する エンジニア（実装者）と同じエンジニアが担うことも多いため、両者の区別 は曖昧になりやすいかもしれないしかし、システム設計における設計者と実装者の関係は、UIデザインにおける デザイナーとユーザーの関係と同じである

デザインする例ブックマーク機能を提供しよう

そのデザインの上で利用する例投稿をブックマークしよう

「使いやすい」をデザインする視点ユーザーが理解していることを理解する = 二次的理解

“UIデザインの思考は、システム管理画面はもとより、 APIや内部オブジェクトのインターフェース、あるい は運用手順の設計等にも適用できる。これらは インターフェースデザインというひとつのジャンルと 言えるかもしれない。つまり異なる二項のモデルを 透過的にする、中間項モデルのデザインである。” Manabu Ueno (@manabuueno) https://twitter.com/manabuueno/status/1605411200506155010

設計者の使命将来のすべてのエンジニアが自分なりの方法でアイデアを実現できる （＝開発しやすい）システム（＝インターフェース）を設計することエンジニアがこの使命を果たすには、実装者としての自分から意識的に 抜け出し、エンジニアの置かれる状況（仕様、アーキテクチャ、 エンジニア自身）を客観視する「設計者の視点」を持つ必要がある

設計者の視点を体現するには → アーキテクチャを図解する

生態心理学によると人間をはじめとする動物は、環境のさまざまな 要素から価値や意味（アフォーダンス）を受け 取り、その環境に適合した行動をとるこれに従うと、エンジニアはシステムの構造や構成要素（名詞）を把握することで、さまざまな行動（動詞）の可能性を直感し、例えば コードを理解したりアイデアの実現方法を模索したりといった、状況に適合した行動をとれるようになるといえる

アーキテクチャを図解しましょうアーキテクチャとは、エンジニアが使命を果たすために追加、更新、削除 する対象、すなわちシステムの構造や構成要素のことシステムの構造や構成要素を把握する＝メンタルモデルを構築するには、 図を見るのが効果的エンジニアがメンタルモデルを構築したり共有したりできるように、 アーキテクチャを構成する「名詞」同士の関係が視覚的に理解できる図を 作成しましょう

設計者の視点を体現するには → メンタルモデルと一致させる

「開発しやすい」を保つための軸 “変更や拡張のアイデアはメンタルモデルから生まれる。  一致していれば無理のない変更で実現できる。  アイデアをすぐ実現できない設計は、メンタルモデルと齟齬がある”  KOBA789 (@KOBA789) https://twitter.com/KOBA789/status/1605966954740600836

メンタルモデルと一致させましょう「前面に出す」とも言い換えられる https://twitter.com/manabuueno/status/1309885609066942466

アーキテクチャを前面に出すとはアーキテクチャ図に現れる要素や存在が自明な要素は上位階層に露出する例：アーキテクチャ図を見て自然に理解できる事項はすべて main 関数上で 確認できるように実装するアーキテクチャ図に現れない要素や存在が自明でない要素は下位階層に隠蔽 する例：実際に実装してみて初めて気付くような事項は別の関数に切り出して 実装する

メンタルモデルと齟齬を生む行為隠蔽すべきでない要素を隠蔽する可能性がある例コードの行数が大きくなってきたことを理由に別の関数に切り出すコードの形状が似ていることを理由に共通化する仕様の複雑性は仕様を変更しない限り取り除けないどうしても仕様が複雑ならその複雑性は正直に前面に出してメンタルモデルと 一致させるべき

その他の例：ディレクトリ構造を設計する利用者を明確にした上で、彼らは何を直接追加、更新、削除することで 使命を果たすのかを分析し、その対象を上位ディレクトリに出す

まとめ

今回の内容実は以前公開した内容でした https://zenn.dev/uenitty/articles/ca7c488adcc387

「それが世界の中の何であるか」を問う視点 “技術の本質は技術的なものではない”  マルティン・ハイデガーユーザーから見ればUIがシステムその ものであり、その実現のために技術を 駆使してシステム全体が作られる例えば我々にとって上水道システムとは蛇口のことである https://twitter.com/manabuueno/status/1310913207108694016

設計の本質を学べる本オブジェクト指向UIデザイン（通称OOUI本） UIデザインが入り口だが、単なる手法を超えて ものづくりや設計の本質を学べる名著エンジニアなら就職するまでには読んでおきたい https://www.sociomedia.co.jp/10046

“真のシンプルさは、単に不要なものや装飾を省くだけでは生まれません。 それは、複雑さに秩序をもたらす作業なのです。” Jony Ive Apple - iOS 7 Feature https://youtu.be/j66Ji6VLV_Q?t=45

設計できるエンジニアになるには / Design Guidelines for all engineers

設計できるエンジニアになるには / Design Guidelines for all engineers

Ueni

More Decks by Ueni

Other Decks in Programming

Featured

Transcript