はじめに

はじめまして！viviONプロダクトデザイナーのもなかです。
普段は二次元コンテンツ電子配信サービス「DLsite」のプロダクトデザインを担当しています。趣味は本屋巡り、iPadでのイラスト制作です🎨

今回は主にモバイルアプリのブランディングデザインに焦点を当て、以前立ち上げたアプリにまつわる制作秘話をご紹介します。

この記事でわかること↓

・大規模既存サービスから新規アプリを立ち上げる際のデザイナーの葛藤と、それをどう乗り越えたか📘
・viviONデザイナー間で、日々現場でどのように連携しながらプロダクトデザインを行なっているか🔍

ちょっと長めなので、気になったトピックを重点的に見ていただければ何よりです！

📚電子書籍読書アプリ「DLsite Library」をリリース！

2024年秋、DLsiteがモバイル専用読書ビューアアプリ「DLsite Library」を新たにリリースしました。
DLsiteとは、PCが普及し始めた1996年から続く二次元コンテンツ電子配信サービスです。
そもそも、なぜDLsiteが新アプリ立ち上げに至ったのでしょうか。

📱なぜ新アプリをリリースしたか？

サービスの成長に向け、時代の変化への対応が重要だった

元々DLsiteにある電子書籍が読めるWebアプリ「DLsite Play」は、電子書籍のオフラインダウンロードに対応していませんでした。そのため、

スマホでオフラインダウンロードして漫画を読めるようにしてほしい！

とユーザーさんから多くの改善要望をいただいていました。

一応オフラインダウンロードができるモバイルアプリは「PFViewer」というものが存在していたのですが、開発してから数年が経過。

実際ユーザーさんからの評価も☆1.6と低く、

・漫画を読むまでに必要な手順が多すぎる
・本棚の並び順の変更ができず、自分好みに整理整頓できない

　　　　　　　　　　　　　　　　　　　　　　　　　実際にあったご意見(一部抜粋)

昨今のモバイル端末での電子書籍の閲覧体験に最適化しているとは決して言えない状態でした。😭

DLsiteのモバイル端末での閲覧体験を向上し、よりユーザーの皆様に選ばれるサービスにしたい！その思いでiOS/Android向けモバイルアプリ、DLsite Libraryの開発に至りました。

🤯既存事業から新規アプリ立ち上げのデザイン、超大変！

アプリは0から開発するけど、既に本家のDLsiteはなんと20年以上前からある・・・という状況。
DLsiteほどの規模が大きいサービスから新ブランドを立ち上げるのは、実際やってみるととても難しかったです！

既存のDLsiteブランドと新しさのバランス

DLsiteといえば、現状アダルト作品のイメージが強いです。
今後DLsiteサービスを拡大していくためには、既存イメージのアップデートが必要な状況でした。

とはいえ、今までDLsiteを支えてきてくれたユーザーさんにも受け入れられるようなデザインにすることもとても大切です。

アプリはゼロから開発する。けど、DLsite自体は歴史が長く考慮事項が多岐にわたるサービス。まさに「ゼロからだけどゼロじゃない」難易度の高いバランス感覚が求められる状態……！⛰️

求められたのは、

💗長年愛されてきたサービスのブランドイメージを損なわず、新しいユーザー層にも響くデザイン

でした。

どう試行錯誤したか？

実際、どう試行錯誤しながらアプリデザインの立ち上げを行なったのか。

【🔍情報のインプット方法】、【🫱‍🫲デザイン組織との関わり方】の大きく2つのカテゴリに分け、実際に試行錯誤した点をお伝えします。

🔍情報のインプット方法
1.サービスの過去/現在/未来を整理する
2.他社分析から新規ユーザーと既存ユーザーの共通項を探る
------------------------------------------------------------------------
🫱‍🫲デザイン組織との関わり方
1.同一事業の関連プロダクトと足並みを合わせて体験設計を行う
2.いろんなメンバーの知見を集めてブラッシュアップする

🔍情報のインプット方法

1.サービスの過去/現在/未来を整理する

プロジェクト立ち上げ時、取り掛かったのはまず情報を集めることでした。

・今回立ち上げるアプリのプロダクト戦略
・社内ドキュメント(過去の意思決定の経緯/歴史的背景がわかる資料など)
・身近でDLsiteを利用してくれている方へのヒアリング

