Parallel
Date: 2024 - parallel.chat

UI↓

UI

ParallelはZ世代をターゲットにした、友達とのチャット・音声通話・ゲームが融合した“オンラインの溜まり場”を提供するSNSです。アプリ全体のUXは「放課後の教室のような、自然な会話が続いていく空気感」を目指して設計しています。
音声通話が中心となる画面では、文字情報よりも「誰が話しているのか」がひと目で分かることを重視し、発話中のユーザーのアイコンは大きく表示されるようにしています。これにより、あたかも直接会話しているかのような一体感ある体験を生み出します。
また、通話画面にはマネタイズのための広告枠を設置しました。ただ広告を表示するのではなく、会話の一部として自然に混ざる体験を目指し、動画のサムネイルを通話画面の背景に敷き、ブラーと透過をかけることで空間に馴染むようデザインしています。
広告として目立たせるのではなく、ユーザー同士の会話のきっかけになるコンテンツとして機能することを意識しました。

コンポーネント

アプリ全体の一貫性と拡張性を高めるために、ParallelのUIコンポーネントを全面的に再設計しました。Atomic Designの考え方に基づいて構造を見直し、コンポーネントを細分化・整理することで、画面ごとの状態や用途にあわせた柔軟な設計が可能になっています。
特に、構造が複雑になりやすいヘッダーやフッター、リストについては、表示パターンが増えても対応しやすいよう、バリエーションを明確に分解し、再利用性の高い設計にしています。
また、カラーシステムはvariablesで管理し、ライトモードとダークモードを自動で切り替えられるように構築。開発とデザインの連携がスムーズになるよう、運用性にも配慮した設計を行いました。