デザイナーとエンジニアと私 - ユニファ開発者ブログ

この記事は、ユニファ開発者ブログ Advent Calender 2021の3日目の記事となります。

f:id:unifa_tech:20211201201855j:plain

デザイン部の森田です。ユニファではデザイナーとエンジニアが一緒にお仕事をしています。

プロダクト開発において、デザイナーとエンジニアが『一緒に』お仕事するために、これまでやってきていることと、これからやってみたいことをつらつらと書いてみたいと思います。

これまでやってきていること

デザイン制作途中でエンジニアに相談する
作成する画面に連番つけたり、画面タイトルをわかりやすくつける
コンポーネント化してフレームワークっぽく使いまわせるようにしてる

デザイン制作途中でエンジニアに相談する

これはもはや当たり前かもしれませんが、「このデザイン実装可能ですか？」ということだけじゃなく、「こっちの方が実装とかメンテナンスしやすくなります？」というところや、「工数削減するためにこんな画面にした方がよさそう」とかのアドバイスをもらうことも多々あります。できる or できない、という議論はあまりしません。だって『できない』って言いたくないですもん。そして大切な相談ポイントは「ユーザーのための議論をする」っていうところです。

作成する画面に連番つけたり、画面タイトルをわかりやすくつける

これもコミュニケーションが円滑に進むためと、余計な認識違いを避けるためにやってます。 E：「あの画面のここなんですけど・・・」 D：「あの画面ってどこだっけ・・・」これを E：「D-3-2 UserList Btn Disabled のボタンの色なんですけど・・・」 D：「あ、ボタンの色追加しておきます！」というコミュニケーションをしております。 HTMLを作成する時も作成した画面をリスト化して、画面名に合わせております。補足ポイントとしては、海外エンジニア勢にも同様な理解で進めたいので英語ベースにしています。（でも、デザイナーはNot speak Englishなので日本語も併記していることが多いです）

コンポーネント化してフレームワークっぽく使いまわせるようにしてる

これはかなりデザイナー側のメリットが大きいかもしれませんが、「使いまわせる共通パーツって便利じゃん」という誰にとってもハッピーな状況を作り出しています。とはいえ、デザイン初期からコンポーネント化してしまうと修正の手間が億劫になってしまったりもするので、ある程度画面やパーツが揃い始めてからコンポーネント化するものを最小限で作るようにしています。そしてコンポーネント化したものを使って大量のページレイアウトを作成したり、プロトタイプの作成に進むことが多いパターンですかね。

これからやってみたいこと

もっとこうしたい、を叶えたい
わくわくを追加するマイクロインタラクション
圧倒的使いやすさの実現

もっとこうしたい、を叶えたい

現在、プロダクトの数も増えてきて、0→1の開発だけじゃなくなってきた昨今、ユーザーの声や競合との差別化、当時は考えられてなかった機能など、「もっとこうしたい、こうしておけばよかった」など、出てきてくる頃なんじゃないのかなぁと感じおります。また、新規開発や機能追加においても、素早い意思決定から仕様決定までのプロセスを短期間化するために、『イメージの共有』をより具現化して関係各所に周知していくような「プロトタイプ主導」もやってみたいと思ってます。

わくわくを追加するマイクロインタラクション

これまでなかなか手をつけられてこなかった部分で、『心地よいインタラクション』を実現したかったりします。 jsに頼らずできるようなものはデザイナーがやれるし、条件によって可変するものはフロント担当のエンジニアと相談して実装したいなぁ〜と思ったりする今日この頃です。

圧倒的使いやすさの実現

こういう書き方をすると、「UI」頑張るのかと思われるかもしれませんが、最新の流行りのものが必ずしも『顧客の使いやすさ』につながるとは限りません。「圧倒的使いやすさ」を実現するためには自社プロダクトを「圧倒的に使い倒す」ところから始めようと思っています。特にテスト段階やレビューのときは気づかなかったけど、毎日使ってると感じる煩わしさの解消など、徹底的に自社のプロダクトを見つめ直すこともやりたいと思ってます。