kokeblog

音楽アプリ「neumu」再生画面UIデザイン

  • 2020年07月16日
  • 前々回の記事で、XDを使ってニューモフィズムを作るという記事を書きましたが、そのニューモフィズムを使った音楽アプリの再生画面のUIデザインを制作しました。アプリ名は「neumu」で、シンプルに「neumorphism」と「music」を合わせた名前になっています。それでは、詳しくまとめていきます。下の画像が今回のデザインです。

    デザインについて

    デザインについて詳しくまとめていきます。

    今回は、ニューモフィズムを取り入れるというのがテーマなのでニューモフィズムにがっつり寄せて作っていくことを特に意識しました。一応、若者でイマドキのイケてる人たちが使ってくれることをイメージしましたが、そこまでユーザーなどのこと意識せずに、好きなようにデザインしていきました。アイコンもIllustratorを使って自分で作りました。

    あまり、要素が多すぎるとニューモフィズムを使っているということもあり、ごちゃついてよくわからなくなると考えたので、音楽アプリの再生に必要最低限の要素だけをいれました。また、要素同士の間が狭くならないようにも意識しました。ボタンの凹凸の違いがどうしてもわかりにくくなってしまうので、凸の時はアイコンの色は白にして、凹の時には、青にしてさらに周りに円のラインを入れて、違いが出るようにしました。

    まとめ

    今回、初めてのニューモフィズムを使った作品を作ってみました。自分の使ったことのない手法に触れてみるのも結構面白いですね。使い所はやっぱなかなか難しいですが、どこかでまた取り入れてみたいなと思います。また、今回はとりあえず音楽再生画面のみですがプレイリスト画面などを増やして、もう少しやってみます。

    Pocket

    関連記事

    オープンキャンパスのバナーデザイン

    ポートフォリオサイトを制作しました!

    自分用の名刺デザインしました!

    矯正歯科、こども歯科の名刺デザイン

    カテゴリー