この記事は、6月から始まっている #LXベッテク月間 18日目の記事です。
昨日の記事は弊社代表fukkyyさんの「LayerXの第3の事業、Privacy Tech事業を始めます、という話」でした。
はじめまして。SaaS事業部デザイナーのわたなべなつきです。
バクラクシリーズ担当のプロダクトデザイナーとして3月に入社し、早3ヶ月経過しました。
本日は入社3ヶ月目の比較的フレッシュな目線で、バクラクシリーズのデザイナーとしての働き方についてお話したいと思います。
まず入社して驚いたのは・・・
デザイナーがUIデザインしていない！
入社前から、どうやらデザイナーがUIデザインしてないらしい、ということは聞いていましたが、Figmaに一切ファイルがないので「本当にUIデザインしてないんだ・・・」とびっくりしました。
バクラクシリーズは基本的にデザインプロセスを挟まず開発をすることが多いです。
仕様が決まると、デザイナーがUIデザインをおこすことなく、エンジニアがUIコンポーネントを使って開発をしていきます。実装後、デザイナーも一緒にコードを修正しながらレイアウトやスタイルなどを調整します。
弊社は開発スピードが異常に早いのですが、このデザインプロセスもバクラクシリーズの爆速開発の理由の1つだな〜と入社してみて実感しました。
なので、いわゆる一般的な開発フローでUIデザインしてきた私はどうバリューを出していこうか・・・と最初の1ヶ月は悩んでいました。
が、まずは色々やってみよう！と思い、今はその時々に合わせたプロセスでデザインをしています。
コードを書きながらデザイン
これまで同様の「デザインプロセスを挟まない開発スタイル」に自分もチャレンジしてみました。
やってみて感じたのは、
- ロジックとスタイルの記述が分離されていてデザイナーが触りやすい。
- フロントエンドはVueもしくはReact
- HTML/CSSを触ったことのあるデザイナーなら触りやすい（JavaScriptは太古の昔にjQueryを書いた程度の私もイケました）
- エンジニア⇔デザイナーのコミュニケーションコストが減る
- 「ここ10px空けたいです！」といったよくある会話が減る
- わからないことを聞く精神的なハードルが低いのでチャレンジしやすい
- わからないことを快く教えてくれるエンジニアの方しかいないので、VueもReactも触ったことのなかった私としては大変ありがたいです。
ということで、やってみると面白く、業務の幅も広がりそうだなと感じました。
Figmaを使って議論の叩きをつくる
仕様が複雑だったり、新機能で考えることが多かったりする場合は、Figmaを使ったUIデザインも取り入れてはじめています（私がそっちのほうがやりやすかったのもあり・・・笑）。
先日リリースしたバクラク申請・経費精算のスマホ対応は、何案かプロトタイプを作ってチームでわいわい議論しながらUIを固めていきました。
実装後に大きくレイアウト変更するのは大変なので、みんなで議論しながらその場でUIデザインできるのはやはりFigmaの良いところだなと思います。
余談ですが、私がFigmaを布教したらバクラク申請・経費精算のPdMもFigmaを使い始めています。フットワークが軽い方ばかりです。
まとめ
LayerXは「どう」作るか以上に「何を」「なぜ」作るかにこだわっている会社だなと入社してみて感じました。
なので、みんなやり方に固執せず「やりやすい方法でなんでもやってみなよ」と後押ししてくださる方ばかりです。
これからも試行錯誤しながらバクラクの体験をどんどん良くしていきたいと思います！
We are Hiring!!!
弊社では共に世の中をバクラクにしてくれる仲間を絶賛募集中です！
先日LayerXデザイナー女子たちでPodcastも収録しました！LayerXのデザインチームの面白さが伝わると嬉しいです。 ぜひ聞いてみてください！