幸いDLsiteは歴史の長いサービスなので、アプリ立ち上げのヒントになる情報を沢山得られました✨（ありがとうございました！）

しかし情報を集めていると、逆に考えることが多すぎて何をすべきかわからなくなってしまうことが多々ありました。
振り返ると、頭の中で無意識にやっていたのは「過去/現在/未来に分けて情報を整理する🗂️」でした。

↓↓↓↓↓

混乱した際は過去/現在/未来をあえて一度それぞれ箱のようにとらえ、インプットした情報は３つのどれに当てはまるのか仕分けてみます。

仕分けできたら、それぞれの情報から下記のヒントを得られないか俯瞰してみます。

🎞️過去
・過去、どのような目的でどんな意思決定を取ってきたのか
・サービスの何がユーザーさんに価値を感じてもらえているのか
・サービスの思想や大切にすべき部分とはどこか

🏃‍♀️現在
・サービス成長のために今最も解決しなければならない課題はなにか

⛰️未来
・どうなっていればよりユーザーさんの満足度を高められるか
・サービスが「伸びている」といえるのはどんな状態か
・サービスのありたい姿とは何か

この整理を行うと今やるべきことがクリアになり、

・🎯サービスを改善するために今何をすべきなのか
・💌どんな思想を持ってデザインの意思決定をすべきか

自分なりに答えを持って動くことができました💪

2.ユーザーさんの日常に溶け込めそうなデザインを模索する

こちらは実際にアプリのブランディングデザインの方向性を決めていく段階で気づいたポイントです。

ブランディングのアイデア出しは、

・💬SNS
・🗣️ボイス通話サービス
・🧸二次元グッズ販売店

など、ユーザーさんが日頃からよく利用しているであろうサービスの実際の画像を並べて観察するところから始めました。(オンライン&オフラインどちらも)

実際のポジショニングマップ

既に多くのDLsiteユーザーさんに好かれていそうなものを推察することで、「日常の中に溶け込めるようなデザイン、あったら嬉しいデザインってなんだろう？」というイメージを膨らませていきます。

探っていくと、

「有名な二次元系のサービスって青系多いな🟦」
↓↓↓
「寒色系って男女共に人気かもしれない」

という感じで、具体的にどんなデザインが受け入れられそうか傾向がつかめたり、

「多色の光を用いたゲーミングデザインって最近ガジェットによく取り入れられてる🌈二次元コンテンツ好きに人気みたい」
↓↓↓
「部分的にデザインにその要素を取り入れてみようかな」

といった感じで、アイデアも浮かび始めたりしてきます。

また逆に、二次元コンテンツを楽しんでいる瞬間にはあまり想起しないようなデザインや世界観とは何か？も探ります。

🤨逆の印象…シンプルでも、画一的なシンプルさを提供している、万人受けを最重要目的としているブランド。ナチュラル志向。スマート志向。大衆向け量販店のような印象など。

今回はいい意味でオタクの混沌（カオス）な状態を誇りに思い、肯定していくのがDLsiteの在り方としてベストでは。と考え、こういったテイストからはあえて少し離れた立ち位置を意識しました。

補足ですが今回は既存アプリの刷新だったので、既存ユーザーにも新規ユーザーにも受け入れられそうな共通項となる要素を意識的に抽出していきました✅

ある程度イメージが固まってきたら仮のビジュアルを複数案起こし、デザイナー、営業メンバーなどさまざまなFBを集め、多角的な視点からデザインを検討しました。

🫱‍🫲デザイン組織との関わり方

1.同一事業内の関連アプリと足並みを合わせて体験設計を行う

DLsite LibraryはDLsite関連サービスの中に近い役割のアプリがいくつかあります。

・🎧音声プレイヤーアプリの「DLsite Sound」
・🎮スマホでPCゲームをプレイできる「DL Play Box」
・✨Webで幅広いジャンルの作品を楽しめるWebアプリ「DLsite Play」

それら関連アプリともデザインの世界観や方向性をすり合わせます。
ユーザーさんがいつどのDLsiteサービスのアプリを使っても、なめらかで心地よい体験を楽しめるようなデザインテイストを目指していきました。

