背景

日本の大手テレビショッピングネットワークである QVC は、番組に出演するタレントを管理するための新しい社内システムの構築を進めていました。
この開発プロジェクトを担当していたUnixonは、システム全体の設計初期段階からSAMI Japanに協力を依頼。UXロジックとビジュアルデザインの基盤をゼロから設計する という重要な役割を担いました。

今回のミッションは、今後のシステム開発の基盤となる ビジュアルスタイルとUI/UXの情報構造 を設計するとともに、主要なユーザーフローを支える 重要なコア画面 を高い完成度でデザインすることでした。

‍

プロジェクト範囲

本プロジェクトでは、ビジュアルデザインに着手する前に、まずシステム全体のUXロジックを明確化することからスタート。
Unixonチームと共に初期スケッチを分析し、ユーザーの行動パターンを整理。ユーザーが画面内および画面間をどのように移動すべきかを定義し、早い段階でスケーラブルなナビゲーションモデルを確立しました。

設計範囲には、こうしたインタラクションロジックに加えて、主要な3画面の詳細UIデザインが含まれ、それぞれ複数のインターフェース状態を想定してデザインを行いました。

‍

デザインプロセス

主要な3つの画面は、異なる操作状態・ユーザー導線を複数パターンで検討。改善したロジックを反映しながらユーザーフローを再構築しました。

たとえば、検索機能では3種類の検索タイプを設計し、利用ケースに応じて動的に挙動が変わる仕様を実装。また、ナビゲーション構造をシンプルに整理し、情報の階層を明確にしたダッシュボードレイアウトを提案。ユーザーが目的の情報にすばやくアクセスできるよう設計しました。

デザインテーマはライトモードを基本としつつ、将来的なユーザーフィードバックや技術要件に応じて切り替え可能なダークモード案も合わせて納品しました。

‍

成果物

デザインフェーズは1か月以内に完了。
成果物として以下を納品しました：

• システムロジックとユーザーフローを可視化した Miroボード
  
  
• Figmaファイル
  
  • ワイヤーフレーム（低解像度）
    
  • 高精細モックアップ
    
  • カラーデザイン（ライトモード／一部ダークモード）

これらの成果により、Unixonの開発チームは次フェーズ以降の実装をスムーズに進められるUI/UXの設計基盤を確立することができました。

‍

コラボレーションスタイル

本プロジェクトでは、SAMIとUnixonの緊密な連携が特長でした。
毎週のレビューMTGで主要な意思決定を行い、双方向でのフィードバックを重ねながらスピーディーにデザインを改善。Unixonが明確な開発ビジョンを提示し、SAMIが国際的なUX視点とデザイン専門性を提供することで、真の共同開発体制を築くことができました。

‍

共有された学び

デザイン納品後、Unixonの社内ではSAMIとの協働プロセスが高く評価されました。社内勉強会では本プロジェクトが部門横断的な成功事例として紹介され、特に以下の4つのポイントが印象的な成果として共有されました。

1. ユーザー中心のロジック設計：複数機能を1画面に詰め込むのではなく、ユーザーの目的ごとにフローを分離することで、直感的で理解しやすい導線を実現。
   
   
2. 明確な操作ガイド：主要アクションをユーザーが自然に見つけられる位置とサイズで配置し、色と余白で視線を自然に誘導。
   
   
3. ストレスのないフィードバック設計：エラーメッセージの原因と解決策を提示し、モーダルではなく軽量通知（トーストなど）で情報を提供。
   
   
4. 情報の優先順位とコンテキスト対応：必要な情報のみを適切なタイミングで表示し、ノイズを減らして集中度を高める。
   
   

これらの設計原則は、「正確で、理解しやすく、スムーズなユーザー体験」を生み出すための指針として今後のプロダクトデザインにも活用されています。

‍

今後

今回構築したUX/UIの基盤は、Unixonが今後QVC向けに進めていく社内システム開発のデザイン・ロジックの中核として機能します。
SAMIは今後も、設計したUIシステムをもとに新たな画面や機能が追加される際のレビュー・検証を支援し、実装段階・テスト段階でも継続的に伴走していく予定です。

‍

‍