良いUIを支えるフロントエンド開発のポイント


前回書いた「なぜUIデザインとフロントエンド開発に注力しているのか」はおかげさまで(自分の記事としては)様々な反響をいただきました。SNS上の言及だけでなくカジュアル面談でも話題にしていただく方が多くとても嬉しいです。

フロントエンド開発とUIデザインの関係についてもう少し掘り下げるため、今回は良いUIを支えるためにフロントエンド開発で重要になるポイントだと Gaji-Labo が考えていることをまとめていきます。

前提:リリースも仮説検証の通過点

ウォーターフォール的な開発が主流だった一昔前は、サービスのリリースがひとつのゴールだったように感じます。しかし、Web開発にもアジャイル開発や人間中心設計の手法などが浸透した現在では、リリースしたら終わりというプロジェクトは少なくなりました。(フェーズの変化によりチームの体制が縮小されるというのは当然ありますが、リリース後もある程度の規模感で開発が継続されることが多いのではないでしょうか。)

ユーザーに使ってもらえるサービスとなるように、仮説と検証を積み上げていくのがプロダクトやサービスの磨き方として王道かと思います。そして「リリース」も実ユーザーに触ってもらい様々な検証を行うためのいちプロセスと捉えることができます。
そのためリリースをゴールにおいた開発プロセスとは違った難しさが存在します。

繰り返されるビジネスモデルの検証とUIの改善

程度の差はあれたいていのサービスは開発前にそのサービスがビジネスとして成立するかを検証してから開発が始まります。
しかしその段階では検証しきれない仮説やまだ見つかっていない仮説が沢山あります。フェーズにあわせてリサーチやプロトタイピング・ユーザーテストなどを繰り返しながらサービスを具現化していくわけですが、クローズドな環境で検証しきるにも限界があります。

そうすると実サービスとして使える状態まで具現化したものをマーケットに出して(リリースして)ユーザーの反応を見ることで検証の精度をあげていくことになります。
ここまでの検証の過程でビジネスモデルや企画の修正があれば機能の変更・追加・削除などが発生し、当然UIデザインもそれにあわせた最適な形への変更が求められます。(別の目的で作られたUIパーツを流用して使いづらいインターフェイスになっている製品は世の中に沢山見かけますね)

繰り返される仮説検証に耐えられるフロントエンド実装の品質

開発初期段階はプロトタイピングやユーザーインタビューなどから実開発へのフィードバックも比較的柔軟に行なえますが、リリースしてしまったあとのフロントエンドの変更はかなりの労力を要します。
複雑なUIをデザインカンプ通りに実装するのもそれなりに大変ですが、それ以上にUIの品質に大きく影響をあたえるのは、仮説検証のプロセスから得たフィードバックをいかに適切にサービスに反映していくことができるかだと考えています。

無事リリースしたあとも継続的に良いUIを模索していくためには、フロントエンド開発においていくつかの重要なポイントがあります。
とくに重要だと考えているものをあげてみます。

  • 一貫性
    • 統一されたルールから生み出されたUIコンポーネントによる整合性の担保
    • サービス全体をとおして一貫した規約と実装による暗黙知の排除
  • 疎結合
    • 削除や変更が容易なように疎結合に設計されたUIコンポーネント
    • 責務がきれいに分離されたロジック
  • 堅牢さ
    • 疎結合や一貫性によって変更時の影響が十分にコントロールできる状態
    • 安心して変更することができるテスト

初期構想のUIデザインを実装できるだけのスキルに加え、これらを維持できるチームが揃っていてはじめて仮説検証のサイクルを回しながらUIを改善していけるフロントエンド開発になると考えています。
メンテナンス性とほぼ同義ですが、攻めの姿勢でUIを改善していくにはこれらのスキルが必要です。

チーム全体で話せる文化とそこに参加する意思

ここまでは仮説検証プロセスについていくためのフロントエンド開発について書きました。しかし開発スキルだけではプロセスについていくのは難しいとも考えています。
なぜなら健全なチームほど仮説も検証結果もあらゆるところから出てきます。当然たくさんの視点から出てくる情報はある側面から見れば良い情報でも別の側面から見ればマイナスだったりします。

それらの情報を整理統合し施策に落とし込んでいくためには、それぞれ違う専門性を有したチームメンバー同士の高度な意見交換がかかせません。
言われたことを黙々と実装しつづけるのではなく、フロントエンドエンジニアの目線と知見で施策にたいしてフィードバックを行い、各専門家たちの知見をサービスに落とし込むことはUIのみならずサービス全体の品質をあげるために欠くことが姿勢です。

「話せる」と言っても明るいコミュニケーションや理路整然としたスマートな交渉が必須なわけではありません。自分の意見を率直に伝え、相手の意見を真摯に受け止めながら、妥協ではなく高い水準の合意を導きだすことを諦めない意思が大事です。
これまで見てきた成果が高いお客様のチームはみな「話せる」文化をもち、メンバー全員がその会話に参加する意思をしっかり持っているように見えるのが共通点でした。
(ただし長時間話せばいいというわけではなく、あくまでも議論の内容が重要です)

これが当たり前なチームを作りたい

良いUIを支えるために必要なこととして「開発時のポイント」と「話せる」ことをあげました。
えらそうに理想論を並べましたが、頭ではわかっているものの実践できているかというとあやしい部分が多々あります。
UIデザインとフロントエンド開発に力を入れる以上、避けては通れない課題だと思っています。

現在 Gaji-Labo ではフロントエンドエンジニアを絶賛採用中です。
フロントエンド開発のスキルを駆使して良いUIをユーザーに届けることに興味がある方と一緒にこの課題に取り組めたらとても嬉しいです。
ぜひ弊社メンバーとカジュアル面談をしてみませんか。

この機会に、オンラインで気軽に面談してみませんか?

現在弊社では一緒にお仕事をしてくださるエンジニアさんやデザイナーさんを積極募集しています。まずはカジュアルな面談で、お互いに大事にしていることをお話できたらうれしいです。詳しい応募要項は以下からチェックしてください。

パートナー契約へのお問い合わせもお仕事へのお問い合わせも、どちらもいつでも大歓迎です。まずはオンラインでのリモート面談からはじめましょう。ぜひお気軽にお問い合わせください!

お問い合わせしてみる!

投稿者 Harada Naotaka

受託と事業会社の両方を経験し、沢山の事業を見てみたい気持ちで Gaji-Labo を共同創業。普段は雑用やったりプロジェクトマネジメントやったり、たまにフロントエンドのコードを書いたり。直近は Gaji-Labo をデザイン会社に転換していく課題に挑戦中。期待値コントロールにステ全振り。