Archive for the ‘ フォーム ’ Category

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


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

huff

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

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

» Sign up on Huffduffer

「パスワードを忘れたら?」をフォーム内に配置


ちょっと見たことがなかったインターフェースなのでメモ。

ログインフォームのテキストボックス中にアイコンを配置するのはよく見ますが、「パスワードを忘れたときに?」も「?」として中にいれちゃってますね。

マウスオーバーすると「Forgot?」が出てきます。

login

↑ GIFアニメにしてみた。

コンパクトなフォームを作りたいときにはいいかも・・かな。あまり邪魔じゃないですし。

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

» PhotoPeach: Social Slideshow Sharing

会員登録からログインまでが瞬速のTimelopeのインターフェース


ブラウザ履歴を共有できるTimelopeですが、会員登録からログインまでがちょっぱやです。なんと登録時のユーザー名をいれるとそれがすぐに右上のログインボックスに反映されます。しかもパスワードまで!

time_login.gif

↑ 登録しながらログインフォームを埋めている感じ。

やりすぎなような気がしないでもないですがw、会員登録したらすぐに試したいもの。ありといえばありのインターフェースですね。

Windowsっぽいユーザーログイン画面のインターフェース


ブラウザ上でタイムシートを管理できるClockspotですが、ユーザーのログイン画面がWindowsっぽく作られていてユニークです。

clo_1.gif

↑ ユーザーの一覧。

clo_2.gif

↑ 選択するとぐぐっとせりあがって・・・。

clo_3.gif

↑ ここでログイン。

ユーザー数増えたらどうすんだろ、とか疑問がないわけではないですが、ギミックとしてはおもしろいですね。ユーザー数が限定された状況で使ったり、その他のシーンでインターフェースの候補にしてもいいですね。

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

» Clockspot – Clockspot Demo Login Page

携帯番号をいれればいいのだな、とすぐわかるインターフェース


よく検索キーワードを入れるフォームに虫眼鏡マークがついていたりしますが、携帯番号の場合は次のようなインターフェースがわかりやすいですね。

cell_icon.gif

↑ これなら迷いません。

いかに迷わずに入力させるか、ちょっとした工夫を凝らしたいところですね。

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

» Umbrella Today?

穴埋めさせて入力させやくするフォームのインターフェース


えらい細かいことですが、FacebookのTwitter的機能のインターフェースが素敵ですね。入力しようとすると穴埋めちっくな文書が現れるので、何を書くべきか迷うことがありません。

face_1.gif

↑ 今何しているの?と聞かれてクリックすると・・・。

face_2.gif

↑ (自分の名前)は・・・と答えを途中まで書いてくれます。

実に細かいことですが、こうすることで入力の敷居を下げているのかもしれませんね。また自分の名前がフォームに出てくるというのも当事者意識が高まって良いかと。

こういう細かい工夫は大事にしたいところですね。

» Facebook | Home