Site en construction Besoin d'assistance ou d'informations ?
Web制作に携わっていると頭を悩ませる項目の一つが「Flash」への対応。 動きのあるコンテンツを作成するにはやはりまだまだFlashが便利なわけですが、iPhoneをはじめとするiOSでは再生できない(一部再生できるブラウザアプリはありますが)ので、困った困ったなのです。 そこで次代を担う(であろう)コンテンツがHTML5を使用したムービー。 先日も、「Form Follows Function」と言うHTML5で作られた、動きのあるコンテンツを紹介したWebページをご紹介したばかりですが、ここまで複雑なものは出来なくとも、私のような初心者でも超簡単にHTML5アニメが作れると噂のMacアプリ、HypeをDLして使ってみました。 タイムラインを使って簡単にHTML5アニメを作れる! 起動。 Welcome to UNDERGROUND… 「Watch Getting Started Vi
「HTML5の捉え方が人によって異なるため、議論していてもまったく別のものを指してHTML5と言っている場合がある」と前置きする森田氏は、「今回のディスカッションでも一定のリテラシーを決めて行ったほうがよい」と話す。そのうえで、HTML5のおおよその歴史を次のように説明する。 W3C(World Wide Web Consortium)がXHTMLを策定してXHTML2の勧告を目指していたがなかなか進まなかったWHATWG(Web Hypertext Application Technology Working Group)がWA1(Web Applications 1.0)とWeb Form2を策定したW3CがXHTML2の策定を諦めてWA1とWeb Form2を採用してHTML5 WD(Working Draft)として発行した一方で、大多数の現場的歴史観は異なると森田氏は説明する。X
HTML5 Face DetectionはHTML5を使って動画から顔をリアルタイム認識します。 HTML5はどこまで行くのか、それを改めて思い起こさせる凄いソフトウェアがHTML5 Face Detectionです。何と動画の顔認識をリアルタイムに行ってしまいます。 デモ動画です。上が動画、下がそれを解析して顔認識しているものです。 顔を動かしても付け目がね+鼻が追いかけてきます。 筆者トライの図。Glassesをタップすると認識処理が開始されます。 デモ動画 HTML5 Face Detectionは動画のフレームを読み込み、JavaScriptで顔認識をした後、Canvasタグに鼻眼鏡とともにレンダリングしています。はっきり言ってかなり重たいのですが、技術的にはとても面白いソフトウェアです。 HTML5 Face DetectionはHTML5/JavaScript製のソフトウェア(
モバイル用Flash Player開発中止でゴノレゴさんがアドビにブチギレ? 作者のポエ山がアドビ本社の担当者を直撃 昨年5月、『ゴノレゴさんがア○プルに問い詰めたいことがあるようです』という動画が『ニコニコ動画』に公開され、話題になりました。アップルがiPhone/iPadでFlashを再生できなくしていること、Flashから書き出した『AIR』アプリも規約で禁止したことに対して、ゴノレゴさんがアップルにブチギレするという内容。その後アップルの規約変更により『AIR』アプリが動作することになったのですが、今度はゴノレゴさんがアドビに問い詰めたいことがあるようです。ガジェット通信は、作者であるクリエーターのポエ山氏と米Adobe Systems社のFlashプラットフォーム主席プロダクトマネージャーであるMike Chambers氏の対話の場をセッティング。ゴノレゴさんの怒りとユーザーとし
はじめましてこんにちは。 KRAYアルバイトの浅海です。 html5のcanvasを使ってお絵かき投稿サイトを作ってみようと思います。 初めてブログ記事を書くということで気合が入りました。 ちょっと長めですがお付き合い下さい。 機能 お絵かき投稿サイトの必要最低限な機能って? ざっと下のような機能を入れてみます。 絵を描ける 絵を消せる 描画を一回分戻れる 線の太さを変えられる 線の色を変える 絵を投稿できる 投稿された画像の一覧を表示できる → 完成見本はこちら完成見本の公開は終了致しました。 絵を描ける HTML5のcanvasにマウスの軌道に線を引いていくわけです。 canvasでのマウス軌道の描き方は、 ・mousemoveイベント発生時に点をプロット という手段が真っ先に思い浮かぶと思いますが、これは、以下の様になります。 これではお話になりません。 なので、点ではなく線を引くこ
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
2011年09月30日01:30 カテゴリLightweight Languages DHTML - 最低限文化的なスライダーの実装 デザイニング・ウェブインターフェース Bill Scott / Theresa Neil 浅野紀予・高橋信夫訳 [原著:Designing Web Interfaces] たかがスライダー、されどスライダー。 [追記:IE対応しました]RANT スライダーって便利ですよね。 スマートフォンやタブレットなどのタッチデバイスだとなおのこと。 HTML5では、<input type="range">だけで出来てしまいます。こんな風に。 50/100 モダンなPCブラウザーならすでにサポートしてたりします。 ところがこれ、まだiOSもAndroidも現状未サポートなのですよorz。FireFoxも。iOSは5で対応しましたが。 というわけで必要最小限で、かつタッチイ
2013年3月23日 HTML, Webサイト制作 HTML5を勉強していて、section, nav, header, footerなどの新しく追加された要素について説明している記事はよく見かけるのですが、HTML5で変更された要素について触れている記事が少ないように感じたので、よく使うものを中心にちょっとまとめてみます。既存のWebサイトをHTML5化する時は、コンテンツ内に変更された・または廃止された要素がないか確認することも大切ですね! ↑私が10年以上利用している会計ソフト! HTML5の基本はここからお勉強! 「ところでHTML5ってなに?」という方は、まずは以下の記事を読んでみてください。このようにHTML5の基本について解説している記事はたくさんあるので、詳しい説明は今回は端折らせて頂きます。変更点のみに焦点を当てますよ! Webの3つの問題を解決する「HTML5」とは何な
1 pixel|サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 サイバーエージェントでフロントエンドの開発をしております 原(@herablog) です。 スマートフォン版 アメーバピグ新規作成で使用した技術について触れたいと思います。 #ちなみにこの記事ではHTML5を「最新ブラウザ向けのwebアプリケーション作成技術」というかなり広い解釈で使用していますので予めご理解ください。 今までDesktop・Android向けはFlashで作成されていたのですが、今回はiOS, Androidともに対応したいということで、HTML5でできるところまでやってみることにしました。 No Lag作るにあたり
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
日曜日ですしお盆ですし、ということで軽めの 話題でも。米DIESELのデニム特設サイトが HTML5で作られているんですが、この出来 が凄くよく出来ていたのでシェアしようと思っ てご紹介します。こうして大手の企業が先手 をきって導入すると敷居が下がる気がします。 HTML5製のWebサイトはもう既に珍しくないくらいですが、DIESELのコンテンツは落ち着いていて個人的に好みでした。どうしてもファッション系サイトなので多少派手さはありますが・・その割には無駄な動きも無く、動作も軽量で実用的だなと感じました。 素敵なレイアウトですねー。個人的にはグリッドレイアウトばかりなのでこういったユニークなレイアウトに憧れたりします。 コンテンツは斜めに配置されていますが、クリックすればスムーズに回転してまっすぐになってくれます。 スライドもクールなエフェクト。斜めに切り替わっていきます。PDFとしてダウ
アニメーションといえばFlashやJavaScriptが主流でしたが、CSS3の登場でアニメーションを手軽にウェブサイトに利用できるようになってきました。 CSS3アニメーションを使った実用的なテクニックから、実験的なすごい作品までを紹介します。 対応ブラウザはほとんどのものがChrome, Safari, Firefox4となっています。 ※デモページは明記がないものは全てFirefox4での表示です。
The web is constantly evolving. New and creative websites are being created every day, pushing the limitations of HTML in every direction. HTML4 has been around for nearly a decade and now its time to move forward. To give authors more flexibility and interoperability, HTML5 is proposed as the next major revision of HTML. It works on just about every platform, is compatible with older browsers, an
HTML5花火大会が始まりました! jsdo.itに集まった400以上の花火コードが、夏の夜空に打ち上がっています! 本当にどの花火もクオリティーが高くて、見るだけでも楽しめます。 HTML5花火大会 花火のコードから学ぶcanvasの表現力 花火のコードの大半はHTML5のcanvas要素を使って描画されています。 canvasってなんだっけ? javascriptから自由にグラフィックを描画できる要素です。 以下のエントリーにわかりやすくまとまっています。 図を書き込めるhtml要素です。 OpenGLやDirectXのような面倒な設定を書くことなく、 手軽にグラフィック描画が行えます。 ブラウザだけでローカルアプリケーションのような グラフィカル(かつ動的な)表現が行えるわけです。 今更聞けないcanvasの基礎の基礎 canvasで花火を描くには? 花火のお手本コードから見ていきま
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く