「Skeuocard」はクレジットカード入力フォームを便利するためのテクノロジー。
従来のカード情報入力フォームでは、最初から、カード番号、有効期限、名前などの入力欄が表示されていましたが、Skeuocardでは、まずカード番号を入力し、見た目が実物のカード風に変わった後、残りの情報を入力するという流れになります。
サイトトップにカード情報を入力してみます。カード情報はどこかのサーバーに送られるわけではない(ブラウザ上でだけ実行される)と注意書きがありますが、適当な番号を使ったほうが精神衛生上良いでしょう。
「4111」を入れると、Visaカード風の見た目に。
「5111」を入れると、Masterカード風の見た目に。
カード番号の最初の方の数字を使って、クレジットカード会社を判別し、画面のレイアウトを切り替えているようです。
まとめ
Skeuomorphicなインターフェイス自体賛否別れるところがありますが、見た目的にはなかなか綺麗にまとまったインターフェイスだと思います。Hacker Newsのコメント欄では、1Passwordでデータを埋め込めないとか、タブオーダーが間違っているというような指摘もあり、実用するにはこれからさらに試行錯誤が必要かも。ソースはGitHubで公開されています。
