デザイナーからみるデザインエンジニア、あるいは役割の変化

COUNTERWORKS（カウンターワークス）取締役CDOの@kentymmtです。DはDesignのDです。

弊社にはまだデザインエンジニアというポジションはないのですが「それってちまたでデザインエンジニアとして求められてることなのかも？」ということがちらほらあります。

デザインエンジニアはどのように生まれてきたのか

デザイナーの仕事はここ10年20年でどのように変化してきたのでしょうか。Webデザイナーもあたりまえにコードを書いていた時代から、デザイン思考のような「デザインのフレームワーク化」や「フロントエンドとバックエンドの分離、フロントエンドの複雑化によるUIとの分離」など「技術や規模の拡大によって分業が進んだが、同時にあらゆる面でデザインを無視できなくなってきた」という流れが大きそうです。

デザインとエンジニアリング両方のスキルを持っている、というと「フルスタックデザイナー」のような役割でもありそうです。なんだか覚えることが多くて大変だなぁという気もしますが「デザイナーとエンジニアの橋渡し」とか「コラボレーション」という文脈で見ると、reactが書ける、とか、Figmaを操作できる、とか、ユーザーインタビューができる、とかではなく「デザインとエンジニアリング両方の思考をスイッチできる、あるいは同時に使える」という点が重要ではないでしょうか。

プロトタイピングとアブダクション

デザイナーとエンジニア両方のスキルを持っているとプロトタイピングのスピードが上がるのは確実そうだと言えます。「ちょっとこれ作ってみたい」「目的はあるけど不確実要素が大きい」などの場面に対して、1人あるいは非常に少ない人数で操作・検証・議論可能なプロトタイプを作れるのであれば、そのスピードによって多くのプロトタイプを通じて目的・価値に近づいていくことができます。

多くのプロトタイプというのは多くの仮説でもあります。直線のように進むのではなく、反復運動によって「突如到達する」ような活動でもあります。

https://twitter.com/manabuueno/status/1150082064609267712

これは「デザイン思考フレームワークの実践」などではなく、あくまでも「デザイナーの技術」であるというのが重要です。デザイナーの経験的知識や、周りに散らばっているものの道具性の認識などによって可能である部分が大きいでしょう。

そんな大層な話じゃなくても

COUNTERWORKSのデザイナーも普段からコードを書いています。モダンな技術とか、メインのプロダクトで運用されている言語をすべてキャッチアップする必要はない（大変だし）と考えています。できることはたくさんあります。例えば

• コーポレートサイトやブログ（Wordpressとか）
• マーケティング（htmlメールとか）
• LPやちょっとしたページ（webpackとかViteとか）

などはすぐに挙げられるところです。ノーコードツールも進化していますが、組織体制によってはまだまだ直接htmlを書いたほうが低コストな場面も多いのではないでしょうか。あるいは

• グラフのUIを作成したいがブラウザ上での動作イメージがわかない
• 大量のデータを並べるUIを作成したいがブラウザ上での動作イメージがわかない
• Figmaだとかっこいいけど実装してみたらなんか違う..

など「実際ブラウザで見てみないとわからんなぁ〜」という場面は意外と多いかと思います。
FigmaなどのツールでUIを作成していくことが当たり前になってきていますが、こういった場合にもFigmaでのデザインと同時にhtmlベースでのプロトタイプを作ってエンジニアとグリグリ動かしてみると実装イメージがつきやすいです。（あと、結構ChatGPTが書いてくれます。）

あるいは、デザインシステムのようなアプローチもあります。
UI面と技術面両方からのアプローチを通じて良い品質のプロダクトを高速に作れるようにするために、COUNTERWORKSではデザインシステムの運用をすでに数年行っており、技術的な変更も経て現在3世代目となっています。重要なのは「デザインシステムを育てる」というよりは「プロダクトの全体像をデザインシステムの制作を通じてクリアにしていく」というところだと思います。まだまだ道半ばではありますが...

ディスコース、役割の変化

「意味論的転回　デザインの新しい基礎理論　クラウス クリッペンドルフ」　より

おおむねディスコースとは組織化された話し方、書き方、しかるべき行動の仕方である。

ディスコースは人々のコミュニティーに帰属する。その人々は、自分たちのコミュニティーを構成しているものを実行すること、いわばそれを執り行うこと、それによってメンバーとして重要なあらゆることを創り上げることにおいて協力する。ディスコースはコミュニティーのメンバーの注意を方向づけ、メンバーの行動を組織づけ、メンバーが見たり、話したり、書いたりする世界を構成する。

意味論的転回は、デザインがデザイン自身のディスコースによって自らをリデザインするための種子である。

どのような役割であれ、5人の組織と50人の組織と500人の組織では「それ」と言われている役割の内訳は違いそうです。同じように、創業期のスタートアップとメガベンチャーと総合商社でも「それ」は違うでしょう。産業革命以前と以後の「それ」とか、AIの台頭以前以後の「それ」もあります。

また、デザインとエンジニアリングの接続性に注目が集まってきたように、デザインとビジネス、エンジニアリングとビジネス、あるいは人事とデザインとか、採用広報とエンジニアリングとか、想像を巡らせればいくつもの接続がありそうです。

冒頭に書いた「デザインとエンジニアリング両方の思考をスイッチできる、あるいは同時に使える」というのはつまり、複数の視座を獲得し、複数の視座を自由に行き来できるスキルだと言えます。

結局のところ仕事や役職などは常に、外的環境によっても、自己批判によっても、変化していかなければならないのではないでしょうか。（雑）