【エンタメサービスのUI/UX分析】 ピッコマ編
株式会社FuturizeでUIデザイナーをしているもなみです。
社内のデザインチームで、「様々なエンタメサービスのUI/UX分析をする記事を書こう」プロジェクトの第二弾の記事を担当します！それではどうぞ！
はじめに
ピッコマは、多くの人気マンガ・WEBTOON・ノベル等作品を提供する、⽇本市場でトップシェアを誇る電⼦マンガ・ノベルサービス。
韓国のIT大手カカオの日本法人であるカカオジャパンが運営し、23時間ごとに1話無料になる「待てば￥0」モデルを日本で初めて導入したことでも有名です。
電⼦マンガ・ノベルサービス「ピッコマ」サービス開始から 7 年、 2023 年「年間取引⾦額 1,000 億円突破」と「⽇本アプリ市場消費者⽀出 1 位」を 同時に達成。電⼦マンガの単⼀プラットフォームとしては世界唯⼀。
https://www.kakaopiccoma.com/wp-content/uploads/news240122.pdf
急成長を遂げたピッコマの成功の秘訣はどこにあるのか、UIUXの観点から分析してみたいと思います。
ここがすごい 〜UI編〜
1. 要素を削ぎ落とし表紙に目がいくデザイン
ピッコマはライト層をターゲットにしており、タイトルや作家名での検索性よりも表紙のビジュアルを重視しています。
作品は3カラムで大きく表示し、「待てば￥0」、「￥0」（無料で読める）のアイコンや、動画を見て無料など、マンガを読みたくなるきっかけづくりになる要素を目立たせています。
ファーストビューには画面の1/3以上がカルーセルになっており、メリハリのある見せ方でバナーが目に止まります。
背景は白を基調とし、フォントは細めのグレースケールで統一されています。
役割のあるシンボルのみに色をつけることで、マンガを探す際のユーザー体験をよりシンプルで直感的なものにしています。
このように情報に強弱をつけることで、情報量が多い画面でも作品へフォーカスがいくような視線誘導ができています。
2.表紙に負けないバナーデザイン
バナーは、派手な表紙のイラストに負けないよう、明るく立体感を感じさせるグラフィックデザインになっていることが分かります。
ポップアップバナーは一瞬で閉じられてしまうことが多いため、文字情報よりもオブジェクトや色のコントラストを活用し、記憶に残るよう工夫されています。
説明を多く載せず、ビジュアルファーストなデザイン手法は韓国や中国の広告でよくみられます。
視覚的に魅力的なデザインは、購買意欲を刺激することを目的としています。
漢字やハングル文字はたくさん並べてしまうと可読性が低下するため、シンプルにまとめるデザイン傾向にあるのかもしれません。
全体的に立体感があり、赤や黄色のおめでたいとされる色使いがポジティブな印象を与える
出典：淘宝 - 太好逛了吧, https://x.gd/n7XbN
画数の多いハングルや漢字は、可読性を高めるため文字はフラットであることが多く、そのぶん立体的なデザインとの相性が良いです。
平面的な表紙が並ぶ場合は、立体的なモチーフと組み合わせることで、単調にならず印象に残るデザインにすることができます。
一方日本では、商品の詳細や特徴、使い方などの情報が含まれ、消費者に十分な情報を提供することが重視される傾向にあります。
また言語が共通なことや、漢字・ひらがな・カタカナとバリエーションがあり字体が単調にならないので、比較的長い文を置いても問題がありません。
日本（左）は説明文が多いのに対し、 韓国（右）はボタンや色使いを重視
出典：サーティワンアイスクリーム, https://www.31ice.co.jp/
배스킨라빈스, https://www.baskinrobbins.co.kr/
最近話題になっている、FALLの映画ポスターは日本特有のデザイン例かもしれません。
日本版ポスター問題。
— タラ (@1xkujzaO1tYxEmh) June 9, 2024
日本版を全否定する気はないんですよ、日本版ポスターの方が好きな作品もあるし。
ただ今回『FALL/フォール』の画像を検索したら、やっぱ「やたら文字などで空間を埋める」って良くないと思いました。
これ↓、ほとんど同じ画なのに“高さ感”が全然違う。 pic.twitter.com/nFIKFmhFX6
日本のポスターは言葉を添えてくれているので、この映画の背景を読み取ることができ、親切であると言えます。
左のポスターにはこんな場所で何が起こっているんだろう？という不安感や疑問が心に残り、自ら詳細を調べるアクションを起こせるのではないかと思いました。
つまりコンマ数秒が大事なポップアップ広告には、詳細な説明よりも、「なんだか楽しそう！」「コインが貰えるかも？」という期待感をもたせることが重要かもしれません。
3.作品を読み続けるための迷わないUI
「続きから読む」ボタンには次の話数を表示し、前回読んだ話はグレーアウトされ一番上のセクションに表示されています。
これによりユーザーは、迷うことなく続きから読むかどうか判断できます。
待てば￥0を消費した時も、アイコンがグレーアウトし、上部のプログレスバーでチャージ量を確認できます。
時短アイテムを持っている場合は、右下のアイコンがお知らせしてくれるので、ユーザーは直感的に現在のステータスを理解することができます。
「動画を見ると無料」のコンテンツはアクションの前にワンクッションお知らせしてくれるため、行動を選択できます。
アクションに繋がる情報をちゃんと視覚的に確認でき、なおかつシンプルなUIにまとまっているため、ユーザーは快適に操作することができます。
その結果、回遊率の向上に繋がっていると考えられます。
ここがすごい 〜UX編〜
1.毎日開きたくなるような仕掛け
冒頭で述べたように、ピッコマのターゲットはライト層。
この作品が読みたいんだ！と目的を持ってマンガを読みにくる層ではなく、暇つぶしに使いたい、色んな作品を読み漁りたい、新しいコンテンツとの出会いがしたい…などなんとなくアプリを開く人たちをターゲットとしています。
ピッコマが始めた「待てば\￥0」（23時間ごとに1話が無料で読め、それより早く読みたければ課金するモデル）はマンガを読む習慣をつくるためのものです。
ピッコマを開くことを習慣化させるということが、このアプリを成功へ導いたコアな部分なのではないかと考えます。
ホームには、30項目以上のおすすめコンテンツが紹介されており、スクロールしがいがあります。
上部にカテゴリ、￥0で読めるマンガ、曜日連載、新着…と豊富な選択肢のソートがあり、読みたい作品がなかったとしても探索しやすい設計になっています。
また、マンガを読むことで・読むために貰える報酬がうまく循環しています。
毎日1つ作品を読むごとにもらえるスタンプ。BINGOのように縦横斜めで報酬が貰えるので、1日忘れてもモチベーションが続きます。
1話読んでから23hが経つとチャージ完了の通知が届くので、気になる作品を読みにアプリを起動します。
この時間制限を早めるためのアイテムガチャが毎日6時、12時、18時に引けるため、こまめにアプリを起動するほどそのチャンスを逃さないわけです。
いつの間にかピッコマを開くのが習慣化し、マンガを読むだけでなく、このタスクをこなすことが快感になっていくことでしょう。
2.ピッコマ独自の機能
また、他のマンガアプリと違う機能として、チャンネル、ピックリストが挙げられます。
チャンネルには、レーベルごとに注目の作品が配信されています。各出版社がキャンペーンを打ち出せるので、マーケティングやブランディングツールとしての活用ができ、ユーザーは作品からレーベルを知るきっかけにもなります。
ピックリストは、ユーザー同士で選んだマンガをおすすめし合うことができ、AIレコメンドでは出会えない作品を見つけられるでしょう。
ユーザーをフォローしたり、リストにいいねを送る機能もあり、今まで個人で楽しむものとなっていたマンガアプリの楽しみ方が広がっています。
ランキングに入ると賞金やコイン、時短アイテムがもらえ、マンガを読むことに付加価値が生まれる点が面白いです。
まとめ
ピッコマは、「待てば￥0」モデルを通じてユーザーに毎日アプリを開かせる仕組みを作り、アイテムガチャやユーザー間のレコメンドを通じてさらにその習慣を促進させています。
この設計こそがピッコマが成長していった大きな理由の一つであり、ユーザーにとって使い勝手の良いUIを追求した結果、要素を削ぎ落としたデザインになっていったのだと考えます。
UXを重視したプロダクトについて、なぜこのUIデザインになっているのか、その核心部分を見つけることで見えてきました。
デザイナーをしている人たちにとって、UI/UX設計の理解に繋がれば幸いです。
Futurizeについて
Futurizeは、エンタメ領域のプロダクト開発スタジオです。
これまでに多様なエンタメプロダクトを手掛けてきた経験を持ち、エンタメへの情熱を持つメンバーが揃っています。
特にデジタルネイティブ世代をターゲットにしたプロダクト開発を得意としており、
グループ会社である株式会社Mintoと連携して、プロダクト開発だけなく、コンテンツ制作から流通まで一貫してサポートが可能です。
エンタメプラットフォームの立ち上げや、次世代のエンタメプロダクトの開発をお考えの企業様はぜひご相談ください。
この記事が気に入ったらサポートをしてみませんか？