WEB・IT業界で働く人々の人生を少し豊かにするメディア

CAREER HACK

ローンチから4年、『note』UIの変遷

2018-04-26

ローンチから4年、『note』UIの変遷

自由にコンテンツ作成、配信できるプラットフォーム「note」。2014年のリリースから、4年。UI変更の変遷を紹介する。

※ 2018年3月に開催された「UI Crunch #12「伝える」を加速させる。書く、読むUI」のレポート記事としてお届けします。

4年の間に移り変わっていった「note」のUI

今回、『note』のUI変遷について紹介してくれた沢登達也さん。運営元であるピースオブケイクで働くデザイナーだ。これまで『note』は大きく2年というスパンでのUI変更が行われてきたという。過去のUIを参照しながら、当時のデザイナーの意図を紐解く。

2014年
リリース:書くと読むをシームレスに行うUI

書くと読むをシームレスに行うUI

検索やカテゴリー機能は無く、投稿・表示はすべてタイムライン上から行う設計だった。(実は当時はスマホからも一部機能は投稿可能でした)

タイムライン上から行う設定だった

「タイムラインと記事の行き来が基本的な動線なので『戻るボタン』が存在していること、紙媒体の読み心地を意識して明朝体が使われていることが印象的ですね」

リリース後は順調な滑り出しを見せ、わずか1か月ほどで100万UU(ユニークユーザー)を達成した。

2016年
機能拡充:新たな記事に出会うUI

つづいて、2016年当時のUIについて。2014年当時と比較し、機能の数が増加している。

機能拡充

タイムラインやおすすめ、カテゴリなどタブの数が増加。これは新しい記事に出会うことを意識したUIといえる。

新しい記事に出会うことを意識したUI

『戻るボタン』もドロワーメニューに変更。他の機能にいつでもどこでも、アクセスできるようにするためだ。

発見・継続・コンテンツ…3つの軸で改善

そして、リリースから4年が経過した現在。ピースオブケイクCXOの深津貴之さんが中心となり、日々改善を図っている。

軸となっているのが「発見性」「継続性」「コンテンツパワー」の3つだ。

「まず、記事接点の改善で発見性の向上を狙っています。例えば、タイムラインの改善、フォローブースター、シェアブースターの再現など。次に“継続性”について、バグなど小さな不満を解消していきました。“コンテンツパワー”については、記事の内容や記事数の向上を目的とした施策を考え、実行しています」

タイムラインのカイゼン

そして最後に語られたのが『note』の未来について。

リリースから4年が経過し、「そもそもnoteとは何か?」を再度、定義し直しているという。あらためて「サービスのあるべき姿」をチームで共有するためだとする。

例えば、ビジョンやミッション、タグラインについて整理するワークショップを開催。「こんな『note』は嫌だ」「『note』の性格、人格はこうだ」「『note』を擬人化したら、どういう人格か」など話し合い、メンバー全員の『note』に対する認識を揃えていった。

noteを探すワークショップ

もうひとつ、今後の成長も見越し、成長に耐えうる「デザインルール制定」に着手している。

「現在、『note』のデザインチームは4名います。ほとんどのメンバーが入社から2〜3か月と日が浅い。正直、デザインルールもありませんでした(笑)サービスの立ち上げ期は、デザインルールを制定する必要はあまりないと思うのですが、成長を考えると今つくった方がいい。使っているツールとしては『frontify』で、デザインガイドやコーディングガイドライン、アセットの管理などを始めています。ガイドラインは品質を維持に加え、デザインをデザイナーだけのものにしない目的もあります」

小さく初めるガイドライン

ユーザーとの共創で開発を進める、これも『note』が目指す姿だ。「noteカイゼン目安箱」をつくり、ユーザーからのフィードバックを常に募集する。

note座談会、改善報告、snsでのフィードバック

「クリエイターと一緒にサービスを育てていく。note自体をオープンにしていければと思います」

沢登達也さん/『note』を運営するピースオブケイクに2018年1月入社。現在、デザイナーとしてUI改善を担う。



CAREER HACK をフォロー

タグ一覧