Meny - CSS 3D fold-in menu concept 3D Transformsを使った次世代の3Dサイドメニュー実装スクリプト「Meny」。 ページのサイドに矢印があって、クリックするとコンテンツがグリっと3Dで回転して超カッコいいメニューの実装例です。 SafariやiPhone等で確認することが出来ます メニューを開いた例。 ページの右側を切り替えても動くように出来ます。 これは、まだまだ進化しますね 関連エントリ シンプルだけどデザインがよいドロップダウンメニュー実装チュートリアル デザインも動きもオシャレなjQuery＆CSS3メニューデモ スマホサイトでも使えそうなかっこいいドロップダウンメニュー実装jQueryプラグイン「ddSlick」 メニューを固定したWEBデザインのサンプル２１

util.php - The PHP programmers best friend - UtilityPHP PHPの基本機能を拡張して便利にできる「UtilityPHP」。 読み込むと、util::〜系の便利関数が沢山使えるようになります。 var_dumpを綺麗に折畳み可能な形で出力してくれる util::var_dump、多次元の配列を１つの配列にする array_flatten や、URLにクリを追加したり削除する add_query_arg, remove_query_arg、httpsアクセスかどうかを判断する is_https など、汎用に利用できそうな関数群が詰まっています。 読み込むと全て使えるようになるものの要らないものも多そうなわけですが、この中から必要なものだけをコピーして使うという使い方で便利に活用できるかなと個人的に思いました。 これはよく使うっていうものは抜

3D Flipping Circle with CSS3 and jQuery | Codrops 円形の冊子ページをめくる風機能をCSS3とjQueryで実現するチュートリアル。 ページめくりといえば四角が一般的ですが、次のように丸い冊子をめくるエフェクトが斬新です ページをめくる際の影のエフェクトなんかも結構リアルに再現されています めくった所。 ただ四角いページめくりよりもインパクトがありますね 関連エントリ HTML5で美麗なページめくり効果が作れるJSライブラリ「turn.js」 ページめくりを実現するためのjQueryプラグイン集 ページめくりができるInstgramのWEBマガジン作成チュートリアル

Create a Diablo III Inspired Text Effect in Photoshop | Psdtuts DiabloIII風のロゴを作るPhotoshopチュートリアル。 話題のDiabloIIIのロゴをパロディで作ってみたりするには面白いかもしれません。 詳細もちゃんとデザインされています 関連エントリ 印象に残りそうなパッケージデザインを作るPhotoshopチュートリアル 超カッコいいグラフィックスを作るPhotoshopチュートリアル集２０１１ 2012年2月公開の新しめPhotoshopグラフィックス作成チュートリアル集

3D Unique Website Designs | Script Tutorials | Web Developer Tutorials | HTML5 and CSS3 Tutorials 3DすぎるWebサイト集。 若干重いのは難点ではありますが、その技術的チャレンジには熱いものを感じるサイト集です。 結構大変そうだなって思いますが、将来的にこうしたサイトは普通の物になっていたりするのかも キャッチアップできるよう常に勉強が必要ですね 関連エントリ スクロールした時に面白いエフェクトが実装されたサイト集 iPhone、PC両方で綺麗に見れるフレキシブルなサイト集 スライダーを上手く使ってデザインされたWEBサイト集３０ Flash使ってなくてもHTML5でここまでクールにできるというプロフェッショナルサイト集

jTable.org - A JQuery plugin to create AJAX based CRUD tables - Home Page データベース連動型のAjaxを使ったテーブル実装jQueryプラグイン「jTable」 CRUDの操作が可能でその場で編集、削除といった作業ができるのは便利です 画面遷移なしに編集が可能 削除の場合、確認ダイアログが出て削除可能 お手軽になりますが、使い所によっては危険なので慎重に使いたい所ですね 関連エントリ 長ーいテーブルも瞬時にページング処理してしまうjQueryプラグイン「Table Pagination」 テーブルのカラムをドラッグ＆ドロップでリサイズできるようにするjQueryプラグイン「colResizable」 階層構造が作れるテーブルを実現できるjQueryプラグイン「treeTable」 テーブルをちょっとだけ使いやすくして

Mixpanel Flow | Mobile and Web Analytics 画面の遷移をヴィジュアライズできて超分かりやすいアクセス解析「Mixpanel Flow」 トップページからどこに行ったのか、っていう画面遷移の情報を次のようなダイアグラムでヴィジュアライズしてくれます。 ヒートマップでどこがクリックされているかという情報って取れますが、これは便利。 トップページからログインのページにいって、何％が離脱したのか？といった情報がすぐに見た目で判断できます カーソルを合わせると１１％が離脱という詳細が分かります。赤くなっている部分が離脱ということで超分かりやすい 更にその先はどうなってるの？と思ったら円をクリックすればその下が詳細に表示されるというものです ユーザの動きをこのツールで理解すれば、サイトとしてどこを改善すればよいのか？が一目瞭然なので、サイトの機能追加や改善といった