ちなみに、viviONデザインチームでは「アプリUX共通化プロジェクト」というプロジェクトがあります。

主にUI/UXデザイン・ブランディングデザインの観点からDLsiteサービス間で連携し、総合的にユーザー体験が高いサービスを作っていこう🤝という取り組みです。

関連アプリとの横連携が必要というと、やや大変に感じるかもしれません。しかし裏を返せば、担当プロダクトの垣根を超え、複数のデザイナーと話し合い方針をすり合わせながら一緒に１つの大きいサービスを作れる状態ともいえます。今思うととても心強い環境です！

2.いろんなメンバーの知見を集めてブラッシュアップする

viviONにはデザイナーが30人ほど在籍しており、ロゴデザインやブランディングデザインの経験豊富なデザイナーがいます。自分の担当領域に限らず、相談に快く応じてもらえる環境があります😭✨
成果物のクオリティアップはもちろん、自身の成長にもつながりました！

実際にもらったフィードバック①

実際にもらったフィードバック②

最終的にどんなデザインになった？

完成形のデザイン

最終的にこのようなイメージになりました🌷

・今っぽさでモバイルファーストを演出…スマートフォンで快適に使えそうなイメージを想起できるよう、既存のDLsiteの見え方にとらわれず少しモダンな今っぽい雰囲気を目指しました。
・多様性…ジェンダーや趣味嗜好に関わらず誰もが楽しめるようなアプリを目指し、あえて複数のカラーを用いました。
・利用シーンに応じて変化できる柔軟さ… ダークモードへの対応を視野に入れ、白黒反転に対応できるデザイン設計を行いました。

ライトモード/ダークモードのイメージ

さらに今回開発したのはモバイルアプリのため、アプリアイコンにかなりこだわって制作しました。アプリアイコン/ロゴデザインの詳しいデザインプロセスは、アートディレクターの山下さんが書いたこちらの記事をご覧ください。
また、上記デザインを元に社内のメンバーが素敵なLPやストア用画像を作ってくれました！🙌

リリース後の反応🎉

いざドキドキしながらリリースしてみると、ブランディングデザインに対して予想以上に前向きな声が多数寄せられました。
もちろん既存のユーザーさんからは「だいぶ雰囲気が変わった」「あまり同人誌が読めるアプリっぽくない」という声も出ました。一方で、むしろ「今っぽくなった新しいDLsiteのアプリ」に好感を抱いてくれるユーザーさんもいました。

振り返ってみると、何が大切だった？

初回リリースから時を経て振り返ってみると、大切だったのは意外と自分の中に「神経質になりすぎない瞬間を持つ」ことでした。☕️

制作初期、既存のブランドイメージの枠組みから外れたデザインを提案するのは正直とても怖かったです。

ですが実際は自分一人ではなく、社内のメンバーと話しあいながらブラッシュアップすることができたので、過度に恐れる必要はありませんでした。

・自分の作るものを自分で否定し続けると何も生み出せなくなる🥲
・仮にうまくいかなくても1回で凹まず、別の引き出しを使って案を出し続けることが大事
・そもそもブランディングには正解自体存在しない。なので過度に神経質にならなくてよい、中長期的にみんなで育てていくもの🌱

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　今回学んだこと

裏話ですが実際今のDLsite Libraryは、実は一度通らなかった提案のデザインが再評価され、最終的なデザインにエッセンスが採り入れられています🫶

今のクリエイティブの原案となったデザイン

採用されなかったアイデアも、後になって活きることがあります。

まとめ

実際にアプリを立ち上げてみると、サービスにおけるブランディングデザインは正解がないことを改めて実感します。
「ユーザーの多様性や時代の変化に対応しながら、サービスの核となる価値を高められるデザインを模索し続けるのが重要」だと学びました✍️

これからも、二次元コンテンツをより楽しんでいただけるようDLsite Libraryはアップデートを続けていきます！

viviONでは仲間を募集しています

株式会社viviONでは、秋葉原から世界へ二次元コンテンツを共に盛り上げていく仲間を募集しています。
「新サービスを立ち上げていきたい！」「新しいサービスのデザインに携わりたい！」などデザインチームの仕事やviviONの社風に興味をお持ちいただけましたら是非お気軽にご応募くださいませ。