いろいろあるインタラクティブ・テーブル : could
UI視覚化 いろいろあるインタラクティブ・テーブル マルチタッチで操作可能なインタラクティブ・テーブルといえば Surface が有名ですが、他でも同類のテーブル（もしくは壁）が開発されています。カフェ、図書館、カンファレンスなど人がたくさん集まる場所にあると便利そうなインタラクティブ・テーブル。今回は GUI の見せ方も含めて興味深いものを幾つか紹介。アート作品から実際使われているものまで集めて参りました。リンク先のサイトには動画が掲載されているので、読むよりまずは見て体感すると良いと思いますよ。 Maeve ドイツの University of Postdam で開発されているテーブル。専用カードを置くことで情報むことが出来たり複数のカードの情報の関連性を視覚化してくれます。ProcessingとGestaitで開発されたそうです。 Remotable スウェーデン在住の学生によって作
PSDとXHTMLがセットになったWebデザイン学習キット色々:phpspot開発日誌
6 Free PSD/(X)HTML-Templates | Freebies | Smashing Magazine PSDとXHTMLがセットになったWebデザイン学習キット色々。 １からWEBデザインを作るとなると、Photoshopでベースを作成→HTML化の作業が必要ですが、Photoshop、HTML、CSSがセットになったものが公開されています。 デザイン自体も次のようなプロが作ったと思われるクオリティのデザインになっています。 Shape Projection Template Artificial Casting Template すべて見る＆ダウンロード 色合い変更や少々のレイアウト配置変更といったカスタマイズで独自ページも容易に作れるかも。 関連エントリ プロによる美麗サイトデザインを構築するPhotoshopチュートリアル集 プロのサイトデザイン方法を作って学べる手
50 Useful Icons For Your Next Design [Free Sets] — Smashing Magazine
Beautiful and free icon sets always come in handy. Used properly and moderately, icons can be helpful to provide users with memorable metaphors and illustrations that would provide a visual support for otherwise unspectacular text blocks. For instance, in web applications memorable icons can be very helpful as they can make it easier for users to memorize how to perform some specific task or where
ブラウザから離れてアイドルになった時のイベントを簡単取得できるjQueryプラグイン「jQuery idleTimer plugin」:phpspot開発日誌
ブラウザから離れてアイドルになった時のイベントを簡単取得できるjQueryプラグイン「jQuery idleTimer plugin」 2009年06月08日- Paul Irish jQuery idleTimer plugin ブラウザから離れてアイドルになった時のイベントを簡単取得できるjQueryプラグイン「jQuery idleTimer plugin」。 idleTimer pluginを使えば、ブラウザ内で、しばらく操作しなかったり、別のウィンドウに移動して、最初使っていたブラウザをしばらく操作しない場合に、”アイドル状態”としてイベントを発生させることが出来ます。 逆に、アイドル状態からの復帰もイベントで取得できます。 // タイマーをミリ秒単位で初期化(10000だと10秒) $.idleTimer(10000); $(document).bind("idle.idleT
検索語の強調
かなり昔から色々な人が作ってるリファラを調べて検索語を取得しドキュメントの単語を強調表示するスクリプトを今さら書いた。jQueryのおかげでそこそこ短く書けた。遅いけど。リファラから検索語を取得する部分はまぁ置いておいて(あんまり考えずに書いたので)、ドキュメントの単語をハイライトするコードの部分についてだけ書いておく。 $("#contents > .section *").not("iframe").contents().each(function () { if (this.nodeType === 3) { var s = this.nodeValue.replace(words, "<em class=\"highlight\">$1</em>"); $(this).replaceWith(s); } }); だけ。wordsにはリファラから取得した単語の正規表現が入っている。こ
Windows 7 デスクトップのデザインプロセス
Macユーザーではありますが、10月発売が決定した Windows 7 は結構期待しています。Vista で見つかった問題をどのように解決したのかという点も気になりますが、パソコンを利用する方達にどのようなソリューションを提案しているのかも興味深い点です。既にスクリーンショットやスクリーンキャストがウェブ上で出回っていますが、期待値が上がる UI や機能が幾つかあります。 Windows 7 のデスクトップはどのようにデザインされたのでしょうか。今年3月に開催された MIX09で、マイクロソフト シニア UX デザイナー Stephan Hoefnagels 氏が「Designing the Windows 7 Desktop Experience」というプレゼンをしました。デスクトップの細部にフォーカスして徐々に問題解決し、目指すゴールに近づけるプロセスを分かりやすく説明しています。以下
Beautiful High-Quality Free Fonts For Your Designs — Smashing Magazine
Every now and again we take a look around, select “fresh” high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually the time you should be investing in your current projects. We search for them and we find them, so you don’t have to. In this selection we’re glad to present you Chunk, Titilium, Amputa Bangiz, Serif Beta
65 Excellent Flash Designs | Design Showcase | Smashing Magazine
Flash enabled designers and developers to deliver rich content over the browsers, creating motion, interactivity and an impressive visual experience. Good Flash-sites do not require too much bandwidth, load fast and allow for a smooth interaction; besides, beautiful Flash-based sites are Photoshop masterpieces, transporting some kind of reality and fantasy to the Flash movie. In the showcase below
セクシーなドロップダウンメニュー実装サンプル:phpspot開発日誌
Sexy Drop Down Menu w/ jQuery & CSS | Noupe セクシーなドロップダウンメニュー実装サンプル。 次のような、セクシーかどうかはさておき、クールなメニューのサンプルが公開されています。 CSSで綺麗にレイアウトして、jQueryで実装したものです。 マウスオーバーで光る高級感がナイス 矢印↓ボタンを押した時にちゃんと凹むのもいい感じ。 タグ構造も結構綺麗に定義できてレガシーなブラウザ（ＩＥ６）にも対応しているっぽいのでなかなかオススメです。 関連エントリ チュートリアルでここまでやる？というプロレベルのWEBレイアウト作成チュートリアル jQueryクライアントとPHPサーバ間をJSONで結ぶチュートリアル
14 Javascript Resources And Plugins For Creating A Stylish Chart
Subscribe my Newsletter for new blog posts, tips & new photos. Let's stay updated!
Effective Website Maintenance: Examples and Best Practices — Smashing Magazine
Every website has to perform maintenance at some point or another. Whether it’s just to upgrade a portion of the site or because of some problem with the site, it’s an inevitable fact of website ownership. And in many cases, maintenance requires taking your site offline for at least a few minutes. Every website has to perform maintenance at some point or another. Whether it’s just to upgrade a por
jQuery Sliding Tab Menu for Sidebar Tutorial
Introduction This tutorial, we will be making a jQuery Sliding Tab Menu for sidebar. Previously, I made a tutorial about jQuery Tabbed Interface / Tabbed Structure Menu, if you have not read it yet, check it out. I'm using it for my sidebar at the moment. The differences between both tab menus are, the sliding direction and this time, we are using a little bit different HTML structure and massive
60+ Awesome Grunge Font Collection For Designers
Design trends like Grunge and Dirty styles are highly in demand and appreciated by many. Although grunge sometimes translates to dirty, it’s a style highly admired by designers. Today, we’ve curated a list of 65 exceptional Grunge Fonts you would undoubtedly want to include in your collection. If i had missed out any fonts that you think are cool, please share through the comment section. Without
JavaScriptで複雑なデータ視覚化のためのライブラリ「JavaScript InfoVis Toolkit」:phpspot開発日誌
JavaScript InfoVis Toolkit - Interactive Data Visualizations for the Web JavaScriptで複雑なデータ視覚化のためのライブラリ「JavaScript InfoVis Toolkit」 次のような、画像編集ツールで書くにしても大変そうな複雑なデータの描画をJavaScriptで行えます。 描画できるグラフもなかなかユニークなものが多くて、これは覚えておくといつか使えるかもしれません。 APIドキュメントはこちら 関連エントリ 複雑なデータも綺麗に描画できるデータのビジュアライズフレームワーク「Axiis」 データを視覚的に分かりやすくビジュアライズするためのライブラリ集
スタイリッシュなWEBフォームの実装例いろいろ:phpspot開発日誌
25 Stylish Examples of Web Forms スタイリッシュなWEBフォームの実装例がいろいろと紹介されており、一部ご紹介。 フォームというと簡単なデザインで済ましてしまう場合が多いと思いますが、こうしたところにもこだわっていると力の入れ加減が伝わってきますね。 デザイン自体もなかなか難しいと思いますが、参考にして綺麗なフォームが作れそう。 Alexandru Cohaniuc 壁に貼ったみたいなインタフェースでオシャレ Tea Round App 角丸で立体的なフォームがナイス Grooveshark 子ダイアログ風のポップアップフォーム Substrakt Matt Pixelight Creative 全部見る デザインを学んだ上で、ユーザビリティについても考え、あくまで利用者視点にたった使いやすいフォームを作りたいものですね 関連エントリ CSSでデザインされた
15 Effective Tips and Tricks from the Masters of CSS - noupe
There are thousands of sites out there offering tips and tricks for using CSS. But how do you know where that information is coming from? Who says the people writing these "tips" know what they're talking about? For all you know, it could be someone who has not clue what CSS even stands for, let alone how to use it effectively. But that's not the case with the experts below. They're all well-known
オープンソースで本格的なＥコマースサイトが作れる「DantoCart」:phpspot開発日誌
DantoCart :: Open Source Ecommerce オープンソースで本格的なＥコマースサイトが作れる「DantoCart」。 以下はデモ用のサイトなのですが、ＵＩも綺麗で使いやすそうです。 デモサイトを見てみる こうしたショッピングサイト構築用のオープンソースは色々ありますが、選択肢の一つとして覚えておいてよいかもしれません。 関連エントリ PHP製のショッピングカートシステムいろいろ 超かっこいいJavaScriptショッピングカート「simpleCart(js)」 Ajaxベースのクールなショッピングカート作成
フリーテクスチャを色々探せるサイト「Texture Lovers」:phpspot開発日誌
Free Textures, Inspiration and Tutorials | Texture Lovers フリーテクスチャを色々探せるサイト「Texture Lovers」。 綺麗なテクスチャがカテゴリごとにまとまっていて探しやすいです。 テクスチャが探せるという点でも、便利なのですが、このサイト自体、物凄くうまい具合にテクスチャを使っていて、非常に参考にできます。 ヘッダー部分の革の質感がまるで本物のような綺麗なデザインになっています。 関連エントリ ハイクオリティな50のメタルテクスチャ集 いい感じの手作り感が出せる紙のテクスチャ素材色々 カラフルでフリーな美麗テクスチャ集 木目や錆、繊維など使えるテクスチャ画像集まとめ
ひろゆきの持つ貴重な「ユーザ目線」
■ ひろゆきの持つ貴重な「ユーザ目線」 先日のインタビュー記事で梅田望夫に対する最後の期待を打ち砕いた我らがゆかたんの、次の仕事がひろゆき×夏野対談というのは、辛辣というか意地が悪いというか。いいぞもっとやれ! 読んでいて感心するのは、取り上げられているひろゆきの発言が、キッチリことごとくユーザ目線なことだ。例えば冒頭: 夏野 ここにいる方で、Twitter分からない人いらっしゃいます? ひろゆき そういう風に聞くと挙げづらいでしょ。Twitterを過去24時間以内に使った人? ユーザ(聴衆)が答えやすい、しかも効果的に成果を知ることができる質問を、その場ですぐに思いついてる。どんなに有名になっても、どんだけ深くネットを使いこなしていても、すぐに普通の人の目線に戻ることができる。ひろゆきの持つ最大の才能はこれじゃないかと思う。 (追記: 上の発言には「発言者が逆だ」という指摘があった(→Y
fladdict » アプリケーションにおけるデザインの重要性
WWDC出てAppleの中の人や、成功したアプリの製作者が口をそろえて言うことは、「これからアプリはデザインがもっとも重要で、開発時間の大半をデザインに充てるべきだ」、ということだった。 １年ほど自分で製作してみた実感でも、テクノロジーはそれほど重要ではない印象。 いわゆるFlexとかRIA系の世界では、デザイナーのポジションはUI設計と切り離されて、単なるスキン屋に甘んじてることが多いとおもう。 しかしiPhone系だと、ぶっちゃけデザインがウンコだと、メディア露出だけで力技で殴り勝てるアプリじゃない限り、まず成功することはありえないと思う。 iPhoneは市場が小さいからまだ当面予算が低いのがアレだけど、最終的にはこういう生活に密着したアプリケーションは、通常のウェブサイトやアプリケーション以上に積極的にデザイナーが設計にコミットして、もっと単価要求すべきな気がする。 これはアプリケー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://tutorialblog.org/photoshop-tutorial-how-to-fake-a-holga-photograph/
Blogger
http://tutorialblog.org/15-sites-to-visit-for-logo-inspiration/
Blogger
35 Beautiful & Free PSDs For Charming Designs
http://tutorialblog.org/photoshop-tutorial-getting-that-great-x-pro-lomo-look/