Daily UI #007 / 008 / 009 / 010
- コミュニティアプリ
- ホテル・旅館
- 音楽
制作範囲
- デザイン
- 企画
制作ツール
- AdobeXD
- Figma
制作期間
- 4時間 ~ 5時間
Daily UI #007「Setting」設定画面





デザイン概要
現在製作中のコスプレ特化型アプリ「CosComi」のプロフィール設定画面のデザインを作成しました。
Twitterや投稿型SNS「LIPS」のアプリを参考にSNSやコミュニティにおいて最低限必要なブロック、ミュート機能、アクセシビリティ対応などの設定を実装しています。
設定タイトルの下に、その項目を設定すると何ができるのか具体的な文言を記述することで、クリック後にユーザーが行うアクションをすぐに把握できるようにしています。

Daily UI #008「404」

デザイン概要
HOTEL小町の404ページのデザインとHTMLを作成しました。
404ページはエンタメやおもしろ要素が含まれたページが多い印象ですが、今回はホテルサイトということで、ユーザーの導線に合わせたリンクを配置しました。
ビジュアルに入浴中の猿の画像を使用させていただき、温泉付きホテルらしい遊び心を持たせています。
Daily UI #009「Music Player」ミュージックアプリ


デザイン概要
「Youtube Music」と「Spotify」のミュージックアプリをベースにデザインを作成しました。
ミュージックプレイヤーの画面はスライド形式になっており、聴きたい曲をすぐにスクロールで変えることができるようになっているため、一回戻ってまた操作するという動作を削る仕様にしました。
(恐らく音楽を聴くときはプレイリストにまとめる可能性が高いので、スライドの実用性は微妙かもしれませんが…)
Daily UI #010「SNS Share」SNSシェア

デザイン概要
#009「Music Player」のお題を利用し、SNS共有画面のデザインを作成しました。
基本的なSNSはもちろんですが、音楽アプリということで「Bluetooth」との連携はあながち重要だと制作中に気づきました。
リンクをコピーでは、リンクURLを視覚化することにより誤ったリンクのコピーを防止したり、ユーザーが正しいリンクがコピーしていることを確認しやすくなると考えました。
