TOP

Daily UI #023 / 024 / 025 / 026

アプリデザイン
  • アパレルEC
  • コミュニティアプリ
DailyUI_023-026

制作範囲

  • デザイン
  • 企画

制作ツール

  • Figma

制作期間

  • 4時間 ~ 5時間

Daily UI #023「Onboarding」オンボーディング

CosComi ジャンル選択
コンテンツ選択
CosComi 好きなアニメ
好きな作品選択
CosComi おすすめフォロワー
おすすめのフォロワー

デザイン概要

コスプレ特化型アプリ「CosComi」のオンボーディングをデザインしました。

こちらはアプリ設計時の時点で計画していたのもので、「パーソナライズ型」という興味関心がある情報をあらかじめ取得することができるものです。

コンテンツ選択

ユーザーが活動しているまたは興味のあるコンテンツを選択することができます。

この時点で、同様の活動をされているユーザーをざっくりと絞り込むことを想定しており、例えるなら「撮影」を選択するとカメラマンや撮影スタジオを運営しているユーザーがターゲットになります。

好きな作品選択

同じ作品が好きなユーザーや活動しているレイヤー・カメラマンを絞り込むことでより自身に近いユーザーを厳選します。

フォロワー選択

これまでの「コンテンツ選択」「好きな作品選択」を選択した上でユーザーの投稿内容やプロフィール内容の情報などを元におすすめのフォロワーを表示します。

Daily UI #024「Boarding Pass」搭乗券

搭乗券アプリ

デザイン概要

搭乗券のUIデザインを作成しました。

飛行機に乗ったことがほとんどなく、搭乗券がどんなものか分からなかったので、ANAアプリや他の方の作品を参考に制作しました。

表示した際に必要な手続き窓口を記載することにより、搭乗時のミスや乗り遅れなどを防ぐための要素をなるべく配置しています。

Daily UI #025「TV App」テレビアプリ

動画サブスク_PC
PC画面
動画サブスク_SP
SP画面

デザイン概要

Daily UI #001 で制作した動画サブスクの一覧画面を作りました。

アマプラとディズニープラスを参考に横スクロール型で、メインビジュアルのスクロール位置表示に数値を用いました。

ホバーした際に作品のストーリーや視聴状況などの詳細をすぐに表示することで、興味を持った作品に対してより詳細な情報を見ることができ、視聴するかどうかを決定しやすくなると考えました。

Daily UI #026「Subscribe」サブスク

アパレルサブスク

デザイン概要

Daily UI #002で制作したアパレルECアプリをベースにしたサブスクアプリです。

AIを用いておすすめのファッションを紹介してくれるアプリを想定しました。
サブスクを利用するまでにユーザーが利用したいと思うキッカケや気軽に始めることができる導線が必要なので「なぜおすすめなのか」「なぜ選ばれるのか」をアピールすることを重視してデザインしました。