『ウェブサービスインターフェース勉強会』へのお誘い | SiMPLE*SiMPLE
『ウェブサービスインターフェース勉強会』へのお誘い September 21, 2007 9:18 AM written by Gen Taguchi さて突然ですが勉強会のご案内。テーマは『インターフェースデザイン』。Simple*Simpleで取り上げているような「ちょっとしたことだけれど気が利いてるよね」的なものについてわいわい議論できればと思います。 対象は企業や個人でウェブサービスのインターフェースデザインや企画をされる方を想定しています。 内容はSimple*Simpleを題材にした「ちょっとこじゃれたインターフェースまとめ」に加え、今回協賛していただくbeBit社から「ユーザビリティテストでわかったインターフェースの勘所」をお話しいただきます。beBit社にはかなりのノウハウが蓄積されているのでそれを教えていただきましょう。 また後半は交流を目的として全体会議も行います。「こ
「メールが届きません・・・」を防止するインターフェース | SiMPLE*SiMPLE
「メールが届きません・・・」を防止するインターフェース August 28, 2007 10:55 AM written by Gen Taguchi メールによる認証プロセスがあるサービスでありがちなのが「メールが届きません」というユーザーからの問い合わせメール。 だいたいにおいて迷惑メールフォルダに振り分けられていることが問題ですが、その注意を喚起する方法としてPing Meはなかなか良いかな、と思いました。 このサイトではユーザーがメールアドレスを入力した直後（フォーカスを他に移ったとき）に「迷惑メールフォルダに注意してね」というメッセージが現れます。 入力した直後に自分が見ていたところに突然あらわれる点がいいですね。びっくりすると同時に「なんだろ？」と思わせることができるかもしれません。こういう工夫もいいですね。 ↑ メールアドレスを入力した直後に上のようなメッセージが現れます。
スライダーでブログの過去記事を検索できるインターフェース | SiMPLE*SiMPLE
スライダーでブログの過去記事を検索できるインターフェース August 23, 2007 5:30 AM written by Gen Taguchi Save the assistants.comのブログのインターフェースがちょっと気になります。過去記事へのアクセスをスライダーで行うことができるのです。 ↑ こんな感じ。Ajaxな感じで、スライドさせると動的にページをロードしてくれます。 「次のページ」「1 > 2 > 3 >」といったインターフェースより直感的でよいですね。 » save the assistants Info: ナビゲーション | 固定リンク | コメント (0) | トラックバック (0) | ↑
Web 2.0っぽいロゴがさくっと作れる『LogoCreatr』 | SiMPLE*SiMPLE
またかよ・・・という方もいらっしゃるかと思いますがｗ、Web 2.0風のロゴジェネレーターをご紹介。いろいろ設定できて便利ですよ。 ↑ 設定項目はこちら。フォントの色、サイズ、星の形などいろいろできます。文字ごとに色も変えられますね。 ↑ この設定で作ってみたのがこちら。 ↑ ちなみに別メニューでボタンジェネレータもありますね。こちらも便利。 似たようなジェネレータは他にもありますが、かなり柔軟に設定できるので個人的にはこれが今のところ一番かも。よろしければどうぞ。 » Web2.0 – Logo Creatr こちらもあわせてどうぞ。 » 簡単に2.0っぽいロゴがつくれるメーカー | i d e a * i d e a
クールなアクア風ボタンのベクトルデータが無料で72個！ | SiMPLE*SiMPLE
クールなアクア風ボタンのベクトルデータが無料で72個！ すぐに使えそうなアクア風ボタンのベクトルデータが無料で公開されています。イラストレーターなんかで編集すればぱっと使えそう。 » 72 Free Vector Glass Buttons and Bars ファイル形式はAI、PNG、EPS、SVG。環境にあわせて必要なものを使うとよいでしょう。ただ手元のIllustrator 10ではAIが開けなかった・・・最新版じゃないとだめなのかな。 どちらにしろこういうベクトルデータの公開はうれしいですね。 CS3 で開けたので試しに Illustrator 10 形式で保存し直したところ、警告メッセージは出ますが特に何かが劣化するようには見えませんでした。(見落としているかもですけど) CS3 を持ってる人を探してファイル形式を変換してもらうと良いかもしれません。
こっそり一言メッセージ | SiMPLE*SiMPLE
こっそり一言メッセージ January 25, 2007 9:06 AM written by 8maki たつをさんのブログ、たつをのChangeLogにはコメントフォームがありません。 代わりに一言メッセージというのが付いています。 一言メッセージはたつをさんだけに送られるようです。メールよりも簡単で、コメントよりもパーソナル。 ちょっとした工夫ですが、読者との接点を大切にするたつをさんなりの工夫がうかがえました。 » たつをのChangeLog Info: 特殊効果 | 固定リンク | コメント (0) | トラックバック (1) | ↑ この記事のトラックバックURL （トラックバックは承認後に公開されます） [を] こっそり一言メッセージ 一言メッセージ機能[2005-01-30-3]が、simple x simple で紹介されていまし ... たつをのＣｈａｎｇｅＬｏｇ
いらないときは隠すインターフェース | SiMPLE*SiMPLE
いらないときは隠すインターフェース January 11, 2007 8:00 AM written by watanabe シンプルさを追求するには、削れるものをそぎ落としていく作業と同時に、きちんと意味が伝わるような工夫が必要なのかなと思います。 そういう意味で、シンプルなスペルチェッカーspellifyは参考にできそうです。 ↑ 画面には、フォームしかありませんが・・・ ↑ フォームをクリックすると使い方の説明がすーっとあらわれ、フォームの外をクリックするとすーっと消えます。 あまり使い慣れていない画面ではどうかと思いますが、検索窓のようにある程度何をするかわかっているところで、こうした「隠れ説明」が必要なときだけ出てくるというのも悪くないですね（少なくともちょっとした驚きがありました）。 場所にもよるかと思いますが、「必要なときには表示して、いらないときには隠しておく」というインタ
ToDoをタグクラウドで表現する『Zirr.us』 | S i M P L E * S i M P L E
今までいろいろなToDoリストを見てきましたが、Zirr.usのインターフェースはちょっと斬新。ToDoをタグクラウドで表現しています。なるほど、という組み合わせですね。 » Zirr.us ↑ 優先度によってサイズが変わり、タグによって色分けされるという寸法。 ↑ 名前や日付、優先順位でタグクラウドのソートもできます。 タグクラウドの表現はどうあるべきか？というエントリーを最近書きましたが、タグクラウドの応用についても考えられそうですね。 ToDoを大きさで分類すると言う意味では百式管理人考案のバブルマップにも似ていますね。 » バブルマップのすすめ ～ ストレスすっきり解消型ToDo管理手法 ～ 登録も無料ですし、操作もAjaxで快適なので気になる人はちょっと試してみては・・・（ただ、日本語が通らないのですが・・・）。 » Zirr.us
フォントの色と大きさと背景色の微妙な関係 | S i M P L E * S i M P L E
フォントの色と大きさと背景色の微妙な関係 December 26, 2006 10:00 AM written by 8maki 12月1日からクリスマスまで、日替わりでウェブ制作のちょっとしたTipsを紹介する「24 ways」が今年も開設されているようです。 その24 waysから一つご紹介。 » 24 ways: Cheating Color フォントの色と大きさと背景色についてのTipsです。 わかりやすく例を出していきましょう。 架空の会社のロゴを例にしてご説明します。まず、大きいフォントで「Double Dagger」という社名があり、その下に小さいテキストが入っています。よくあるデザインですよね。さて、このデザインについて見ていきましょう。 ■ 薄い背景に明るいフォントの場合 さて、下に2つのロゴがあります。 左のロゴは色の統一感のルールに従って社名とテキストを同じ色にしてい
タグクラウドの表現はどうあるべきか？ | SiMPLE*SiMPLE
タグクラウドの表現はどうあるべきか？ December 26, 2006 9:26 AM written by watanabe GiftTaggingのタグクラウドが綺麗です。タグクラウドって便利そうだけどあんなに文字が並んでもねぇ・・・という方は参考にされてはいかがでしょうか。 ↑ タグを本当の「タグ」で表現してみました。 ↑ タグづけの表示にも、タグのアイコンが。 タグクラウドはまだ出てきたばかり。どんな表現手法が良いか、貪欲に試行錯誤していきたいですね。「タグ」を直感的に「タグ」とわからせるこうした手法もいいのではないでしょうか。 ちなみに元ネタはこちら。37signalsのこのブログでは「Screens aroud town」というコーナーがあって、参考になります。Simple*Simpleでも今後とりあげていきたいと思います。 » [Screens around town] F
勝手ながら『Web 2.1のデザインパターン』を考えてみた | S i M P L E * S i M P L E
さてデザイナーでもなんでもないのでかなり個人的な主張ですが、「Web 2.0っぽいデザイン」の次を考えてみました。 名づけて『Web 2.1のデザインパターン』ｗ。 個人的には「角丸の次って何よ？」と常々思っていたので、最近新しく出てきたサイトに共通するいくつかの特徴をまとめてみました。 かな～り主観なので「そうかぁ？」と思われる方もいらっしゃるとは思いますが・・・間違いを恐れずにメモ書き程度にエントリーです。 では早速。僕が感じている「次っぽいデザイン」の特徴は4つ。 【1】 極太ストライプ（Bold Stripe） ストライプはWeb 2.0っぽいデザインでも流行っていますが、それをもちょっと太くしたやつを最近よく見ます。 ↑ タイトルと背景が太いストライプに。 ↑ 細いストライプはWeb 2.0っぽかったですが、最近はちょっと太めが流行りかな。 【2】 極太枠線（Bold Borde
あるウェブサイトができるまでのアニメーション | SiMPLE*SiMPLE
あるウェブサイトができるまでのアニメーション November 25, 2006 2:18 PM written by Gen Taguchi これ、自分で以前どこかで紹介したらしいのですが（多分mixi日記）、こっちでも紹介しておきましょう。 あるウェブサイトができるまでをアニメーションにしてあります（下の画像をクリックするとアニメーションにとびます）。 ↑ そうそうこんな感じ・・・。 テキストからはじまって、CSSを定義して、画像をいれて、というぐあいに見ることができて素敵です。 » designline-openair.gif 以前百式で紹介したTimeSnapperを使えば簡単に自分でもできそうですね。 » レコード＆レビュー （TimeSnapper.com） | 100SHIKI.COM Info: その他 | 固定リンク | コメント (1) | トラックバック (1)
Script.aculo.usにモーフィング機能が登場 | SIMPLE*SIMPLE
Javascriptでさまざまな効果を実現できるscript.aculo.usがバージョンアップ。今回の目玉は「モーフィング」。指定したエレメントをぐーっと変形させていくことができます。 といっても、見るまでわからないと思うので下記ページのデモをどうぞ。 » モーフィングデモページ （すげぇ・・・） script.aculo.usには他にもいろいろな効果がありますね。なにかサービスをつくるときには参考にされてみてはいかがでしょうかね。 しかしscript.aculo.usには二つの問題がありますね・・。 サイトが激重い・・・。 なんて発音するのかいまだにわからない。 » script.aculo.us公式ページ
提案型検索エンジン | S i M P L E * S i M P L E
提案型検索エンジン November 14, 2006 8:30 AM written by 8maki retrevoは普通の家電検索エンジンとはちょっと違う。 なんと検索ワードの候補を次々と提案してくれるのだ。 » retrevo この仕組みで今まで気づかなかったワードを発見できるかもしれない。 韓国の検索エンジンでは検索フォームに出る語句が広告枠になっていると聞いた。 サイトに掲載される情報はどんどん増えてきているので、検索窓がついているのが当たり前になってきている。 検索窓というメディアをどう有効活用できるか、いろいろな工夫が考えられそうですね。 Info: ウェブサービス | 固定リンク | コメント (1) | トラックバック (0) | ↑
Adsense x Analytics - SIMPLE*SIMPLE ～ ウェブ職人のための小粋なネタ帳 ～
※ 百式管理人注：この記事、Simple*Simpleのテーマである「Smart Designs」のテーマからは逸れますが、うちの学生インターンくんが自主的に書いてくれました。こういう前向きな姿勢は高く評価したいので掲載してしまいます。いやぁ、最近の学生さんはみんな優秀だなぁ・・・。 あなたのブログでも導入しているかもしれないGoogle AdsenseとAnalytics。 » Track Google AdSense Clicks via Google Analytics – Free AdSense Tracker : SEO Book.com ではAnalyticsを利用してAdsenseのクリックを詳細に追跡する方法を紹介している。 「どのエントリーでクリック数が多いのか？」「どこから来たユーザーのクリック率が高いのか？」などAdsenseのレポート機能ではわからないことも完全で
関連エントリーの自動表示でブログ記事をリッチに | SiMPLE*SiMPLE
関連エントリーの自動表示でブログ記事をリッチに November 15, 2006 1:00 PM written by 8maki ブログの記事に関連エントリーを載せるのは重要だ。 コンテンツをリッチにしてくれて、読み手の滞在時間を長くすることができるからだ。 でも、いちいち手作業でアップするのはめんどうである。 そこでNiall Kennedy's Weblogのやり方をまねてみるのはどうだろう。 » Niall Kennedy's Weblog これはSphereというサービスを使っているようだ。 このサービスを使うと自分のブログやニュースサイトから関連記事を自動で検索して表示してくれる。 日本でもこういうサービスができたらいいなー。 Info: ナビゲーション | 固定リンク | コメント (0) | トラックバック (0) | ↑
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
チラ見せでマウスオーバーを誘うインターフェース | SiMPLE*SiMPLE
サイト内クリッピングでニュースチェックをスムーズに | SiMPLE*SiMPLE
複雑なアニメーションを実現するanimator.js | SIMPLE*SIMPLE