Bespoke.js キーボード＆タッチで操作可能なプレゼン資料作成フレームワーク「Bespoke.js」 1KB程度と軽量であるにも関わらずかなりカッコいいスライドショーのような物が作れます。 一見の価値があるので是非見てみて下さい 関連エントリ ２次元のプレゼンテーションを作れる「Flowtime.js」

Creating a CSS3 Web Browser Window Inspired by Chrome CSS3でChrome風ウィンドウを作成するチュートリアル。 次のように、いや、ブラウザのキャプチャではありません。CSS3で描画されたChromeです。 どういう時に使うかはアイデア次第ではありますが、Chromeの中にChromeの中にChro......という感じで続いてたら面白い効果が作れそうな気がしました。 アイデア次第でよいプロモーション等に使えるかもしれませんね。 関連エントリ 使えない(?)CSS3ジェネレーター「Useless CSS3 Generator」 CSS3でボーダーを超かっこよくアニメーションするサンプル CSS3ベースのオシャレな価格表作成チュートリアル PhotoshopでデザインしたシェイプをCSS3に変換するプラグイン「CSS3Ps」 クールな円

Free HTML5 Admin Template | MediaLoot フリーでHTML5ベースのリッチな管理画面テンプレート。 次のようなカッコいいHTML5ベースのテンプレートが公開されています。 管理画面ということでIEユーザとかは抜きにして考えてよい場合が増えそうでHTML5にしちゃっても問題無さそうです。 フリーなのにパーツ豊富ですね。ここまで使えていいんでしょうかと思ってしまうほど。 関連エントリ CodeIgniter開発での管理画面作成を楽にする「grocery CRUD」 カッコイイWEB管理画面を作成するPhotoshopチュートリアル TwitterBootstrapベースのテーマやテンプレートが入手できる「WrapBootstrap」

ページめくりを実現するためのjQueryプラグイン集 先日のHTML5で美麗なページめくり効果が作れるJSライブラリ「turn.js」 では多くの反響を頂きましたが、他にも同様のページめくりライブラリがあるようです Booklet 個人的にコンパクトなインタフェースがいいなと思うライブラリです。 HTML5がなくともIE8でも動きます Create a page flip effect with HTML5 canvas | Tutorial | .net magazine 以前紹介した、HTML5を使ったページめくりUIの作成チュートリアル。独自に作る場合は参考にできます jFlip なめらかなページめくりを表現できるjQueryプラグインです。 カーソルを合わせるとめくり部分が微妙にアニメーションしているあたりも芸が細かいです Simple Page Peel Effect with

PHP Bug Lost - A debug console and monitor tool for PHP scripts. 簡単に使えるクールなPHP用デバッグコンソールライブラリ「PHP Bug Lost」 画面上でログや、SQL、変数、実行時間、読み込んだファイルなどの実行に関する情報が綺麗なインタフェースで見れます。 フッタのバーをクリックすれば次のように開いて中身が見れます。 PHPのエラーが色分けされていて分かりやすい。 機能が沢山ありますが、他のツールなどとも組合せつつ便利に使えそうです。 利用法ですが、requireして専用の関数でコンソールにエラーを出すような感じのようです PHPBugLost - DOCS 関連エントリ TwitterやFacebookへのログイン機能をこれ１個で実装できるPHPライブラリ「HybridAuth」 WEBサービスで使えるPEAR以外

今までなかったスマートなページ内ナビゲーションを実装するjQueryプラグイン「Flexible Nav」 2011年08月04日- Flexible Nav jQuery library 今までなかったスマートなページ内ナビゲーションを実装するjQueryプラグイン「Flexible Nav」 <a name="hoge"></a> と <a href="#hoge"></a> を使って実現するページ内ナビゲーションをスマートに実現できます。 h1〜h3のエレメントでドキュメントの見出しを定義しておいて、プラグインで初期化すると、ページの右側に見出しが現れます。 文書の長さに応じて見出し間の距離が表されて、文書の構造が非常にわかりやすく、辿りやすくなります。 見出しをクリックすると、指定位置に移動できるのはもちろん、ドキュメント位置に応じて現在参照している見出し部分がハイライトされるので

Simple Vote Using JQuery Animate jQueryを使ったアニメーションする投票グラフを作るチュートリアル。 「Vote」ボタンを押せばグラフがにょきっと伸びて分かりやすい投票が作れます。 サーバサイドの実装は調整の必要がありそうですが、フロントエンド部分はできているので投票スクリプトっぽいものを作りたい場合は参考にできるかも 関連エントリ 小さくで可愛いグラフが描けるjQueryプラグイン「Piety」 画像スライダーに関することならお任せ！なjQueryプラグイン「Slider Kit」 次世代のイメージマップを実現できるjQueryプラグイン「ImageMapster」 レイアウトに関する強力なjQueryプラグイン６つ

60 Amazing iPhone Application Websites For Design Inspiration iPhoneアプリのプロモサイトを作る際に参考になる６０のサイトデザイン集。 iPhoneアプリケーションのサイトはアプリのプロモーションなわけなのでかっこ良く作っておくと、アプリの出来は別として興味を持ってもらえるはずです。 色々なiPhone実機の設置例が見られて非常に参考になると思ったのでご紹介。 アプリ紹介サイトと一言でいっても色々なデザイン方法があることがわかります 関連エントリ 奥行きをうまく使ったサイトデザイン集３０ スライダーを上手く使ってデザインされたWEBサイト集３０ 次のサービスに使えるかもしれないロゴデザイン集２２ HTML5とCSS3を使ったフォームデザインのチュートリアル集３０

