アニメーションの美しいポートフォリオサイト – creamu
HTML5でサイトを作りたい。 そんなときに参考になるのが、「S5 Style」。アニメーションの美しいポートフォリオサイトです。 shogo Tabuchiさんというデザイナーの方のサイトですね。アーキタイプさんにいらっしゃるようです。 Processing.jsを使って、canvas内に描画しているようですね。Processing.jsは、jQueryの作者であるJohn Resig氏が公開したライブラリで、amachangさんの以下のエントリーに詳しく書かれています。 ブラウザでお絵描きプログラミング！ Processing.js 登場！ 簡単な描画ならすぐにできるようですね。ソースも読みやすいです。 サイトには音もついていて、サウンドデザイナーのCubic Roomさん作とのことです。こういうコラボは素敵ですね。 Flashサイトではない、新しい技術の参考になると思うので、一度見て
要約: Apple iPhone5のページのJPEGとJSとcanvasタグによるビデオの実装がやばいという話
2012 年 9 月 26 日 追記しました。 要約エントリー。 元記事 : iPhone 5 website teardown: How Apple compresses video using JPEG, JSON, and <canvas> アップルのサイトの iPhone5 のページにある「スライドしてアンロック」のアニメーションが、信じられない実装になっている、という話。簡単に要約してみた。（ミスなどの指摘は @lowply までお願いします） もともと h.264 と WebM の動画フォーマット戦争でブラウザ互換性の問題がまだ残っている上、iPhone などは「再生ボタン」を押さないと再生できなかったりするので、こうした短いアニメーションに video タグを使うことは最適解ではなかったらしい。 そこで発想の転換をして、Retina MBP のページでは、蓋が開くたった 2
Canvas - HTML5.JP
このコーナーでは、JavaScriptから図を描くことができるCanvasについて解説します。 Canvasとは Canvasとは何か、そしてCanvasで何ができるのかを事例を踏まえて分かりやすく解説します。 Canvasの使い方 実際に、Canvasをどうやって使いこなすのかを、サンプルを通して解説していきます。 いろいろな図形を描く Canvasでは線を引くだけではなく、さまざまな図形を描くためのメソッドを用意しています。このコーナーではCanvasで利用できる図形描画のいくつかをご紹介します。 色を指定する このコーナーでは、Canvasで描く図形に色を指定する方法を紹介します。またCanvasでは指定した色に透明度を与えることも可能ですので、その方法についても紹介していきます。 線形グラデーションを指定する このコーナーでは、Canvasで描いた図形にグラデーションを指定する方法
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
