IDEA * IDEAドットインストール代表のライフハックブログ
chrome-life.com - このウェブサイトは販売用です！ - chrome life リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
「Ai→Canvas」イラストをHTML5形式に変換する画期的プラグイン 【増田@maskin真樹 | TechWave（テックウェーブ）
[読了時間:1分] 米Microsoftが運営するMixOnlineが10月12日、アドビ・イラストレーターのファイルをHTML5のCANVAS形式にエクスポートできるプラグイン「Ai→Canvas」を公開した。CANVAS形式で表現されたイラストは拡大縮小はもちろんアニメーションを施すことなどが可能になる。 プラグインインストール後、イラストレーターの「書き出し」コマンドを実行するとCANVAS形式を選択できるようになる。書き出されるのはHTMLファイルで、ベジェ曲線はそのままビットマップ画像はファイルとして保存される。対応ブラウザで表示することができる。（以下参照） 上のスナップショットでCANVAS変換したベジェのみで作成されたイラストを以下で公開している。 http://blog.metamix.com/sample/NAOC_LOGO_Illustration.html ソースを
「HTML5 Rocks」だけじゃない、ブラウザ各社のHTML5チュートリアルを集めました
Webブラウザを提供する主なベンダ、グーグル、マイクロソフト、モジラ、オペラ、アップルらは、HTML5への対応を急ぐと同時に、相次いでHTML5の魅力や内容をデベロッパー向けに紹介するサイトを開設しています。この記事では、それらをまとめて紹介することにしましょう。 グーグルの「HTML5 Rocks」 グーグルは6月22日に開発者向けにHTML5を紹介し、学習するためのWebサイト「HTML5 Rocks」をオープンしました。 HTML5 Rocksは現在3つのコーナーに分かれています。 1つ目は「Interactive Presentation」。これはHTML5の新たなAPI、DOM APIやLocal Storage、WebWorkerなどさまざまな機能を紹介するプレゼンテーション。機能と共にJavaScriptでのコーディング例や実際に動作するデモなどが用意されており、HTML5の
JavaScript + CanvasでActionScript3のような描画·CanvasScript3 MOONGIFT
CanvasScript3はHTML5/JavaScript製のオープンソース・ソフトウェア。HTML5とFlashによる次世代標準の覇権争いが続いている。HTML5は現状のFlashでできることをどんどんと浸食しており、今後開発されるサイトについてはFlashの選択が減ってくる可能性がある。 オブジェクトが回転する Flashが得意とする分野の一つにアニメーションがある。HTMLやJavaScriptでアニメーションを作ろうというのは相当大変な思いをしそうだ。だがHTML5になって機能が増えることで状況は変わってくる。それを垣間みれるのがCanvasScript3だ。 CanvasScript3はCanvasとJavaScriptを使って、アニメーションを実現するライブラリだ。マウスの位置によって動作速度を変えるオブジェクトや爆発するようにオブジェクトが広がって跳ね返るサンプルなどが公開
福岡で開催されたHTML5カンファレンスに参加してwebの新しい世界を体験してきました
OperaやChromeなどいくつかのブラウザでは既に使用可能となっている2012年3月頃に正式勧告予定のHTML5。そのHTML5関連技術やweb標準について福岡で開催されたカンファレンス「HTML5 Tech Talk @Fukuoka」に招待されたので参加してきました。HTML5に追加されたaudio要素、video要素、canvas要素などの新しい機能やAPIについて多種多彩なデモを交えたスピーカの方々の講演でHTML5の新しい世界に触れることができました。 「HTML5って何？」、「実際どんなことができるの？」、「動いているサンプルを見てみたい」と感じている人もいるのではないでしょうか。そこで、著名な専門家の方々が今回の講演で用いたスライドやデモプログラムを紹介したいと思います。 詳細レポートは、以下から。開場前の様子。机といすが整然と並べられているだけでガランとしています。 会
www.webmproject.org
WebM: an open web media project The WebM Project is dedicated to developing a high-quality, open video format for the web that's freely available to everyone. Learn more » WebM Project joins the Alliance for Open Media Cisco, Google, Intel, Microsoft, Mozilla and Netflix join forces on open media formats … More » Codec Developers WebM is an open-source software project that anyone may participate
HTML5＋JavaScriptでビデオエフェクターに挑戦！ (1/6)
HTML5ビデオエフェクターのサンプル。左側の動画にリアルタイムでエフェクトを加えて再生する。画像クリックでサンプルページを表示します（Firefox 3／Opera 10／Safari 4で表示可能） HTML5で追加される新機能の中でも、特に華やかなものといえば「Video」と「Canvas」でしょう。本連載でも、HTML5 Videoを使った3D動画プレーヤーやCanvasを使ったペイントツールなどを作成してきましたが、今回はこの2つの機能を組み合わせて「ビデオエフェクター」作りに挑戦します。 ひとくちにビデオエフェクターといっても、アドビ システムズの「After Effects」のように事前にレンダリングしてムービーを作成するアプリケーションから、アップルの「Motion」のようにムービーを再生しながらエフェクトを処理するタイプ、さらにはVJ (Video Jockey/Visu
SVGは普及する。WebデザイナーはCSSとともにSVGが必須科目に
Internet Explorer 9では、Webブラウザ上にベクター形式で画像を描画できるSVG（Scalable Vector Graphics）のサポートが表明されています。ITproの記事「IE9の登場で画像フォーマットの本命に浮上するSVG」では、IE9がSVGをサポートすることでSVGの普及が始まるのではないかと予想しています。同意します。 SVGはHTML、CSS、JavaScriptと並ぶWebの要素に SVGは2001年にバージョン1.0、2003年にバージョン1.1がW3Cの勧告として策定されました。しかしマイクロソフトはIE6、IE7、IE8とずっとSVGに対応せず、一方でSVG策定以前から同社などが推進していたVML（Vector Markup Language）と呼ばれるベクター形式の言語を実装してきました。 Webブラウザで最大シェアを持つIEで使えないSVGは
5 Must See HTML5 Sites
With the release of the iPad, HTML5 technology has recently come into the spotlight. The format that will likely kill Adobe’s Flash is a lot of fun to use, but we’ve not seen much of it yet. The good news is that you don’t have to wait until the iPad is in your hands to see what HTML5 can do. If you have a compatible browser, there are already a wealth of sites that show off the capabilities. F
HTML5 videoとjQuery UIでパノラマ動画プレーヤー (1/3)
スライダーで視点を変えられる360度動画。画像クリックでサンプルページを表示します（Safari 4、Opera 10.50でのみ表示可能） Flash Playerなどのプラグインがなくても、ブラウザー上で動画を再生できるHTML5 video。前回の記事では、HTML5 videoで動画を表示・再生する方法を解説しました。今回は、360度動画が撮影できるカメラ「bloggie（ブロギー）」で撮ったパノラマ動画を素材に、スライダー操作で視点を切り替えられるパノラマ動画サイトを完成させましょう。 HTML5 videoをJavaScriptで制御する ブロギーで撮った360度動画は、以下のような横長の1枚の動画になっています。 パノラマ動画サイトのサンプルは、360度ぐるりと見渡せる動画にするため、この横長の動画を2つ、水平に並べます（同じ内容のvideo要素を2つ用意する）。2つのvid
JavaScript処理をバックグラウンドで実行する方法 | エンタープライズ | マイコミジャーナル
Robert’s talk Robert Nyman氏がUsing HTML5 Web Workers to have background computational power - Robert's talkにおいて、Web Workersの実装例を紹介している。短くてわかりやすいサンプルコードが掲載されておりWeb Workersを試してみたい場合の最初の取っ掛かりとして取り組みやすい。 Web WorkersはHTML5とともに策定が進められているJavaScript API。JavaScriptファイルをダイナミックに読み込みバックグラウンドで処理を実施する。UIとは別のスレッドで動作する。特徴的な動作や仕組みまとめると次のとおり。 Web Workersの特徴 JavaScriptファイルを読み込んでバックグラウンドで処理を実行する。 別スレッドで動作するため、マルチコアの性能
Webブラウザで動画編集！ - Yanagi Entertainment
html5で videoの任意のフレームをcanvasに描画するメモ - 超自己満足プログラミング http://d.hatena.ne.jp/favril/20100225/1267099197 昨日この記事を見て、これはすごい！ すごいすごい！ ってなって、これができるんならWebブラウザだけで動画編集できるんじゃね？ と思ったりしたので、ざっくり作ってみました。 http://yanagiatool.appspot.com/jsvideo/player.html （MacのSafari4で動作確認。QuickTime + ChromeならWindowsでもいけるかも？） あそびかた 「動画を読み込む」ボタンを押すと、テキストボックスに入ってるurlの動画を読み込みます。「state」って書いてあるところが「stand by」になったら「再生 / 停止」ボタンを押してください。 あとは
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
日本語で学べるHTML5関連資料15個まとめ : 二十歳街道まっしぐら
http://www.designwalker.com/2010/06/html5-template.html