phpのserializeを使うより高速でサイズもコンパクトに仕上げる「MessagePack」とPHP拡張 2010年12月15日- The MessagePack Project phpのserializeを使うより高速でサイズもコンパクトに仕上げる「MessagePack」とPHP拡張。 結構前のエントリのご紹介なので知っている人も多いと思うのですがご紹介。 phpには serialize という関数があって、配列等の複雑なデータも文字列にして、ファイル等に保存し、後ほど unserialize 等で変数に戻せて便利なのですが、MessagePackとそのPHP拡張を使えば、より高速で、serialize後のデータも小さくできます。 MessagePack自体はkumofsの内部で使われていて、PHP以外にもc++, erlang, haskell, java, perl, pyth

サーバ監視に超使える〜topコマンドのまとめ サーバを運用しているとよく使うtopコマンドですが、標準のtop以外にも色々便利なものがあるのでまとめてみました。 ボトルネックといえば、ネットワーク、ディスクIO、スワップ、CPU、メモリといったものが関連しますが、ツールで視覚化することでより分かりやすい対策がとれますね。 htop こちらも、通常のtopよりもさらに多数の情報を表示してくれるツール。 CPUやメモリの状態が視覚的にグラフで表示されていたり、複数CPUがある場合もそれぞれに利用率を表示してくれてわかりやすいです。 pstreeで表示するようなツリー+topコマンドのような表示も t を押せば切り替えられます。 公式サイト上にある128コア積んだマシンのhtop結果が面白い。 次のようにすべてグラフで表示されているため、128コアあったとしても瞬時に負荷が把握できますね。 io

Pure CSS GUI icons (experimental) ? Nicolas Gallagher ? Blog & Ephemera ピュアCSSで描画されたGUIアイコンセット。 よくやったなという感じですが、次のようなCSSでかかれたアイコンが出てます。 Firefox 3.5+, Chrome 5, and Opera 10.6でテストされているようです。 ピュアCSS画像エディタ等も今後でてくるんでしょうかね 関連エントリ ピュアCSSで実装された吹き出しのデザイン例色々 ピュアCSSでTwitterのメンテナンスモードのクジラをアニメーションさせる例 ピュアCSSで画像を壁に貼ったポラロイドギャラリー風にするサンプル

Windowsのインストーラみたいな便利なウィザードをブラウザ上で簡単実現できるjQueryプラグイン「SmartWizard」。 2010年11月18日- Tech Laboratory Windowsのインストーラみたいな便利なウィザードをブラウザ上で簡単実現できるjQueryプラグイン「SmartWizard」。 Windowsインストーラーは「次へ」を押していくとどんどんインストールを進められて簡単ですが、それをブラウザ上で簡単に実現してしまえます。 各ページの中身は、単純に<div>で並べるだけというお手軽さ。ルールに従ってHTMLを記述し、$(element).smartWizard() で初期化するだけです。 デモページはこちら タブを左にレイアウトしてもなかなかいい感じ。 デフォルトのデザインはお世辞にもカッコイイとは言い難いのですが、CSSデザインが可能なので、自由にスタ

Baker Ebook Framework HTML5による電子書籍発行フレームワーク「Baker」。 HTML5で、768px幅固定でページを作っていって、HPubフォーマットでファイル一覧をアーカイブします。 これをBakerフレームワークを落としてきてXcodeで開き、データを入れてコンパイルするって流れのようです。 HTML5ということで、画像を固めたものよりインタラクティブなことができそうですね。 サンプルで配布されているBookも落として見ましたがなかなかいい感じでした。 関連エントリ ブログを電子書籍形式(ePub)に変換できるWordPress3のプラグイン「Anthologize」

WEBベースでVirtualBoxを使った仮想マシンの操作が行える「phpvirtualbox」 2010年07月21日- phpvirtualbox - Project Hosting on Google Code WEBベースでVirtualBoxを使った仮想マシンの操作が行える「phpvirtualbox」。 VirtualBoxとは、VMWareのような仮想プラットフォームで、ゲストOSにLinuxとかWindowsとかを入れられるわけですが、こうした操作をブラウザベースでPHPをフロントエンドとして実装されたものがphpvirtualboxです。 AmazonのEC2のように、ブラウザ上からインスタンスをインストールして新しくOSを起動したり、データのスナップショットをとったりと、かなりのコントロールが可能になっているようです。 メインのインタフェース VMの設定 仮想メディア管

