【 BONO】SpotifyのUl改善ケーススタディ
音楽ストリーミングサービスSpotifyのUI改善のお題に挑戦してみました。
🌴BONOとは?
YouTubeでデザインのを発信しているカイクンさんが運営しているUIとUXの学習のコミュニティです。
BONOのコミュニティリンクはこちらです。
【お題】
友達が聴いてる音楽がわかるUIをデザインしよう
「Spotifyのような音楽アプリで、友人が聴いてる音楽から新しい音を知れるUIをデザインしてください」
•既存のspotifyの仕組みは損なわない
•β版として反応を見るのも含める
•UIテイストは既存のアプリに従うものとす
この課題を整理するとこんな感じです。
こちらの課題を解決するために以下のような設計をしました。
そして実際に作成した画面がこちらです。
以上がお題の前提部分です。
ここまではカイクンさんがデザインをし、解説していたものトレースしただけです。
この改善に対して、更に踏み込んだ改善をする追加お題があります。
追加お題
今回のコンセプトは機能を認知してもらう導線設計することになります。
なぜ導線設計が必要なのか
Spotifyはユーザーに対しこのように行動してほしい、というシナリオが存在します。しかし、そのシナリオ通りの行動をユーザーに促すためには、目的地までユーザーを導く道筋を設計する必要があります。
もし、適切な経路に適切なコンテンツが配置されていなければ、途中で離脱してしまうユーザーが多くなることは想像できますよね?
こうした状況を避けるため、ユーザーがSpotify内でどういった行動をとるのかをしっかり把握し、認識することが大切です。
こちらの課題を解決するために以下のような設計をしました。
このお題に対するアイデア出し、デザインパターンについてプロセスを書いてきます。
UIリサーチ
今回参考にしたデザインはTikTokです。
■TikTok
フォロータブへの誘導導線は下記の項目
・検索バーで名前を検索
・連絡先と繋げる
・Facebookの友達と繋がる
UIデザインのラフスケッチ
voicyの登録画面を参考にUIデザインアイデアを考えてみました。
完成!
そして実際参考にした画面がこちらです。
実際のデザインデータ
デザインで意識したポイント
こちらで一旦 完成としました。
今回も読んでいただき、ありがとうございました♡
この記事が気に入ったらサポートをしてみませんか?