妄想UI/UX

勉強がてら、自分なりにUI/UX/サービスを考察したり妄想します。

第1回-はてなブックマーク(iPhone app)

勉強がてら、サービスのUI/UXを考察したり妄想するブログ。
第一回は「はてなブックマーク」(以下はてブ)のiPhone app。

はてブというサービスについて

公式の説明を引用。

はてなブックマークはオンラインにブックマークを無料で保存できるソーシャルブックマークサービスです。

単なるブックマークといった機能以外にも、

  • 多くの人が最近ブックマークしている=多くの人が今注目している情報が分かる「人気エントリー」という情報収集・キュレーションサービス的な面
  • ブックマークしたページについて他人の反応が見れる・評価できるソーシャル的な面
  • 記事を発信する人にとっては拡散させるためのバズツール

このような特徴があって、むしろこっちの方がメインになってる印象。

Web、アプリ(iPhone,Androide)で利用可能。

iPhoneアプリ立ち上げ後の画面

f:id:mousouiux:20160624171742p:plain

アプリを立ち上げると、スプラッシュ画像が表示された後に人気エントリ一覧の画面が表示される。はてブを使うユーザーの目的として、「情報収集」の割合が高いことが推察される。(自分もそう)

 

対比として、海外の古参ブックマークサービス「delicious」は自分のブックマーク一覧が一番に表示される(というか人気エントリーにあたる機能がない?)。自分も以前はdeliciousを使っていたが、はてブ人気エントリーが魅力的で移行した。

まだ生きていたDelicious, デザインを一新 | TechCrunch Japan

とか読むと切ない…。情報収集とストックが1つのサービスで出来るのがはてブの強みだと思われる。

情報収集⇆自分のブックマーク一覧の切り替え

情報収集のための画面と、自分のブックマーク一覧画面の切り替えは、右下に表示されているボタンが担っている。

クリックすると、各画面へ遷移するためのメニューが展開。遷移先の画面に応じて、ボタンが適時必要な機能に切り替わる。

f:id:mousouiux:20160625005018p:plain

情報収集の画面においては、人気エントリー > 新着エントリー > 特集 > 日めくり、とスワイプでカテゴリの移動が可能。日めくりからさらにスワイプしようとすると、メニューが「他のカテゴリを見る」に切り替わる。ユーザーの意図を読み取っていていい感じ。

f:id:mousouiux:20160625023612p:plain

 

ページについての他ユーザーの反応をチェック

気になった記事をクリックすると、インブラウザでページが表示される。

そこから自分のブックマークへの追加と、記事についての他ユーザーの反応が確認可能。記事ページの前に他ユーザーのコメント一覧が強制表示されるNEWS PICKより自分はこちらの方が好み。

f:id:mousouiux:20160625024123p:plain

ブックマークの追加

人気エントリーで気になった記事は、上記の通りはてブApp内で追加が可能。
safariや他のアプリでブラウジングしている時にブックマークしたい場合も、iOS8から可能になった「アプリ間連携機能」でブックマーク可。

f:id:mousouiux:20160625024824p:plain

 

いいところ

はてブでやりたいことはストレスなく出来てるので、アプリの使い心地はとても良い。特に基本的な動作は、片手(右手左手問わず)で無理なく操作できるように設計されているのがありがたい。

改善の余地あり?

インブラウザ内で2ページ目、3ページ目…と読み進めていって、前のページに戻りたい時、safariの癖でついスワイプしてしまうのだけど、その時前のページに戻るのではなくインブラウザが閉じて一覧ページまで戻ってしまう。

インブラウザ下部に < とか > という戻る進むボタンがあるからそれを使えという話なんだろうけど、結構同じミスを繰り返してしまう。

safariを日常的に使っているユーザことを考慮すると、2ページ目、3ページ目でスワイプした場合は前のページに戻る、という動作の方が自然なんじゃないかと思う。

(2ページ目から一気に一覧ページに戻りたい時は、左上の < ボタンを使用)

 

その他

ライトユーザー層の取り込み

はてなというサービスとしての話。はてブのメインユーザー層は、「テクノロジー」「アニメとゲーム」といったカテゴリ分けなどからもインターネットにある程度慣れ親しんでいたり、ちょっとコアな人の印象。そことは少し違うエリアにいるライトユーザーを取り込むため、B!KUMAという裏側は同じだけど見せる情報やデザインを女性向けにカスタマイズしたサービスが生まれたんだろうと推測される。MERY、メルカリ、インスタ等々このユーザー層の取り込みはサービスを大きくするためには必要。このユーザー層の興味関心に関する情報を集められれば、新しいサービスを作るときのヒントにもなりそう。

こんなことできるんじゃない?(妄想)

これまたサービスの話。PCのchromeはてブのアドオンを追加するとgoogleの検索結果にはてブされた数が表示される。(↓この14253 users というトコロ)

f:id:mousouiux:20160627193928p:plain

「沢山の人がブックマークしてるから、いいページなのかな?」と思ったりすることがたまにある。コメントのポジティブネガティブをAIなんかで解析して、それも指標の一つとして追加したりするのも面白いんじゃないかなと思ったり。

あと、ブックマークされやすい記事の特徴を解析して、はてなブログのコンサルサービスなんかもできたりしてね。

 

最後はUI/UXから少し離れた話になってしまったけど以上。