デザイン→フロントエンド
この記事は『みすてむず いず みすきーしすてむず (2) Advent Calendar 2023』の初日の記事です。
みすてむずはIT関係者向けのMisskeyサーバーです。
ITに関わる人のサーバーにしたい。話題はテーマフリーです。晩ごはんから仕事の話（NDAには注意）まで。
とあるように、技術の話に限らずさまざまな話題で日々盛り上がっています。Advent Calendarも（4）まで埋まる盛況っぷり。現状みすてむずへの登録は制限がかかっていないようなので、興味のある方はぜひ登録してみてください。
この記事ではUIデザイナーがエンジニアを兼任するようになるまでについての記事です。サムネイルは適切なものが思い浮かばなかったので、先日食べたこぼれ寿司を使いました。記事には一切関係ありません。
ざっくりキャリアの棚卸し
11月上旬まで所属していた前職では、UIデザイナー兼フロントエンドエンジニアとしてMPA→SPAへのリプレースを担当していました。来年からはデザインエンジニアとしてWebアプリケーションの開発に従事する予定です。
デザイナー兼エンジニアというロールの人は決して少なくありませんが、自分の観測できるかぎりではエンジニアとしてのキャリアがベースになっている人が多いように見えます。自分は元々はグラフィックデザイナーで、
漫画のグラフィックデザイナー
WebアプリのUIデザイナー
WebアプリのUIデザイナー兼フロントエンドエンジニア
Webアプリのデザインエンジニア
といった流れで職域が変わってきました。この記事では2〜3の流れや、その際の自身の考えを中心に書いていきます。
ユーザーはFigmaに触らない
「事件は会議室で起きてるんじゃない！現場で起きてるんだ！」
Figma、便利ですよね。実装と親和性の高いコンポーネント、リッチなプロトタイプ作成機能、豊富なコラボレーション機能など、現代のUIデザインに求められる機能を網羅しています。もちろん自分も愛用しています。
その気になれば実際のアプリケーションの手触りに限りなく近いインタラクションも実現できますが、そのためにはそこそこのコストがかかります。当然メンテナンスコストも上がっていきます。そしてそれだけのコストをかけたデザインデータは、それ自体がユーザーに届くことはありません。Webアプリケーションであれば、ユーザーはブラウザ上で動くアプリケーションに触れるわけです。Figmaには触りません。
まあこれはやや恣意的な表現で、目的に応じたデザインデータの作り込みは大いに有益だと思います。それでも自分は「自分がデザインしたものは最終的に実装を通じてユーザーに届くのだから、デザインとエンジニアリングをハッキリと区別する必要はないのではないか？」と考えるようになりました。
実際にフロントエンドに手を伸ばすまで
上記の理由は実のところ後付けで、当初はもう少しフワッとした流れでフロントエンドを学び始めたと記憶しています。「次の会社でReactを使っているらしいから、有給消化の間にちょっと勉強してみるかな」が最初だったはず。
その会社でReactを書くことはありませんでしたが、ある程度コードリーディングができるようになったことで、各コンポーネントや機能がどのような挙動をするのかを理解する助けになりました。
その後転職を機に一人開発の機会が増え、なし崩し的に業務でもフロントエンドの実装をするように。独学+一人開発ということで不安な点もありましたが、自分で一通りのデザイン・実装をした機能が多くの方に使っていただけるのは達成感がありました。
今後のこと
来年からはデザインエンジニアとして働きます。自身の課題感として
エンジニアとしてのチーム開発経験がない
デザインと比べてエンジニアリングの知見・経験が少ない
といったものが挙げられます。もちろんデザインもまだまだ未熟ではありますが、しばらくはエンジニアリングについて集中的に伸ばしていければと考えています。「デザインとエンジニアリングをハッキリと区別する必要はない」という立場からいえば、それがデザインの底上げにもつながると信じて。
明日の記事はNakuReiさんです。「なにも決めてない」とのことなので、記事が投稿されるのを楽しみに待ちましょう。
サポートしていただけたら書籍の購入代かアルコールになります。