HTML5 Canvasを利用した冷気の演出が話題となった「RAIZIN JAPAN」のデモサイト。エキスパートが手がけたプロダクトを題材に技術的な解説を行っていくシリーズ第二弾は、RAIZIN Coolの実装を徹底解説します。 HTML5 Canvasを利用した簡易的な冷気の演出 最近の仕事で実装したものが海外の、しかも米シリコンバレーで話題になりました。 社内でもそうした簡単にできる(けど簡単そうに見えない)簡易的な実装に注目が集まり、ちょっとした話題になったので解説しつつ紹介したいと思います。 ※今回の解説用に、jsdo.itに実際に動くサンプルをアップしました。 さらに今回の解説用に特別に動作が分かりやすくなるオプションも追加しています。↓ (invalid jsdo.it code) 今回紹介するのはRAIZINというエナジードリンクの新バージョン「Cool」のLPです。 当初は
![RAIZIN Coolで学ぶ、イマドキのWebサイトの作りかた](https://cdn-ak-scissors.b.st-hatena.com/image/square/719c558a50a1e69c87ed69ec31065169803b9795/height=288;version=1;width=512/http%3A%2F%2Fhtml5experts.jp%2Fwp-content%2Fuploads%2F2013%2F07%2Fmask.png)