イケてるブログサービスの管理画面を比較した話
はじめまして。 GoodpatchでUIデザイナーをしている氏原です。
Goodpatch期待のデザイナーすみれさん主催の UI Design Advent Calender 2015 7日目の記事として書いています！
デザイナーもブログを書くのがステータスになっていますね。
今まで めんどくさいため 自分が考えていることを公開するのを躊躇していたのですが、良いきっかけなのでマイペースに続けてみようと思います。
さて、今日はこのブログを開設するに当たって日本で有名な以下のブログサービスのダッシュボードと投稿画面を比較してみました。
・ tumbler
・ はてなブログ
・ note
・ Ameba Ownd
UIになるべく触れつつ書いてみましたが、脱線気味なのはご容赦ください。
言わずと知れた有名サービスですね。
機能とビジュアルがとても洗練されてます。
とても好印象なtumblerですが、英語のテンプレートしかなく日本語のブログには調整に時間がかかりそうな印象だったので今回は見送ることに。
タイムラインのトップに並んでいる7つのボタンいずれかをクリックしてすぐに記事が書けますが、右上にも投稿アイコンがあるのが気になります。
初心者が投稿したい時は右上のボタンを押すと思うのですが、クリック後はタイムラインと同じボタンが出てくるので、タイムライン上のボタンの意味がそこでわかるという導線になっていそうです。
投稿画面では、
[ 挿入できるメディア ] 画像、動画、 gif（どうして別れてるんでしょうか）
[ テキスト装飾 ] ボールド、取り消し線、ヘッダー（一種類のみ）、取り消し線、リスト、インデント
が設定できます。
今では当たり前になっていますが、テキストをハイライトすると文字の装飾が選択できるなど、必要なタイミングで必要な情報を表示させていますね。
はてなブログ
Goodpatchメンバーも使用率が多いサービスです。
他のサービスと比べてもかなり高機能なんですが、一つの画面に全ての情報を出してしまっている感じがあり、今回は別のサービスにすることに。
ダッシュボード
ただ、アクセス解析は 流入数だけでなくアクセス元まで見れたり、カスタム URL やアイキャッチ用の画像も別に指定できるので、かなり多機能になっているので、詳細の設定まで設定したい方はオススメです！
note
サービスのコンセプトがとても好きで、noteにするかOwndにするか本当に迷いました。
ただ今回のブログの目的は考えていることを言語化するということなのでコンセプトとは少し違うのかなと。 noteでは作った画像を載せたり別の使い方をしてみたいと思っています。
投稿UIは、tumblerをもっとシンプルにした感じでしょうか。
noteの中で一番大好きなのが、このエディタ。
ビジュアルのカスタマイズは一切できませんが、その代わりに余計な情報が一切ありません。一目見て感動しました笑
[ テキスト装飾 ] ヘッダー（h3のみ）、ボールド、 テキストの位置、引用、リンク
[ 挿入可能なメディア ] 画像、他のnote、 twitter、動画
話は逸れますが、発行されたURLの飛び先を入力すると、コンテンツのリストではなく、アカウント情報優先に配置されていたのが印象的でした。
コンテンツから流入されるのを想定した設計になっていることと、クリエイターの個を推しているのがコンセプトに合っていると思います。
Ameba Ownd
アメブロをアメーバ自身が作り直したサービス。
印象は、はてぶとnoteの間ぐらい。多機能だけどそれを感じさせない管理画面の設計が気になったので使ってみることにしました。
また、テンプレートが日本語仕様なので、少しのカスタマイズでいい感じになります。
ダッシュボードには、アクセス数とフォロワーがユーザーのモチベーションを上げる要素なためか、目立つ位置に配置されています。
投稿画面は
[ テキスト装飾 ] ボールド、イタリック、下線、打ち消し線、パタグラフ、ヘッダー（1〜4まで）リンク、テキスト位置
[ 挿入可能メディア ] 画像、動画、リンク、Amazonと楽天のリンク（アフィリエイト用？）
が選択できます。
たとえば、画像をドロップした時に、インラインでローディングが出たり、細かい部分のインタラクションにも力が入っています。
次回はそんなインタラクションの部分を書けたらいいです。
（ただ、インラインで画像をドロップすると保存時にエラーが出るのでなんとかしてください！）
今回は比較した4つのサービスの中から、ダッシュボードと投稿画面をメインに紹介してみましたがいかがでしたか？
仕事ではデザインを組み立てることが多いのですが、こんな感じでデザインの違いを見るのもデザインの勉強になると思っています。
言語化できるものって既に体験していることが多いので、言語化が難しい違和感がある時は、新しい疑問とか視点が生まれた時。それをちゃんと言葉にして理解するというのが成長につながるような気がします。
明日、Advent Calenderの担当はusagimarumaさんです。
「あるいはハンバーガーアイコンをディスります。」とのことで、期待大です！
0コメント