【UI/UXデザイン】 音声SNSアプリ 『コエログ』 制作記録 #1
こんにちは、かむと申します🐿️
現在、BONOというコミュニティでUI/UXデザインの学び直しをしています！
今回は音声SNSの主要なUI画面を作るという課題の制作過程を3回に分けて発信します。こちらはその1回目です。
今回は、制作に入る前の「コンセプト設計」の過程をまとめました。
課題の目的
目的は、音声SNSにおける6つの主要画面を制作しながらSNSアプリの基本的なUIパターンを学ぶ というもので、UI基礎における最終課題という位置づけです。
成果物はポートフォリオ掲載する予定のため、課題上で言及されていないコンセプト設計や情報設計・UXも意識しながら取り組みました。
お題の要件
はじめに提示されたアプリの要件は以下です。
- 音声SNSであること
- 音声の要素を入れたSNSアプリ
- 音声とテキストを投稿できるTwitterのようなフィード画面
- サービス名：自由
STEP0-1. リサーチ
課題では要求されていませんが、UI制作の判断軸として「どんな音声SNSを作るか（コンセプト）」を考えます。そのために、まずは音声SNSのリサーチをしていきます。
1、主要な音声アプリを調べる
主要な音声SNSアプリを色々触っていくと、音声コンテンツの届け方には大きく2つの形式があることがわかりました。
配信型：配信する空間を作り、そこから発信・対話する形式
投稿型：音声コンテンツを投稿してユーザーに聞いてもらう形式
今回は「音声投稿ができること」が要件なので、投稿型の音声アプリを中心にリサーチしました。（ただ、配信と投稿どちらもできるアプリが多い印象です。）
コンテンツ内容を見ていくと、アプリごとに投稿には特色が見られました。
情報発信系（ナレッジ、体験談など）
視聴者に対して有益と思ってもらえるような情報を届けるコンテンツ。比較的長尺（10分以上）のコンテンツが多い。提供するコンテンツの質を高めるために発信側に制限を設けるアプリも。
例）Voicy、Spotify、stand.fm、radiotalk など
クリエイト系（朗読、シチュエーションボイス、歌ってみたなど）
自身の声や歌声の強みを活かす形のコンテンツ。固定のファンがメインの視聴者と思われる。
例）Spoon など
日常系（雑談、こえ日記など）
誰かと話したい、自身の気持ちを聞いてもらいたい、時間潰し…など発信の動機は様々。他に比べてより双方向のコミュニケーションが生まれやすいと思われる。
例）stand.fm、radiotalk、Spoon など
私が実際に5つのアプリを触って感じた印象と特色をまとめました👇
実際に色々触ることで音声SNSの世界が少しずつ見えてきました。
投稿されるコンテンツの尺は数分〜数十分のコンテンツが多く、「意外と長めなんだな」という印象を持ちました。
また、発信されるコンテンツは結構作り込みされていたりブランディングしていたりと、気軽に投稿できるというよりはある程度労力をかけて準備するハードルの高さを感じました。
これら従来の音声SNSアプリを競合と捉えて差別化できるポイントを考えると、「短尺のコンテンツメイン」「気軽に投稿できる」などのキーワードが見えてきました。コンセプト設計時の参考として心に留めておきます。
2、ブームののちに失速した2つの音声SNSアプリ
音声SNSについて調べる中で、ClubHouseやAirchatなど、かつて流行った音声SNSアプリが今では衰退し下火になっている、という記事を見かけました。
音声SNSサービスを作る上での留意点が見えてきそうなので、これらアプリの流行や衰退の要因を調べました。
1、Clubhouse
Clubhouseはローンチ直後（2020年〜2021年初頭）に、評価額40億ドル、アクティブユーザー数1,000万人を突破するほどの世界的ブームを巻き起こしました。
しかし、2021年後半、コロナ禍の収束を境に急速に失速し、2023年には従業員の半数以上を解雇、かつての「誰でも出入りできる雑談スペース」としてのアイデンティティを放棄せざるを得なくなりました。
2、AirChat
AirChatも初期（特に2024年4月の本格ローンチ時）に大きな注目を浴び、急激に流行しましたが、その独自性が逆に一般層の参入障壁となり、普及に失敗し、失速しました。
ClubHouseやAirChatの事例から、以下の気づきがありました。
特にAirChatは投稿型の発信が主体のアプリなので参考になりそうです。
音声SNSは公の場では利用しにくい
発信者にとってのインセンティブが必要（金銭、体験など）
大衆ユーザーも発信して楽しめる設計（コメントやりアクション含む）
メジャーなプラットフォームで代替されない価値設計
短尺の音声をテキスト情報にするとテキストが勝ってしまう（音声を聞かれない）
ハンズフリーの自動スクロール再生は、コンテンツが短尺なほどユーザーが次の投稿の再生ボタンを押す手間が省けて良さそう
STEP0-2. コンセプト設計
ここまでのリサーチもふまえ、コンセプトを考えていきます。
従来の音声SNSアプリは発信者がコンテンツをある程度作りこみ投稿するものが多く、音声も5分〜数十分の長いものが多い印象ですが、逆に「誰でも身構えずに投稿できる音声SNS」はあまり無いように感じました。
リサーチを経た段階ではこんな感じのアプリが良さそうに思っています↓
- フィード投稿に音声を載せられる。コンテンツの尺は長くても数分
- 投稿自体のカットなどの編集はできないイメージ。投稿の気軽さ大事
- ライブ配信機能はなし
- 投稿には審査はなく、誰でも気軽に投稿ができる
- 匿名も許容しつつ、xやインスタのように自身のブランディングのために自身の身元を明かして使うケースも想定したい
- 音声は聞かないと詳細がわからないし内容の把握に時間もかかるので、投稿を聞くのは発信者の友達、に関心がある人、ファン、などになりそう
- AIが当たり前になり、テキストも画像も簡単に整えられる時代だからこそ、今の気持ちや温度感をそのままの肉声で届けあおう、みたいな世界観にしたい
ぼんやりと方角は見えてきたものの、まだまだ解像度が低いので「どんな人にどんな価値を届けられるか」という視点でAIと壁打ちをしながらコンセプトを詰めていきました。
最終的に、こんな感じにまとめました！👇
気づきや感動を“声”でのこそう 「コエログ」
投稿・視聴のハードルを下げるために音声の尺は2-3分までとし、誰でも発信できる内容として、日常の気づきや感動を声で残そう、というコンセプトでまとめました。
「日記」の体験をベースにした音声SNS
このコンセプトは “声で日記をつける” という体験を軸に考えています。
日記を書きたくてもその時間を取れない人にとって喋って記録するのは文字を書くより手軽で、さらに自分の感情や気持ちを当時の臨場感と共に残すことができます。
日記は基本的に他人に見せるものではないですが、たとえばすごく良い映画を観た、とかちょっとした有益情報など、「この感動を分かち合いたい！」「誰かに伝えたい」といった内容もあると思います。
なので、自分だけに留めたい内容は非公開／他の人にも聞いてもらいたい内容は公開 と分けて投稿すれば、日記でありつつ自分の体験や感情に共感してくれる人と繋がれるプラットフォームになります。
日記をつけることが動機になれば記録を続けること自体がインセンティブ（動機）になるので、発信者が離脱しにくいのではないかと思います。
また、動機が比較的内向きなので外へ向けた発信が目的の他のSNSとは差別化されます。
アプリの名称は「コエログ」と名付けました。
“日記” という言葉を入れればコンセプトは伝わりやすいですが、交流できるイメージが持てないため採用しませんでした。
ひと目見て（あるいは聞いて）どんなサービスかある程度イメージがつきやすい名称を意識して決定しました。
また、ロゴも作成しました。
コロコロとした見た目で親しみやすい印象を意識し、アプリでの体験をアイコンで表現しました。
ロゴはアプリUI全体を作った後に、全体の雰囲気を見ながら制作しました。
STEP0-3. 配色を考える
コンセプトはまとまったので、ある程度配色も考えます🎨
まずはコンセプトをもとに、このアプリに抱いてほしい印象を考えます。アプリの人格のようなイメージです。
私は、こんな感じで考えました。
安心感 落ち着き 包容力 前向き 成長
リラックス 着飾らない かんたん
上記を色で表すなら、落ち着いた緑あたりがイメージに合いそうです。世の中のデザインから印象に合う参考にできそうな配色を探しにいきます🏃♀️➡️
参考にできそうな配色をピックアップし、落ち着きと温かみを感じられる、青みが強めの緑をメインカラーとし、配色を定めていきました。
（制作しながら調整し、最終的には以下の配色となりました👇）
コンセプトや配色の方向性が定まったので、いよいUI制作に入ります！
次回へ続きます🚌
ここまでお読みいただきありがとうございました！
