mupla

株式会社レコチョク

同社「レコチョク web3プロジェクト」立ち上げに伴い、PJ専属デザイナーとして2022年3月より参画 音楽とweb3領域の技術を掛け合わせた、新たな顧客体験を創出するプロダクトを開発。 NFTの発行・販売・所有体験を高める専用サイト、ブロックチェーンを活用したチケット型NFT、 音源がセットになったNFTパッケージなどをリリース

KEY WORDS使用ツール
YEAR製作時期:2023
GENRE業種エンタメ
URLURLhttps://mupla.jp/
SECTION担当
  • UI/UX設計
  • 要件定義
  • ロゴデザイン
  • サイトデザイン
  • コーディング
  • ガイドライン作成

インサイト

目的・背景・課題
NFTの技術を使い、アーティストとファンの新たな接点とファン体験を広げていきたい。 そのためにサービスを一貫して伝えるクリエイティブが必要

ターゲット
アーティストや芸能事務所関係者(toB領域)

ブランドの現状
2021年7月に「レコチョク web3プロジェクト」と称してPJを立ち上げ、 NFTを販売するプラットフォーム(murket)をローンチ、購入したNFTを閲覧するプラットフォームが必要

将来像
所有体験を高めるNFT専用サイト(mupla)に続き ブロックチェーンを活用したチケット型NFTや、音源がセットになったNFTパッケージをローンチし、 「音楽 x web3 = レコチョク」という認識とマーケットを開拓していきたい

インサイト
最先端の技術を用いたサービスが感じさせる、未来的なロゴや色使いに加え、 音楽がもたらす"楽しさ"や"エモさ"といった、情緒的な表現を取り入れたクリエイティブの構築が必要。 「人間味のある未来感」を演出し、かつ、シンプルでわかりやすいUIを表現する

コンセプトカラー
プロダクトを通じてのキーワードとしては"未来感"と"楽しさ"。グラデーションで未来の技術と新しい価値への変化を表現かつ、グリーンベースの配色でPOPさを表現しました

#3fb07c #1a83b3 #1f59a4

-OUTPUT-

GUIDE-LINEガイドライン作成

サービス全体のイメージは未来的な印象を強調するため、3色のグラデーションを採用。 グラデーションの組み合わせについては、未来的でありながらも親しみやすいブルーベースを使用した。 アクセントカラーとして同社のコーポレートカラーを使用し、より分かりやすく「レコチョク = web3」という印象を植え付けたい。 サービスオフィシャルのフォントについても"未来"を意味する「FUTURA」を採用。

LOGOロゴ

サービス名「mupla」と、音楽「music」からアルファベットのMをモチーフに、NFTを連想させる6角形のモチーフを採用。 新たな仮想通貨のようなイメージで、ファビコンやアプリなどへの転用を考慮し、おさまりの良いロゴマークに仕上げた。 マークが印象に残るようロゴタイプはシンプルな表現に抑えた。合わせてロゴガイド作成まで担当。

LANDING-PAGEランディングページ

サービスローンチに伴い、toB用にLPを制作。通常はデザインのみだったが、 社内開発状況の兼ね合いもあり、リサーチ/デザイン/コーディング/ファイル納品までを担当。 音楽 x web3(NFT)を使って、より新しい顧客体験を創出するというテーマに基づき、 グラスモーフィズムやグラデーションで未来感を演出しつつも、アニメーションや手書きのフォントで人間味のある演出に。 背景のライブ動画では、"音楽"や"ファン"といったキーワードを引き立てると同時にアイキャッチ効果を狙った。 CVはお問い合わせを増やす目的でCTAとフローティングボタンを設置した ※CV数値については非公開

mupla-UIUI作成

既存のサービス画面デザインアップデートに伴いUIデザインを担当。 ベースの画面デザインに加え、NFTチケットの実装、フリーMINT機能の追加等、拡張機能のデザインまで行う。 NFTというまだ認知が広がっていない分野のサービスにつき、UIはシンプルでわかりやすい設計を意識してデザイン。 UXリサーチやチーム内の意見を参考にブラッシュアップを行った。