Home

SIMPLE*SIMPLE ~ Web職人のための小粋なネタ帳

メインの記事以外が最初は薄暗くなっているインターフェース

これ、ちょっといいかもですね。FormFiftyFiveではメインの記事以外がデフォルトでは薄暗くなっています。マウスオーバーするとはっきり見える、という仕組みですね。

f1

↑ 普通はこう。

f2

↑ 右側のサブのコンテンツにマウスオーバーするとちゃんと見えます。

メインのコンテンツに集中してもらいたいときに良いかもですね。

» FormFiftyFive – Design inspiration from around the world » Blog Archive » Campbell Hay

いまどきのWebサービスのフッター・・・

いまどきのWebサービスのフッターにはこの2つの要素が必要かもですね、と思ったり。

footer

↑ まぁ、他にも必要なものがあるだろうけど。

» zinepal.com | Now you are the editor.

コミック風のわかりやすいチュートリアル

チュートリアルでユーザー体験を表現するにはコミック調がいいかもですね、とAkohaを見て思いました。

tutorial

↑ こんな感じ。

実際のチュートリアルはこんな感じ。

» » Learn more about Akoha ~ Akoha – Come Play it Forward

そういえばこういうのを作る秀逸なソフトではComicLifeがあるのですが、Mac版だけじゃなくてWindows版も出たようですね。ちょっと試してみようかな。

» plasq.com – Downloads

前のバージョンから何が変わったら一目でわかる機能比較表

YAMAHAのルーターを見ていたのですが、機能比較表がわかりやすいです。

spec

↑ こんな感じで変わった部分がハイライトされています。

ものによるでしょうが、昔の機種と比較したい場合(中古を買うか、新品を買うかとかなど)、買い換えを検討している場合に便利なインターフェースですよね。

» ギガアクセス時代のインターネットVPN、携帯電話網対応機能を強化 ヤマハ ギガアクセスVPNルーター『RTX1200』

「現在セキュアな通信をしています」と明示的に表示するインターフェース

【追記】
たくさんのブクマコメントありがとうございました。たしかに悪用される可能性の方が高いかもしれませんね・・・。こちらもあわせてご覧ください。

» はてなブックマーク – 「現在セキュアな通信をしています」と明示的に表示するインターフェース

SSL通信をしているかどうかはわかりにくいですよね。お買い物をしているときにURL(https)やブラウザの鍵マークを確認する人も多いのでは。

しかし、詳しくない人にはよくわからないかもしれないので次のようなインターフェースも悪くないかもです。

secure

↑ 画面上部に「セキュアなページです」と表示。

悪意のある使い方は論外ですが、こうしたちょっとした工夫でお買い物がすすむ、ということもあるかもしれないですね。

Akohaのショッピングサイトで実装されていましたよ。

» Welcome ~ Akoha Store

「今日登録できるのはあと○人だけ」と表示して会員登録を促すインターフェース

会員登録を促すのに心理学でいうところの限定効果を活用している例を見つけました。

signup

↑ これ。

今日会員登録できるのはあとこれだけですよー、と言われると登録したくなっちゃうかもですよね(あと2人!とかだったら特に)。試してみるのも悪くない・・・かも。

実際に動作している様子は以下からどうぞ。

» patio: Sign Up

ドラッグ&ドロップできるショッピングカート

これ、きれいでいいですね。アイコン販売サイトですが、ドラッグ&ドロップでショッピングカードにぽんぽん放り込んでいくことができます。

drag

↑ こんな感じ。

左側のショッピングカートは下のほうにスクロールしていってもちゃんとついてきてくれますね。わかりやすい。

実際に動作している様子は以下からどうぞ。

» IconDock – The Art of Stock Icons

穴埋め式のユーザー登録画面

ちょっと素敵。穴埋めの試験に答えるようにユーザー登録ができます。

huff

↑ 「ユーザー名はこれで、パスワードはこれ、ちなみに私の名前は・・」なんて具合です。

実際に動作している様子は以下からどうぞ。

» Sign up on Huffduffer

ちょっと笑えるエラーメッセージ

Jottitでパスワードを間違えるとちょっと笑えるメッセージが。

fat_fingers

↑ 「指、太すぎるんじゃね?」と言われますw。

指が太ければ確かにいろいろ間違えそうですね。ちょっとくすりと笑えるこうしたメッセージはいいですね。

» Jottit

ちゃんとメールを送りました、というエラーページ

Jottitのサイトのエラーページが親切です。

jottit_error

↑ 「ちゃんとこちらにメールが来るようにしました!」とのメッセージ。

エラーページは表示しておしまい、というものが多いですよね。「ちゃんとこちらでエラーを直すために努力しています!」という姿勢を見せるためにもこうしたメッセージは親切かもですね。

» Jottit

Home

最近の記事
カテゴリー一覧
過去記事一覧

Return to page top