「合流点はデザインシステム」フロントエンド開発者とUIデザイナーが合流点を語り合う『UI＋FE合流点』を開催しました。

こんにちは。Gaji-Labo で DevHR をしている関根です。エンジニア採用や組織作りを担当しています。

先日、Gaji-Labo が主催で『UI＋FE合流点』というトークイベントを開催しました。
ちなみに『UI＋FE合流点』と書いて、読み方は『ユーアイ・エフイー・ジャンクション』です。

名前の通り、UI デザインとフロントエンド開発の「合流点」を目指したイベントです。

イベント本編のトークセッションはもちろん、懇親会でも職種をまたいだ課題感の共有や相談などが活発に行われ、UI デザインとフロントエンド開発における合流の場として盛り上がりました！

今回のイベントは、フロントエンド側にサイボウズの sakito さん、SmartHR の masuP9 さん、UIデザイン側で Chatwork の守谷絵美さんの3名をゲストにお迎えしました。

笑いあり、納得感ありの名言や迷言が

本編中で印象に残った登壇者の言葉をいくつかピックアップしてお見せします。

「HTML/CSS は誰が書いていますか」というお題で、会場が沸いた言葉がこれ。

masuP9 さんは、プロダクトデザイナーとフロントエンドエンジニア両方のご経験があります。ロールで決まるというよりも一番得意な人が書くケースが多いとのことです。

「その時々によって自分でそのプロダクトに直接作用できるっていうところは結構やっぱり重要だなと思って、それはロール関係なく。」ということも仰っていました。

emim さんは2003年から Web の業界でお仕事をされており、現在はデザインを基礎にしてエンジニアを巻き込む、というお仕事をされています。

マークアップエンジニアやコーダーを信頼して神と思って専門家に任せるという姿勢は masuP9 さんの「僕が一番上手だから」とはまた逆方向に振り切れているなと思いました。
（でも、HTML/CSS のフィードバックをしちゃうことはある、とのこと）

フロントエンドと UI デザインの合流どうやってますか？というお題の中で、sakito さんが「合流地点はデザインシステムかも」という話をしてくださいました。

サイボウズでは「デザインテクノロジスト」が、デザインシステムの整備に集中しているそうです。

デザインも分かって開発も分かって、何をドキュメントにするか、Figma も含めて何をどのように作りやすくするか、というのをデザインシステムを育てるためにやっている。そこにデザイナーや開発からフィードバックが集まってきて、最終的にデザインシステムになり、それをみんながまた使う。このサイクルが回って、デザインシステムが合流地点になっている、とのことです。

ドメインモデルの設計だけにとどまらず、プロダクトをどう具体化していくかの開発フローの話題としてとても勉強になったという感想の多かったお題。

この話題だけでイベントになりそう。

SmartHR、サイボウズ、Chatwork、Gaji-Labo の各社の違いがあり、とても盛り上がりました。

masuP9 さんから、「コミュニケーションできているなら、実はもう両方のことを分かってるんじゃない？」という趣旨の話が出ました。

たしかに……むずかしく考えていましたが「両方できる」は、コミュニケーションをとれるくらい両方のことをわかっていれば合流できるってことですよね。

Gaji-Labo の neotag は、「全てをできることを全員が目指す必要はないとしても、自分が扱っている素材への知識はあった方がいい」と話していました。

マテリアルオネスティ（Material Honesty）は、工業製品は素材に忠実であるべきだという考え方で、近年では工業デザインに限らずデジタル領域のデザインにも大きな影響を与えた言葉です。

UI デザイナーが HTML/CSS を書くことがなくても、自分が扱っている素材のことを知った上でデザインをした方が良いというのは重要な観点だと思います。

トークセッションを通して masuP9 さんが名言（迷言）製造機みたいになっていて、とても面白かったのですが、X の実況ポストでも一番盛り上がったのがこのやりとり。

業務としては分担があるとしても、全てできる同士で仕事をやった方が強いという masuP9 さんのパワフルな言葉。つよい。

