UI/UXから見るブログアプリ
ブログとかを投稿する際にどのサービスを使うか、っていうのは悩みますよね。
ということで、よく使われているはてなブログ・Medium・noteの3つを比較していきます。(遷移図はあまりにも見えなかったので今回は載せていません、、、)
<はてなブログ>
・このアプリでは自分の記事に関することをメインで使うようになっていますね。
記事を検索して読みたい人は、「はてなブックマーク」の方も一緒にダウンロードしてくれ、って感じですね。
自分で記事を放つことはあっても他の人の記事を読むことはないよ、って人には余計な機能がなくて嬉しいかも。
・フォントは基本RobotoとHelveticaですが、HTML編集機能があるので好きなフォントに設定可。
タイトルは21px、本文は14pxで7の倍数で設計されていますね。
使われている色は主に、本文などに使われている濃いグレー( #38393D )、サブタイトルなどに使われている薄いグレー( #9DA5A8 )、Hatena Blogに使われている赤色( #E36B6F )の3色。
・設計は3の倍数を基準にしているのかな。
・主な機能は「記事一覧」「新規作成」「アクセス解析」「下書き・お題」「コメント」の5つ。
・記事一覧のところでシェアしたい記事を長押しすると、共有を促してくれます。
・新規作成のところにいろんな機能(下に貼ってるやつ)があるけど、最初見つけられなかった(最近見つけた)
もっと自己主張してほしいな、、、
・この3つのブログアプリの中では、唯一プレビュー機能有り(私はめちゃ使ってます)。
検索機能なし(できなくもないのですが、新着ブログの「読者になる」ことができるってだけですね)。
<Medium> 今年ロゴとデザインが刷新されたことで話題に!
・Mediumはストーリー性が強い(ことを売りにしてるらしいです)
「誰もがストーリーを持っている」Medium Japan代表がサービスの思想を語る - ログミー (強みがわからなかったので調べました、、、)
・投稿する記事内の文字の大きさを変更する部分がh1とかの表示じゃなくて、万人にわかりやすいようになっているな、と。(一番左)
ただ、左から4番目は一瞬何かわからなかった、、、
・ 日本語フォントはアプリ上だと崩れがちです(特にタイトル)。
使用されている色は主にタイトルに黒色( #000000 )、本文にグレー( #858585 )、clapのアクションなどにグリーン( #13AD84 )、の3色。サイズは12px、14px、20pxの2の倍数。
設計は4の倍数でされています。
・主な機能は「Home」「Bookmarks」「Create」「Activity」「You」の5つ。
・「Home」にはオススメ記事などが並んでいます。ここからのみ検索できるんですが、何かワードを入れてから、それに関連するstories、people、publications、Tagsに飛べる感じですね。
・「Bookmarks」には自分がブックマークした記事が。ちなみにこのページでupgradeを促しています。
$5/month か $50/year払ってupgradeすると、medium memberになれます。これをすると、下のように緑のマークがつきます。memberのみが読める記事とかもあるようです。
・「Create」で新規作成。ここで作成できるのは、storyとseries。
seriesってなに、、、って方は、こちらを。簡単に言うと、本みたいな感じです。
Mediumの新機能「Series(シリーズ)」は長文を読みやすくする文章の紙芝居 | Lifehacking.jp
・「You」ではプロフィール、自分の作ったStories・Series、アクセス解析を見ることができ、自分の興味あることをカスタマイズしたり、諸々の設定をしたりすることができます。
プロフィールの部分。
Profileのところに表示されているのはLatestとClaps(3つまで表示。残りはSee moreで)で、隣の赤丸している所と内容が被っているので必要なのかな?って感じですね、、、
私のはこの3つしか表示されていませんが、ちゃんと使っている人のはプラスでHighlightsとResponsesもありました。
ちなみにclapはひとつの投稿に対して一拍手ではなく何回でもできます(pcだと押しっ放しでひたすらclapできます)
SettingでSNS連携できるのですが、これはアプリでは表示されないんですね。webでのみ。
・3つのアプリの中で唯一IDを変更できます。
<note> 深津さんがピースオブケイクのCXOに就任されたことで話題になりましたね〜
・マガジンとしてひとまとめにできるので、シリーズ化したい記事には最適ですね。
・アカウントのところにある「ライブラリ」機能に入ったら、「スキをつけたノート」になっていて、別物かと思ってしまいました、、。
・あと何故かフォントをBoldにできなくて、暫く悩みました(結局、諦めた)
・検索のところに「ハッシュタグ検索」があるくらいなので、記事書くときにハッシュタグ入れるのを促すワンアクションあると嬉しいなあ。
・フォントのお話とかは結構Twitterで見るので要らないかな?と思ったのですが、一応。MSゴシックですね。私もデジタルではサンセリフ体のほうが好きです。まぁ、noteのヘビーユーザーとかではないので、なんとも言えないですが、、、
読みやすさのデザイン備忘録|深津 貴之 (fladdict)|note
・主な機能は「ホーム」「さがす」「つくる」「おしらせ」「アカウント」の5つ。
・「ホーム」はタイムライン・マガジン・おすすめの3つから選択可。
・「さがす」では、ユーザーとハッシュタグから検索ができます。あらかじめ、おすすめユーザーと人気のハッシュタグが置かれているので、特に目的がなかったらそこから飛ぶのもいいですね。切り替えがめちゃゆっくりですが、、、
・「つくる」で新規作成できるのは、5種類。トーク(Twitterみたいなもの)、イメージ(tumblrに近しい感じ)、テキスト(ブログ)、サウンド(これは、、自分の歌声とかを載せるのかな?)、ムービー(YoutubeとVimeoから取ったURLを貼り付ける)。
なんか、長くなったなあ、、、と思いながら最後に比較した表を載せます。
SNS連携が3つともTwitterとFacebookだけで、Instagramとかは無いんだな、、って思いました。
おしまい。