背景と緊急対応：医師向け決済画面におけるフロントエンドUXのリファクタリング
e-casebook LIVE(イーケースブック・ライブ)とは、循環器内科、整形外科、脳神経外科、消化器科などの分野のトップレベル医師による実践的な手術・手技、レクチャーなどの内容を提供し、視聴者である専門医に見て学んでもらうライブ・ビデオ配信プラットフォームサービスです。
この自社プラットフォームの運用において、学会・研究会開催直前のタイミングで「支払い方法が分からない」という医師（ユーザー）からの緊急の問い合わせがカスタマーサポート（CS）へ寄せられました。
会期が迫っているため、バックエンドのロジック変更や、重い意思決定を伴うエンジニアの新規開発を待つ余裕はないと考えていました。そこで私はCSチームから状況をヒアリングした上で、エンジニアの開発負荷がかからない「CSSの修正（見た目の調整）」による解決策を即座に立案しました。チームのデザイナー上司へ提案して迅速な承認を取り付け、その了承のもと、エンジニアに対して「最速で本番へあげてほしい」という投げかけを行うことで、即座にUIの問題を解決するアプローチを取りました。
元の画面は、4つほどの料金プランがラジオボタンが箇条書きのように並んでいて、選択肢に境界線もなく、ユーザーから見て「ボタン」に見えていませんでした。これに対し、各選択肢を視覚的な「カード型UI」へと変更するための枠線を追加。さらに、クリックして選択した際には背景色がしっかりと変化するインタラクションをCSSのみで実装してもらいました。これにより、操作した医師が「自分が今どのプランを選択しているのか」を視覚的に一瞬で確信できるUIへとアップデートし、ユーザーの迷いを無くして決済トラブルを最速で収束させました。
協働プロセス：エンジニア主導（制約ファースト）の画面をデザインで補完する
現在のe-casebookの開発環境において、私は「デザイナー主導」ではなく、「エンジニア主導」のワークフローになっています。なぜなら、バックエンドの仕様や医療ドメイン特有の複雑な制約を最も深く把握しているのはエンジニアだからです。社内向けのライブ配信管理画面や、業務の効率化のために突貫工事で必要になった「タグ付け機能」など、まずはエンジニアが仕様を満たした「機能としてシステムが100%動く状態」の画面を組み立てます。
エンジニアが組み立てた機能・ロジックやシステム制約を壊すことなく、ユーザーが使いやすいUIへとチューニングしていきます。
- 情報の再配置とグルーピング：エンジニアが実装順に並べたフォームを、人間が認知しやすい自然な順序へ並び替え、バラバラだったデータを適切な塊へとまとめる。
- マイクロコピーの補足とラベル最適化：操作の迷いや誤入力を防ぐための補足文言を適切な位置に書き加え、ボタンのラベル表記を「システムの処理名」から「ユーザーの直感に沿った言葉」へと変更。
- ブランドカラーと一貫性の担保：突貫実装でブランドカラーが適用されていなかったり、余白等が適切でない場合に、「ここの色、少し違いますよ」とブランドガイドラインに沿ったフィードバックをする。
エンジニアの仕事にリスペクトを持ち、作ったものをより良いものに仕上げ、プロダクトの体験クオリティをデザイナーの手で守っていく。これが効率性と品質を両立させる、私たちの協働プロセスです。
【デザイン体制】プロダクトからグラフィックまでを越境する、少人数インハウスのリアル
e-casebookを運営する約40名規模の組織において、デザイナーは上長と私の2名です。そのため、プラットフォーム自体のUI/UX設計の「プロダクトデザイン」から、製薬会社などの大手クライアントのマーケティング施策を支える配信告知用キービジュアル（KV）の制作という「クライアントワーク（グラフィックデザイン）」まで、社内で必要とされるあらゆるデザイン領域をハイブリッドに兼任しています。
この体制は組織の規模ゆえの必然であり、今後会社がスケールしていけばそれぞれの専門領域へと綺麗に分担されていくことだと考えています。
ただし、実務を回す上での意思決定においては、デザインの品質に責任を持つ上司の確実なレビューとGO（承認）を経た上で、開発チームや社外のクライアントへと共有される確実なガバナンス体制を敷いています。これにより、少人数でありながらチームとしてのクオリティコントロールを維持しています。
また、インハウスならではの「明確な手離れの良さ」と「スピード感」は確実に存在しています。自らが自社プラットフォームの仕様・構造を理解しているため、小さな機能追加やユーザーからのフィードバックへの対応等に迅速に対応できます。
振り返りとこれからの展望：制約の中で最大の価値を出すデザイナーの立ち回り
自社プラットフォームの運用改善、そして限られたリソースでのハイブリッドなデザイン業務を通じて、プロダクトデザイナーとして磨かれたのは「限られた制約（時間・人員・システム仕様）の中で、今できる最善の解決策を見つけ出す能力」です。
綺麗なFigmaのプロトタイプに時間をかけるだけでは、今抱えている問題を解決することはできません。時にはCSSの数行の変更で、時にはエンジニアが作った動く画面に文言を足すだけで、ユーザー体験は確実に向上します。今後もビジネスの規模と開発チームのフェーズを見極めながら、デザイナーという枠に囚われず、チームでの迅速な連携プロセスのもとでプロダクトが前進するための最も実効性の高い手段を選択し続けていきます。