ちなみに「全員が」は、世の中の全員ではなく、そのチーム全員が全てをできるという考え方の会社もある（SmartHR はそう）よね、くらいの意味だそうです（笑）

「全員が全てをできるべきか？」というテーマで盛り上がった後に出た、 masuP9 さんの発言の背景。

「エンジニアもデザインできるべきって言ってる会社は、デザインできるエンジニアが評価される。デザイナーが開発できるべきって言ってる人の会社は、開発できるデザイナーが評価される。うちはプロダクトデザインに一定の開発能力を求めてるからできるべきだと言ってるし、評価もされる。」

SmartHR のような考え方が正解というわけではないので、やりたいことは何かという「意思」をもってそれができる職場に行くべき、ということも発言されていました。

SmartHR の masuP9 さんの「プロダクトデザインと開発、両方出来ると良い開発チームである」という発言に対して、サイボウズの sakito さんは「組織やチームの力でやるべき」というアンサーをしています。どちらの意見も熱いですね。

ここではピックアップしませんでしたが、Chatwork ではフロー型プロジェクトも中にはあり、そういう場合は前工程に入っていってコミュニケーションするという話も出ました。3者（社）それぞれの違いがあって、懇親会でもこの話題でかなり盛り上がりました。

UI デザインとフロントエンド開発の「合流点」というイベントについて

フロントエンドの開発者と UI デザイナーは普段から一緒に仕事をしているはずなのですが、イベントなどは別々で行われることが多いです。隣接した職種だけれど、職場の知り合いしかいなくて、外で違う職種の知り合いは少ない、という方も多いと思います。

普段仕事をしていても、お互い頑張っているのになぜか連携のところでうまくいかない、というような声もよく聞く気がします。

そんな中で自分達には何かできることはないかと考え、まずは「合流点」となるようなフロントエンドの開発者と UI デザイナーという隣接した職種のひとたちが集まるイベントを実施してみました。

参加された方たちが隣接した職種の知り合いを増やして帰ることで、相互理解が深まる「合流点」になれるんじゃないか、そうなっていたらいいなと思っています。

「次があるなら参加したい」という方へ

今後もこの合流点をテーマにしたイベントを続けていきたいと思っています。

「こんなイベントあったの？もっと早く言ってよ」とか「面白そう！」と思っていただけた方は、Gaji-Labo の X アカウントをフォローするか、 connpass のメンバーになっていただくと次回のイベント情報をキャッチできると思いますので、ぜひよろしくお願いします！

イベントのゲスト登壇者情報

今回登壇してくださったゲストのみなさん、ありがとうございました！

sakitoさん（@__sakito__）

サイボウズ株式会社

開発本部 kintone開発 デザインチーム, みんなのデザイン室リーダー, デザインテクノロジスト

2019年に現職のサイボウズに中途入社しフロントエンドエキスパートチームに所属、2022年にデザインシステムチームを立ち上げ、2023年から自社製品であるkintoneデザインチームのリードとデザイン室のリーダーになる。プロダクトと全社のデザイン組織づくりやプロセスの改善がいまのお仕事。犬が好き。

masuP9さん（@masuP9）

株式会社SmartHR

プログレッシブデザイングループ マネージャー / アクセシビリティスペシャリスト

営業からフロントエンドエンジニアに転身後、デジパ、サイバーエージェントを経て、2021年にSmartHRにプロダクトデザイナーとして入社。従業員サーベイ機能のプロダクトデザインを担当した後、アクセシビリティと多言語化を専門とするプログレッシブデザイングループを立ち上げて全社のアクセシビリティを推進しています。#deisui_html_radio 分かり手。

守谷絵美さん（@emim）

Chatwork株式会社

プロダクト本部 プロダクトデザイン部デザイナー

2003年よりWebの制作にデザイナーとして関わり、2015年頃より主軸をUIデザインに移し活動している。社内ではUI設計やアクセシビリティの啓発活動、デザイン基盤チームの立ち上げ・運営をリード。ウェブアクセシビリティ基盤委員会 副委員長。

【オフライン開催・増枠！】UI＋FE合流点 – フロントエンド開発とUIデザインのコラボトーク – connpass