How to convert MMD files to JSON for three.js | Yomotsu net
I published a video, which is explaining the way to convert MMD files ( PMX and VMD ) to a JSON file for three.js. Here is it. The convert was operated on Blender. Preparation Check the language setting at preference to display Japanese characters. Install and activate following addons mmd-tools io_mesh_threejs Load MMD files Load a PMX file Select all bones Load a VMD file Bake Actionsome bones o
Chrome で WebGL が動かなくなった | Yomotsu net
Windows 8.1 で、Chrome が自動アップデートされ、Chrome 32 になっていました。すると、昨日まで動いていた WebGL のコンテンツがうまく表示されなくなってしましまいました。例えば新しい Google Map では WebGL が利用されているのですが、これを表示しようとすると次のように Chrome が停止してしまいます。 Chrome では、URL バーに about:gpu と入力すると現在の GPU アクセラレーションの状態を確認できるのですが、問題が起こる環境では次のようにほとんどの項目について GPU が無効となってしまっていました。昨日、つまりアップデートされる前までは何事もなかったのに！ Khronos Web サイト内の表示テストでも WebGL が停止中と認識されています。 一方で、同 PC 上の IE 11 では、何の問題もなく表示テストをク
Behind The Scene of "WebGL でクリスマス" | Yomotsu net
昨日公開した作例 Santa’s Boxes! の内容をざっくりまとめました。 Ground 去年のアドベントカレンダーに書いた内容をそのままで、ディフューズ マップを変更して雪原を作りました。three.js の機能でバンプ マップを適用したところ、IE 11 でレンダリングできなかったため、ディフューズ マップのみ適用しています。 単品 demo Skybox three.js で cube ジオメトリーを作成し、スカイボックス用のディフューズ マップを適用しているだけです。立方体の内側を表面として表示するためには material の side プロパティーに THREE.BackSide を指定します。 スカイボックス用に利用したテクスチャーは以下のような、シームレスな 6 面になっています。 単品 demo Snowing 雪は THREE.ParticleSystem を用いて
WebGL でクリスマス | Yomotsu net
Graphical Web Advent Calendar 2013の 1 日目ということで、クリスマスを感じる風景を three.js と cannon.js を使いながら作りました。 Play Santa’s Boxes! WebGL に対応している Web ブラウザーで楽しんでみてください。もちろん、IE 11 でも（パーティクルは除いて）動きます。 W, A, S, D キーまたは矢印キーで操作することができます。 明日はこの demo の技術解説を書こうと思います。 Akihiro Oyamada (a.k.a yomotsu) I'm a Web-Front-End-Engineer, as well as a Microsoft MVP for Internet Explorer since 2011 to 2017. Playing with CSS3, SVG, WebG
Web フォントとライセンス | Yomotsu net
Web フォントを利用する際、技術として理解するだけでなく、フォントに適用されたライセンスを理解しておくことも大切です。 特に和文フォントにおいては SIL Open Font License (OFL) mplus Font License IPAフォントライセンスv1.0 あたりを適用されるケースが多いようです。また、これらのいずれかのライセンスが適用されていれば Web フォントとして利用することができます。ただし、ライセンスによる指示に従う必要があります。 ##各ライセンスの要点 ###SIL Open Font License (OFL) OFL であることを明示すればほぼ自由に Web フォントに利用できます。ライセンス明示方法は後述。 ###mplus Font License ほぼ自由に Web フォントに利用できます。ライセンス明示方法は後述。 ###IPA フォントライ
CSS Shaders はじめの一歩、CSS Filter を知る | Yomotsu net
GraphicalWeb Advent Calendar 2012 の 6日目の記事です。 CSS Shaders は、利用することでこれまでの CSS の表現ではできなかった、要素に対する複雑な変形を行うことができます。例えば、サイン波を利用して次のような変形が可能です。 まずは CSS Shaders の書き方を知る前に CSS Filters についても少し知っておきましょう。 CSS Filters とはSVG にあった Filter 機能を整理した新しい仕様、Filter Effects 1.0の草案が現在 W3C に提出されています。この中には CSS のインターフェイスとして用意された filter プロパティーも含まれています。 CSS Filter とは特にこの filter プロパティーを指します。 CSS の filter プロパティーには値として指定できる関数がいく
TweenJS と描画系ライブラリーの組み合わせ | Yomotsu net
GraphicalWeb Advent Calendar 2012 の 25日目の記事です。 CreateJS を構成するライブラリーの一つに、TweenJS があります。TweenJS は、アニメーションのタイムラインや tween を仕込むことができる機能を有しています。 EaselJS と TweenJS の組み合わせCreateJS を構成する EaselJS と TweenJS を組み合わせてアニメーションを実現するなら、次のようなコード (抜粋) で可能です。 createjs.Tween.get( circle, { loop: true } ) .to( { x: 300 }, 1000, createjs.Ease.quadOut ) .wait( 300 ) .to( { x: 100, y: 300 }, 1000, createjs.Ease.quadOut ) .
なぜ HTML5 を使うのかを考えよう | Yomotsu net
Web 制作の現場にも HTML5 が浸透し始めてきました。では、なぜ HTML5 を使わなければならないのかを考えてみましょう。 なぜ HTML5 が求められるのか最近、Web を取り巻く環境は多様化し、プラグインをサポートしていない Web ブラウザーの普及、画面サイズの多様化、Web アプリケーション構築など、従来の Web ページには求められなかった様々なケースへの対応が必要になりつつあります。 こうした、従来の Web ページにはなかった特性を実現するためには新しい技術が必要になります。これが HTML5 やその周辺技術というわけです。当然ながら新しい技術なので、古いブラウザーはこれらに対応していません。 Web ブラウザーは家庭用ゲーム機と似ている世代ごとの Web ブラウザーはゲーム機に例えるとわかりやすいでしょう。 現在、私たちは家庭用ゲーム機で高度なグラフィクスのゲームソ
レスポンシブ・ウェブデザインでの CSS コードの書き方 | Yomotsu net
いわゆるレスポンシブ・ウェブデザイン、つまりメディアクエリーを採用した Web サイトを構築する際の一番管理しやすいと感じるコードの書き方をまとめました。ただし、あくまでも個人的な、経験から感じた意見ですので絶対ではありません。 CSS のコードの配置広く知られている方法はいくつかあります。 CSS ファイル自体を分ける方法 @media 規則で 1ファイル内にメディア特性単位に書く方法 @media 規則で 1ファイル内にパーツ単位で書く方法 それぞれをコードで表すなら以下の書き方が該当します。 方法1 : CSS ファイル自体を分ける方法この方法は管理が大変でおすすめできません。これでファイルごとコード分割されてしまったらコード検索しづらいわけです。 <link rel="stylesheet" href="desktop.css" media="(min-width:769px)">
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
WebFonts として利用できるフリーの和文フォント | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
demos
HTML5 DOCTYPE parsing of HTML elements audio video video (customized) canvas SVG CSS3 Selectors Media Queries Color Values and Units Backgrounds multiple size Borders Fonts SVG1.1 Basic Shapes Line Cliping Masking Transformations translate scale rotate skew Document Structure CSS Interactivity IE6 HTML5 audio / video CSS3 selecor border-radius and shadow SVG1.1 object element
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