40 Creative Photoshop Text Effect Tutorials | Splashnology 新しめのPhotoshopテキストエフェクトチュートリアル４０。 次のような新しめの、テキストエフェクトチュートリアルが公開されています。色々なテクニック満載で、学習に、ロゴ作成にと色々と使えそうです。 デザインの仕方にも色々ありますが４０種類であれば自分の作りたいもののイメージを探してチュートリアルをこなしてみることで、作りたい物を作る手助けになりそう 関連エントリ Photoshopテキストエフェクト作成チュートリアル35 フレッシュな50のPhotoshopテキストエフェクトチュートリアル集 コピペで使える！Photoshop不要になりそうな高品質テキストシャドウサンプル集 Photoshopでなかなかカッコいい3Dテキストを作るチュートリアル

ECサイトで使えそうな画像のレンズズームを超簡単に実装できるjQueryプラグイン「Lens Zoom」 2011年06月23日- A jQuery plug-in for Lens Effect Image Zooming ECサイトで使えそうな画像のレンズズームを超簡単に実装できるjQueryプラグイン「Lens Zoom」。 次のように、画像の特定部分の円形のみをズームするようなUIが簡単に作れちゃいます。 ECサイトなどで商品を拡大するように実装されていたらお客さんに喜んでもらえるかも。 レンズの大きさもピクセル指定で自由自在です。 白黒写真がレンズを入れることでカラーになるみたいな効果も。 レンズの色やサイズも選べます。 実装の容易さも素晴らしくて、.imageLensで初期化するだけです。 関連エントリ タイマーを作る際に便利なjQueryプラグイン「jQuery Timer」

jQuery Plugins for Styling Checkbox & Radio Buttons フォーム要素をクールにするためのjQueryプラグイン集がまとまっていましたのでご紹介です。 プラグインじゃない関数ベースのものもありますが、便利に使えそうです。 未来のサイトでの多くのフォームデザインはどんな感じになっているんでしょうかね。 関連エントリ 斬新なコメントフォームデザイン集 CSSでフォームデザインをする際のチュートリアル 立体的なCSS3でデザインされた検索フォーム実装チュートリアル デザイン性に優れたクリエイティブなフォームデザインのサンプル集

Fluffy Clouds in Photoshop | Abduzeedo | Graphic Design Inspiration and Photoshop Tutorials クラウド時代にファンシーな雲を描画するPhotoshopチュートリアルが公開されています。 次のように可愛らしい雲が描画出来てます。 単なる円形を組み合わせて雲の形を作ります。 レイヤースタイルを使ってサクッとリアルな質感を表現。 次は雲を薄くして光沢をつけていくプロセス。上のまんまでもそのまま使えちゃいそうですね。 これは簡単な割に色々と応用できそうなテクニックですね。 関連エントリ モダンなコーポレートサイト作成用Photoshopチュートリアル 光のエフェクトを与えたクールなイメージ作成Photoshopチュートリアル２５ プロレベルのPhotoshopチュートリアル集

Subway Map Visualization jQuery Plugin | TechBubble 地下鉄の路線図を描けるjQueryプラグイン「Subway Map Visualization」。 もうなんでもアリか、という感じですが、次のように地下鉄マップ風のグラフィックを自由に描けるプラグインです。 ULのリストで定義していくと次のように自由に図形が描画出来ます。 東京の地下鉄を作ってみても面白いかもしれませんね。 まあ地下鉄じゃなくてもJRとかでもいい気がしますが。 関連エントリ テーブルの内容をリアルタイムにグラフ描画できるjQueryプラグイン「graphTable」 グラフ描画用のjQueryプラグイン集 jQueryベースの滑らかなグラフ描画ライブラリ「Flot」

50 Best Photoshop Text Effect Tutorials | CreativeFan フレッシュな50のPhotoshopテキストエフェクトチュートリアル集。 新しめなテキストエフェクト作成用チュートリアルが沢山で参考になります。 次のようなかなり壮大なものから汎用的に使えるものまで揃っています。 これは覚えておくとよさそうですね。 関連エントリ 最近公開されたNewなPhotoshopロゴデザイン70のチュートリアル集 あの有名プロダクトのロゴを作るPhotoshopチュートリアルいろいろ クールなネオン風ロゴを作成するPhotoshopビデオチュートリアル クールな惑星っぽいテキストロゴ作成Photoshopチュートリアル

30 Best Funny and Entertaining 404 Pages アイデア満載の404サイトデザイン例30。 通常なら殆どみない404のサイトデザインですが、色々な404ページが特集されていて面白い。 このブログの404ページはこんな感じ 関連エントリ 移動する前に404かどうか確認できるjQueryプラグイン「Catch404」 訪問者と管理者に有用な403/404エラーページを作るPHPチュートリアル クールな404エラーページ集 カスタマイズされたクールな404ページ集 404ページ、ログイン、コメント部分などパーツごとに優れたサイトを集めたリンク集「MephoBox」