Open-source PHP/XUL application client-server framework - SiteFusion PHPでXULによるGUIアプリケーションが作れる仕組み「SiteFusion」というものがあるみたいです。 動作原理としては、サーバ側でPHPがJavaScriptのコードを出力し、クライアント側で、JSコードを解釈してGUIアプリケーションにみせるというものです。 PHPによって別言語のコードを吐いてリッチなGUIアプリを作るというのはなかなか面白いですね。 Hello World は次のようなコードになるそうです。 関連エントリ PHPでGUI - スタンドアロンアプリケーション作成方法

Writing an OAuth Provider Service - Rasmus' Toys Page PHPで作るOAuthプロバイダ作成サンプルコードがPHPファウンダーのRasmus氏によってエントリ化されてます。 Twitterみたいに、開発者向けにOAuthプロバイダを公開してAPIでサイトの機能を公開する際に使えるので覚えておくと便利かもしれませんね。 peclのoauthエクステンションによって実行できるので、インストールも楽チンで、インストール後はコードを元に比較的容易に実装できそうです。 関連エントリ PECLのoAuthエクステンションを使ってPHPでTwitterにログインするサンプル例 PHPからOAuth認証が出来るPEARライブラリ「HTTP_OAuth」

ドロップダウンメニューにテーブルやフォーム等何でも埋め込んでしまえるjQueryプラグイン「MegaMenu」 2010年05月19日- Plugins | jQuery Plugins ドロップダウンメニューにテーブルやフォーム等何でも埋め込んでしまえるjQueryプラグイン「MegaMenu」。 ドロップダウンメニューといえば、複数のアイテムが表示され、クリックするとページ移動するというのが普通の動きですが、ドロップダウンメニュー内に好きなコンテンツを入れこんでしまうことが出来るのがMegaMenu。 一見何の変哲もないナビゲーション マウスオーバーすると、テーブルコンテンツがアニメーションしながら表示されます。 フォームだって埋め込んでしまえます。ログインフォームなんかを置くといいのかも リストも次のように綺麗に表示されます。リンクを貼って普通にメニューのように使うことも出来ますね。

10 sql tips to speed up your database プログラム内のデータベース処理高速化TIPSが10個紹介されているエントリのご紹介です。 SQLが適切に設計されていないとすぐにデータベース処理がCPUを圧迫してしまいますので可能な限り知っておきたいですね。 基本的な事から応用的な事まで参考になりそうだったのでメモ程度にご紹介。 explainでインデックスが使われているかを調べる 最も速いクエリは、クエリを発行しないこと、ということでデータをキャッシュしよう Memcached, CSQL Cache, AdoDB などでそれが可能 必要じゃないモノをselect しないようにする select * from table; ↓ select id from table; limit を使って取得する結果を少なくする foreach ループなどの中でsqlクエリを

Shine - Icon Eden すっきり綺麗なWEBに使えそうなアイコンセット「Shine」。 次のようなアイコンセットが公開されています。 ウェブ用というわけではないですが、ウェブサイトに使えそうな多くのアイコンが収録されています。 あまり他では見たことの無いようなものを使いたいという場合によいかも。 次のような形式で配布されており扱いも容易です。

20 Fresh JavaScript Data Visualization Libraries とても綺麗なグラフ等を描けるフレッシュなJavaScriptライブラリが色々と最近になってもリリースされていますね。 サムネイルだけ見ても、JavaScript でやってるの？というような綺麗なものが多いです。すでに紹介したものもあると思いますがご参考までに。 Highcharts gRaphaël JavaScript InfoVis Toolkit JS Charts Bluff Timeline データをビジュアライズしたい際の参考になりそうですね。 関連エントリ JavaScript用のグラフ描画ライブラリ色々

Twitterのようにスマートな通知バーを一瞬で実装できるjQueryプラグイン... 次の記事 ≫：JavaScriptでどうしても外部のドメインのコンテンツを読みたい際に使え... xmoovStream PHPで動画のストリーミングサーバを作れるフレームワーク「xmoovStream」。 ちょっと無茶な気もしますが、PHPでストリーミングの振る舞いを変えられ、カスタマイズも可能なところが魅力です。 動画プレイヤー、MP3プレイヤーが付いており、これを使うだけでも便利そうです。 使い方ですが、「xmoov.php?file=FLVファイル&position=開始したいポジション」のようにプレイヤーから呼ぶとランダムアクセスなどによるストリーミングが可能のようです。なんと帯域の制御なんかも可能みたいです。 動画だけでなく、MP3などの再生もでき、プレイヤーも標準で付属しています。 このプ