UI↓
Spotlightは、ビットコインのライトニングネットワークを使った、CtoC型のデジタルコンテンツ配信プラットフォームです。
ビットコインに関する情報は、日々大量に流れては消えていきます。TwitterやDiscord、Telegramのような場が中心なのも、それだけ“情報の消費期限”が短いからだと思います。
だからこそSpotlightでは、「少しの情報でも、文章として残していける場所」を目指しました。
軽く投稿できて、でもきちんと蓄積される。そんなUIにしたいと思い、デザインしています。
画面構成はTwitterに近く、サイドカラム付きの3カラム設計です。ただし、Spotlightには「誰にでもスポットライトが当たるように」というコンセプトがあります。
その考えを反映して、コンテンツ一覧はカード型に統一。人気や注目度に関係なく、どの投稿も同じように見えるようにしています。
サムネイルがある記事・ない記事で見え方に差が出ないように、サムネイルがある記事は「画像+タイトル」だけ、サムネイルがない記事は「タイトル+本文」という表示ルールを設けています。
記事ページは、ほとんどがスマートフォンから読まれるため、サイドカラムは排除し、読みやすさを優先。
一方、PCで読む場合は、サイドカラムがあることでシェアや関連コンテンツへの導線が生まれるようにしています。
投稿ページは逆にPCからの利用が多く、書くことに集中できるよう、装飾や余分な要素は入れていません。
Spotlightには「いいね」ボタンがありません。でも、その代わりに、コミュニティが自然と動き出すような仕組みをいくつか取り入れています。
たとえば、Slackのように絵文字でリアクションできる機能。
ビットコイン界隈にはエンジニアが多く、絵文字のリアクションと相性がいいと思ったので取り入れました。コメントだけのやりとりよりも、もう少し柔らかく反応できる場になっています。
また、ビットコインには“投げ銭”という文化があります。
Spotlightではその投げ銭をちょっと楽しくするために、金額に応じてピザのイラストが変化する演出を入れました。
これは、ビットコインとピザの関係(Bitcoin Pizza Day)を知っている人なら、ちょっとクスッとしながら楽しめる仕掛けです。
記事を読んでいて疲れにくいよう、ダークモードを搭載しています。背景と文字のコントラスト比は約16:1。ブルーなどの色は、ディスプレイによって印象のブレが大きくなりやすいため、色選びは慎重に。ブラックをベースに設計しました。
Spotlightでは、「誰でも発信できて、誰にでも光が当たる場」を目指し、全体の構造から細部のインタラクションまで一貫して設計しました。
カルチャーと仕組みのちょうどいい接点を見つけながら、「場」のデザインをするような感覚でつくっています。
Logo↓
ロゴは、正三角形をベースにしたスポットライトのモチーフです。
上向き、下向き、左向き、右向きなどがありますが、Spotlightでは右向き(▶)を選びました。
「再生」「進む」「未来」といった前向きな意味が込められています。
斜めから差し込む光は、固定式のライトではなく、首を振っていろんな人に光を当てられるタイプのライトを表現しています。
色は安心感のあるブルーをベースに、サービスとしての先進性を少しだけ感じさせるように、先端に黄色から水色へのグラデーションを加えました。
ロゴタイプも、文字だけで成立するように、ほんの少しクセのある形にしています。