「マンガワン」アプリ・ウェブサイトの UI / UX リニューアルデザイン

Creative Direction

挑戦と変化をつづける
マンガワンのこれからを
体現するアプリデザインへ

2014年に生まれ、累計3000万ダウンロードされたマンガアプリ「マンガワン」。オリジナル作品を中心に掲載し、いくつもの人気マンガ作品を輩出しています。2024年に10周年を迎えました。

neccoでは、「マンガワン」ネイティブアプリのリニューアルUIデザイン、「マンガワン」ウェブサイトのリニューアルウェブデザインのお手伝いをさせていただきました。

マンガワンでは専門の編集部がいて、まだ見ぬ才能と出会うための拡散型マンガ投稿サイト「#マンガイチ」 の創設、マンガワン編集部と作家さんに密着するYouTubeチャンネル「ウラ漫」 の配信を開始するなど、常に面白いマンガを生み出し広める新しい試みをつづけています。

「まだ出会っていない面白いマンガと出会える場所」をコンセプトに、アプリ・ウェブサイトのデザインを作成しました。毎日更新される曜日ごとの作品のランキング、ジャンルや試し読みマンガを探しやすく、好きな作品と出会うきっかけとなる接点を増やしています。

また、マンガの世界への没入゙感を楽しめるようにトップページの最上部の画像背景や作品詳細の背景にはマンガの白黒の紙面を入れ、漫画の奥行きを感じられるデザインにしました。

今まで利用してきたユーザーさん、これからアプリを利用して新しくマンガを読むユーザーさんの双方ができるかぎり使いやすく、使い続けられ、より楽しい気持ちになりながらマンガを読める使い心地の良いインターファイスを目指しました。

作家さんと編集部さんたちが常に新しい挑戦をつづけ、面白い作品が次々と生まれる場所としてふさわしいアプリになることを願っています。

小さい頃から小学館さんの漫画をたくさん読んできていたので、お仕事のご依頼をいただけたときはとても嬉しく、まさか正式に提案をご採用いただき、お仕事ができるとは思っていませんでした。提案からアプリ、ウェブのリリースまで丸1年かかったプロジェクトでした。

作家さん、編集部のみなさん、開発を担当していただいたLink-Uのみなさん、neccoメンバーの力を結集したプロジェクトをぜひ、アプリをインストールしてご利用いただけたら嬉しいです。

App Design

マンガとの出会いを増やし、
より夢中になれる場所を目指して

「まだ出会っていない面白いマンガと出会える場所」をコンセプトに、アプリでは好きなマンガをユーザー自身で発見して楽しめる場所を目指し、デザインを行いました。

より作品に没入して楽しめる体験を目指し、質感や立体感のある表現を取り入れています。トップページや作品詳細ページでは背景にマンガの画像を取り入れてマンガの世界をより楽しめるようにしています。

各ページで1画面でみえるコンテンツの量や密度が心地よく感じられるバランスを保ちつつ、ページ遷移時に飽きずに楽しめるよう違う印象になる見た目を意識してデザインを行いました。

マンガワンでは毎日作品が更新されるため、トップページ上部には曜日ごとの更新ランキングを設置。最初にアプリを開いた画面には、新連載や新しく更新された作品のバナー、読んでいる作品のサムネイル、更新された曜日のランキング作品がみえるように設計しています。
更新ランキング内の曜日の文字の作字も行いました。

また今までなかった「マンガイチ」受賞作品のエリアやYouTubeチャンネル「ウラ漫」のセクションを追加。好きな作品がつくられる裏側が知りたいコアなユーザーにも、より興味を持っていただけるようなコンテンツを設置しています。

今回新しくできたミッションページでは、ゲームのような感覚でミッションに挑戦しアイテムを獲得できるページになっています。他のページとデザインのテイストを変え、アイテムやキャラクターを3Dのデザインにして、遊び心をこめたページになっています。

マイページでは、お気に入りや最近見た作品をグリッド形式でも閲覧できるようにすることで、自分の読んでいる作品を本棚のように眺めることもできます。

