DailyCocoda! #041~#050【ラスト】

OVERVIEW

Cocoda!(https://cocoda-design.com)のDailyチャレンジの制作物です。

YEAR 2019

Dailycocoda! とは

株式会社almaが運営する、UIデザイン学習サービスCocoda!の課題の一つです。
毎日決められた画面・ターゲットユーザ・コンセプト・雰囲気が提示され、そのお題に合わせてUIデザインを行います。

作品

#041 タイマー画面 

設定

誰向け:料理や勉強など時間を測って何かする時
コンセプト:手軽に使えるタイマーアプリ
雰囲気:シンプルで見やすい

ポイント

アラーム・タイマー・ストップウォッチの3機能が入ったアプリです。
簡単に使用できるように、機能はかなりシンプルにしています。
作成した画像は「タイマーの設定画面」です。
開始の左側で音の設定、右側は良く使うタイムリスト表示になります。


#042 動画アプリの動画詳細画面 

設定

誰向け:休日はゆったり動画を楽しみたい30代
コンセプト:見たい映画やTV番組が見られる動画アプリ

ポイント

Amazonプライムの構造を参考にリデザインしてみました。


#043 eギフト画面

設定

誰向け:友達に日頃の感謝を伝えたい人
コンセプト:友達に気軽にeギフトが送れるアプリ

ポイント

左側がプレゼントの貰い手、右側が送り手です。
送り手は、プレゼント内容→カードのデザイン→メッセージを記入して送ります。
カードの裏側にはバーコードが記載されています。
かなりシンプルになってしまいました。


#044 チュートリアル

設定

誰向け:仕事を効率化したいビジネスマン
コンセプト:シンプルで使いやすいTodoリストアプリ

ポイント

タスク形式で基本的な使用方法を表示します。
チュートリアルが長くなる場合は、どれだけ長くなるか知るために進捗度を入れました。
チュートリアルは必要な人だけ表示するようにします。


#045 Cocoda! LP リデザイン

設定

誰向け:デザインを学びたい人
コンセプト:デザインで繋がり、学び会えるコミュニティサービス
雰囲気:自由に設定

ポイント

基本構成や色味はそのままでリデザインしてみました。
機能が増えているので、その機能をしっかり紹介して「はじめやすい!」と思ってもらえるLPを目指しました。


#046 商品の購入

設定

誰向け:安く手軽に商品を買いたい人
コンセプト:欲しいものが見つかるフリマアプリ
雰囲気:買うものを決めてから購入完了までの画面を作ろう

ポイント

フリマの商品購入はネット通販と違い、1つの商品ごとに購入するので、あまり確認画面を増やさないようにしました。
購入と確定の間に1回確認画面を挟んでいます。(2枚目画像)


#047 検索機能

設定

誰向け:おしゃれにこだわりがある男性
コンセプト:メンズでも使いやすいヘアサロン予約アプリ
雰囲気:気軽に使えるカジュアルな雰囲気

ポイント

男性向けのヘアサロンアプリを目指しました。
カラーをクールにし、特集も男性向けにしています。
あまり細かい機能は入れず、検索、特集記事、予約の確認のみにしています。


#048 移動経路表示

設定

誰向け:住所に沿って初めての場所に行く時
コンセプト:目的地までの経路を示してくれる地図アプリ
雰囲気:目的地設定~到着までで必要な画面を作ってみよう

ポイント

ユーザの目線を考えながら作成しました。
右側が、目的地を検索する時の画面、左側はナビ中の画面です。
検索中は検索画面の方を使用するので、ヘッダーに色をつけています。ナビ開始後は、目的地までの進み方がユーザにとって必要な情報になるので、フッター側に色をつけています。


#049 画像アップロード

設定

誰向け:イラストを描くのが好きな人
コンセプト:気軽にイラスト画像を投稿できるSNS
雰囲気:馴染みやすい , シンプル

ポイント

画像を選んで投稿する時の画面です。
画像をタップすると、画像の追加・並び替えができる画面に移動します。
画像スワイプで次の画像を確認できます。(複数画面のみ)
キャプションはSNSにあるような、#をつけることでタグ化することができます。その説明を入れています。


#050 あなたのポートフォリオサイト

設定

コンセプト:今まで作ったデザインをまとめたポートフォリオ
テーマ:あなたのデザインとその考え方が伝わるように自由に作ってみよう

ポイント

実際に作りたいと考えているポートフォリオサイトにしました。
作品を目立たせるため画像メインで、作品をクリックすると詳細ページに移動します。
作品は今までに作ったDailycocoda!のお題にしています。