Home > Archives > 2007-07

2007-07

スクロールしても消えないドロップシャドウの作り方

メモ書きもかねてエントリー。ページをスクロールしていってもページの上や下にドロップシャドウを貼り付けておく方法。

drop_1.gif

↑ このようなドロップシャドウですが・・・。

drop_2.gif

↑ スクロールしても付いてきます。

サイトに立体的な効果をつけたいときに使えそうですね。いろいろ応用も利きそうです。

なお、PNGの透過部分を使っているのでInternet Explorerでは動きません。実際に動いているデモはこちらから。

詳しい作業ステップは以下のサイトからどうぞ。

» Scrolling Drop Shadows | Zooiblog

今日見つけたかわいいFavicon(amicoz.com)

なんとなくFavicon好きなので「今日見つけたかわいいFaviconシリーズ」を始めてみる。

今回ご紹介するのはamicoz.com。サイト自体は次世代SNSらしい。相性を計算してくれるのだとか。それはいいとしてFavicon。

amicoz.gif

↑ イルカが可愛い!

サイトのコンセプトにあっているかなどは激しく疑問ですがw、かわいければOKでしょう!w

» Amicoz

moveme.comのエラーメッセージ(というか表現)

お引越し支援サイトのmoveme.comのエラーメッセージがちょっと変わっています。

普通エラーがあると赤い文字で「正しく入力してください」とか、フォームの枠が赤くなったりしますが、このサイトではフォーム自体が左右にブルブルと震えてエラーだということを教えてくれます。

moveme_err.gif

↑ テキストボックス自体が横にブルブル震えますw。

ちょっとかわいいですね。実際の動作は以下からどうぞ。

» moveme.com – the site that makes moving simple

お問い合わせ画面でFAQをリアルタイム表示

家系図をつくれるサービス、Geniのお問い合わせ画面がなかなか便利です。

contact_1.gif

↑ 普通の問い合わせ画面ですが、内容を入力しはじめると・・・。

contact_2.gif

↑ その言葉をリアルタイムに解析して関連するFAQを表示してくれます。

他のサイトでも採用されているようですが、わかりやすいですよね。サポートコストが大変・・・というサイトで採用してみてはいかがでしょうか。

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

» Geni – Help Center

なお、元ネタはAjaxianでした。

» Ajaxian – Geni Smart Contact Form

Pownceに見るインターフェースの小技

pownce_top.gif

さて日本でもJOJOに登録者が増えつつあるPownce。招待状をもらったのでインターフェース的なところでレビュー。このサービス、基本的にはTwitterと同じものですが、Diggの創業者が手がけていることもあって注目されています。

ちょこっと触っただけですが、Twitterとの違いは以下のとおり。

  • メッセージだけではなく、ファイルやイベント情報などを送信できます。
  • 標準でローカルのクライアントツールがついてきます。これがちょっとかわいい。AdobeのAIRをつかっているようですね。
  • 有料プランがあります。大きなファイルが送れたり、「PRO!」のバッジがついたり、広告がなくなったりするようです。年間20ドル。うーん、微妙w
  • まだAPIがないので関連ツールとかはこれからの模様・・・。
  • 現在のところ、日本語とおりません・・・orz。

・・・ま、どうなるかわかりませんが、一応話題になっているので新しもの好きな人はアカウントは取っておいてもいいかもですね。

さてSimple*Simpleなのでインターフェースの小技をさらりとレビュー。だらだら書いてもしょうがないのでポイントだけを。

  • 登録画面でちょっとしたヒント
  • 登録画面で名前や誕生日を入力するときにちょっとしたメッセージが表れます。フィールドにフォーカスがあたるとヘルプが出るというものですね。よく見る手法ですが、入力しやすくて助かりました。メッセージもゆるい感じで期待が高まります。

    pownce_profile.gif

    ↑ 13歳以上じゃないと登録できないよー、とか教えてくれます。

  • 国を選ぶと国旗が出る
  • ちょっとしたことですが、プロフィールで国を選ぶと国旗が出てくれます。何の役にも立たないですがちょっとかわいい。

    pownce_country.gif

    ↑ いろいろな国を試したくなります。

  • 性別がたくさんある
  • 性別の欄には「男性」「女性」しかないだろうと思いきや、「少年」「少女」「上のどれでもない」などたくさんの選択肢が出てきました。これでいいのか、と思わないでもないですが、予想を裏切ってくすりとさせるインターフェースかな、と。

    pownce_sex.gif

    ↑ これでいいのかは不明・・・。

  • 写真のアップに際して・・・
  • 登録時に写真をアップするのが面倒なときがありますが、単に「この手順をスキップ」と書いてあるのではなくて、「自分はこの退屈なデフォルトの写真が好きだからスキップ!」と書いてありました。愛嬌がありますね(かな?)。

    pownce_pic.gif

    ↑ Skipする際のメッセージがなかなかかと。

以上、ちょっとした小技のご紹介でした。どれも役に立つ、というものではないですが、ゆるーい雰囲気を漂わせるのに一役買っていますね。やりすぎはいけないですが、こうした遊び心を大切にしたいところです。

» Pownce (まだ招待制です)

Home > Archives > 2007-07

最新の記事
カテゴリー別
過去記事

Return to page top