Webページ上にアニメーション演出を組み込もうとする場合、今ではJavaScript（jQuery）やCSS3など、実装方法がいくつかありますがHTML5でのアニメーション動作を簡単に作成することができる気になる便利ツールが2点ほどあったので自分用メモとして紹介してみます。Google Web DesignerGoog…

HTML5では＜video＞タグや＜audio＞タグといった新たなタグを使って今までよりもWebサイト上に動画や音声ファイルを手軽に組み込むことが可能になります。そんなHTML5とjQueryを組み合わせて、Webページ上に簡単にミュージックプレイヤーを組み込むことが出来る「HTML5 Music Player」がおも…

jQueryを使って簡単にHTML5のcanvasが操作できてしまう、というプラグイン「jCanvas」がちょっとおもしろそう且つ、活用できそうだったので紹介してみます。jCanvas≫jCanvasjQueryファイルと、この「jCanvas」プラグインファイルを読み込むことでjQueryスクリプト操作でcanvas…

jQueryを使ってサイト内にギャラリーなどを組み込んだ際、画像を切り替える際に、フェードやスライドなど様々なエフェクトを掛けることが可能ですが、jQueryと＜canvas＞を使ってカメラのシャッターを切るような動きを付けて画像を切り替えることが出来るチュートリアル「Shutter Effect Portfolio …

通常、Webページ上のソースを見る際には、ブラウザ操作から「ソースを表示する」をいったメニューを選択しますが、ページ上に設置したボタンをクリックさせることで、表示しているページのHTMLソースをモーダルウィンドウ風にポップアップにて表示することができる「Make a 'View Source' Button」がちょっと…

HTML5で作られたゲームサイトは最近よく見かけますが、その中でも特に目を惹く、ビリヤードゲーム「Agent 008 Ball」のご紹介。Agent 008 Ball≫Agent 008 Ball操作はマウスのドラッグ等で行い、2分間で15個の球をいくつ落とせるか競う構成になっています。（ゲーム結果（点数）をTwitt…

以前、jQueryを使ってページをめくるような演出をつけるプラグイン「ページをめくる様な演出を実装できるjQueryプラグイン「Viewbook」」を紹介しましたが、HTML5の＜canvas＞で同じようにページをめくる演出を付けるチュートリアル「Page Flip Effect from 20thingsilearn…

Webサイトを集めたギャラリー系のサイトは、デザインやUI、演出などなどWebサイトの構成を考える時や、探し物をする時などにもとても参考になります。そんなギャラリー系Webサイトをまとめたエントリー「35 Specialty Galleries for Your Design Inspiration」がいろいろ情報が盛…

ブラウザやスマートフォン（Android）の進化によって、徐々に日の目を見るようになってきたHTML5。すでにHTML5をサイトに組み込んで今までにない演出をしているサイトもちらほら見かけますが、HTML5で可能な視覚的効果やさまざまな技術をさまざまな形で実験し、ラボ的サイトとして情報を公開している「HAKIM.SE」…

HTML5とCSS3の参考になりそうな紹介ブログやサイトを自分用メモとしてあれこれ残してきたものがまとまりきらなくなってきたので、ここに情報を残す意味としてまとめて紹介してみます。HTML5やCSS3を勉強するために役立ちそうなサイト（ブログ）のまとめ。Awesome HTML5 and CSS3 Showcase D…