トラック簿

倉庫管理を最適化するサービス

hero image

UI Design

Web APP

概要

倉庫へのトラックの入出庫DXサービスのUX設計の見直しからUIデザインを担当させていただきました。倉庫従事者の行動やITリテラシーをヒアリングで把握し、ペルソナ像を作成しました。アナログ作業者でも迷いにくいUIを目指し、既存の実装済みモックアップから画面構成を再定義・再構築しました。「視認性・シンプルさ・迷わせない」ことを重視して配色とタイポグラフィを決定し、必須項目の見直しや入力支援の導入提案も行いました。

期間

7ヶ月(2020年)

担当

UX設計 / UIデザイン / プロトタイピング / 一部フロント実装用情報の引き継ぎ

成果

画面構成を再設計することで操作手順を簡略化

入力支援により入力ミスと再入力率を削減

アニメーション付きプロトタイプで開発前に操作感を確認し、仕様変更コストを削減

対応範囲

UX

  1. 課題抽出
    • 実装済みモックアップを分析し、画面構成を再定義・再構築
  2. 情報設計
    • 必須項目の見直し
    • 入力支援機能の導入提案

UI

  1. デザインコンセプト策定
    • 「視認性・シンプルさ・迷わせない」を基準に配色・タイポグラフィを決定
  2. ビジュアルデザイン
    • 実装を想定したコンポーネント化UIをFigmaで作成
  3. プロトタイピング
    • 実装に近いアニメーション付きプロトタイプを作成
  4. 実装サポート
    • Figmaのコード確認方法を共有
    • 実装時のデザイン意図共有

トラック簿

倉庫管理を最適化するサービス

hero image

UI Design

Web APP

概要

倉庫へのトラックの入出庫DXサービスのUX設計の見直しからUIデザインを担当させていただきました。倉庫従事者の行動やITリテラシーをヒアリングで把握し、ペルソナ像を作成しました。アナログ作業者でも迷いにくいUIを目指し、既存の実装済みモックアップから画面構成を再定義・再構築しました。「視認性・シンプルさ・迷わせない」ことを重視して配色とタイポグラフィを決定し、必須項目の見直しや入力支援の導入提案も行いました。

期間

7ヶ月(2020年)

担当

UX設計 / UIデザイン / プロトタイピング / 一部フロント実装用情報の引き継ぎ

成果

画面構成を再設計することで操作手順を簡略化

入力支援により入力ミスと再入力率を削減

アニメーション付きプロトタイプで開発前に操作感を確認し、仕様変更コストを削減

対応範囲

UX

  1. 課題抽出
    • 実装済みモックアップを分析し、画面構成を再定義・再構築
  2. 情報設計
    • 必須項目の見直し
    • 入力支援機能の導入提案

UI

  1. デザインコンセプト策定
    • 「視認性・シンプルさ・迷わせない」を基準に配色・タイポグラフィを決定
  2. ビジュアルデザイン
    • 実装を想定したコンポーネント化UIをFigmaで作成
  3. プロトタイピング
    • 実装に近いアニメーション付きプロトタイプを作成
  4. 実装サポート
    • Figmaのコード確認方法を共有
    • 実装時のデザイン意図共有