マンガワンで掲載している作品には、マンガワンのみで読める「ちょいたし」というおまけ漫画があり、トップ下部に説明と人気のちょいたしを閲覧できる場所を追加。購入したあとは、マイページでコレクションのようなカード形式で自分が購入したちょい足しを閲覧できるようにしています。

Web Design

アプリを軸にしたデザインに
ウェブサイトでも漫画を読みやすく

アプリのデザインを軸としてウェブサイトを制作しました。 1画面で多くの作品が見え、ウェブサイトでも多くの漫画と出会えるようにしています。 漫画を読みやすくなるような閲覧画面をウェブ用に最適化しました。

3D Characther Design

デザインとともに進化したキャラクター

立体感のあるアプリデザインに合わせ、マンガワンのキャラクターであるケルベくんこと「ケルベロス」の3DCG化に挑戦しました。
当初ミッションページ内での使用を想定していましたが、アプリの他のページやウェブサイトでも登場しています。
2Dのケルベくんのように愛される3Dケルベくんになっていくと幸いです。

illustration

遊び心のあるコインイラストに

小さくバーに表示する時も、大きくカード内で表示した時も、アイテムの状態が分かりやすく、ワクワクするようなコインのイラストを制作しました。 たくさんアイテムを購入するユーザーさんが、買ってよかったと思えるように、コイン数によって見せ方の変化をつけています。

Client Voice

マンガワンの今と未来を繋ぐデザイン

今回のプロジェクトは、マンガワンの現時地点での「らしさ」と、未来にわたってマンガアプリ業界をリードし続ける覚悟をデザインで表現するという、難しいものでした。
皆様は圧倒的な情熱とプロフェッショナルな姿勢で、マンガワンの新たな可能性を引き出してくださいました。
プロセスを通じて、私たち自身も多くの発見や学びを得ることができ、このリニューアルがマンガワンにとって大きな前進となったことを強く感じています。

広範囲にわたるデザイン業務にも、常にポジティブに取り組んでくださる姿が印象的でした！
共に作り上げていただけたことに、心から感謝申し上げます。

Link-Uグループ株式会社
グループCDO
中田 雄太

当初の提案よりもよりわかりやすく、かっこいいデザインに仕上がりました

10年に渡ってマンガアプリ業界をリードしてきた「マンガワン」というアプリを「新しく、そしてかっこよく」アップデートするにあたってneccoさんの力は必要不可欠でした。
1年近いプロジェクトの中で、常に早く正確な提案をしつづけてくださり、当初の提案よりもよりわかりやすく、かっこいいデザインに仕上がりました。
今後とも引き続きよろしくお願いいたします！

株式会社 小学館
マンガワン編集部　
酒井 颯太

「10年後も古びない」でユーザーが楽しく使い続けられるようなデザインに

国内最大級になったコミックアプリ「マンガワン」の10周年を記念した大幅なリニューアルのアプリ・Webサイトの新デザインについてご相談をしたのが約1年ほど前。
「10年後も古びないデザイン」でユーザーが楽しく使い続けられるような形をいくつかneccoさんはご提案くださり、細かな部分まで打ち合わせを重ねて素敵なデザインを制作いただきました！

株式会社 小学館
マンガワン副編集長
小林 翔

マンガワンを読み込んで使い倒してデザインを設計してくれたことを嬉しく思います

およそ5年ぶりとなるアプリの大規模UIUXリニューアルをnecco様に担当していただきました。3年前までは競合調査でもブランドイメージが劣っている状態でしたが、今回すばらしいデザインを提供いただいたおかげで、Google Play Award ではベストアプリを受賞することができました。デザインはもちろんですが、マルチデバイス対応も意識して設計くださいましたし、そして何より、デザイナーの皆様がマンガワンを読み込んで、使い倒して、それでデザインを設計してくれたことを一番うれしく思いました。これからもアップデートしていきたいので、引き続きよろしくお願いいたします。

株式会社 小学館
マンガワン編集長
豆野 文俊