コンテンツ開始

2013年03月31日


DAZ3D : 64ビットの DAZStudio4.5 PRO の使い初め / ドラゴン・スレイヤー( Genesis 女性版 )  



ずっと32ビットの DAZStudio の 4.0 を使ってましたが、とても問題が多かったです。ですが、なんとか騙し騙し使えるレベルだったので今まで我慢して来ました。それに、新しいソフトは半年くらい経ってやっと安定するものですし。

64ビットのたかだか16Gメモリですが、DAZStudio も 4.5 ですし、ダウンローダもとても性能が良く、やっと他人に勧める事のできる段階です。



ただ、DAZ3D はやはりマイナーで、どうも DAZStudio でイラストを創ろうとしている人は見かけません。日本はやたら自力で描く人が多いせいもありますが、DAZ3D を使っている多くのユーザは『ピンナップ』か『動画』のようです。

Google 画像検索で DAZ3D と入力しても、自分の作品以外はそんな感じです。


(結構な数がウチの子)

あ、でも WEBページのタイトルに『DAZ3D』と明示していないと検索にはなかなかひっかからないようです。あちこちで投稿してるんですが、それにはあまりタイトルに『DAZ3D』って入れないし、何故かブログに貼ってタイトルに『DAZ3D』ってはっきり入れた画像だけがかなりの数で表示されます。それと、画像の雰囲気的に日本人が作ったのはあまりなさそうです。

要するにマイナーなんでしょうね・・・。
( 普通の検索でも、全くアクセスの無い自分の tumblr が2ページ目トップとか・・・ )

ちなみに、DAZ3D( DAZStudio )と言えば  Kotozone さんの 操・活・解 というブログです。本来、DAZ3D が解説するような情報はここでかなり手に入ります。

Genesis Starter Essentials 1.11



ウチは Windows です。こいつの exe を最初にインストールして、購入済のパーツをインストールする前にこれだけで性能を試してみました。

この『Genesis Starter Essentials 1.11』には相当オブジェクトを読み込む『ドラゴン・スレイヤー・シーン』ってのが付属しています。オリジナルは男性モデルな上にポーズがショボいのでカスタマイズしてレンダリングしました。レンダリングには時間が少しかかりましたが、ライトで影が付くような、メモリやその他的にハードルの高いレンダリングですが、無事最後まで処理されました。

これは、32ビットの DAZStudio4 では絶対にしたくないクラッシュ必至のパターン( 怖くて実際やってないですが )を乗り越えました。



さて気合を入れて本気加工

上の画像は、キャラクタおよびライトの設定もそこそこに、キャラのポーズのみに重点を置いて作成したものなので、出来上がりとしてはイマイチなので、再度表情に時間をかけていいカメラポイントを探して、その画像を PNG で保存して GIMP で加工。

手順は以下のようなものです。
❶ 既存のライトをキャンセル
❷ 一般的な遠隔光源とスポットライトを追加( 反射なし/ピンク系 )
❸ 女性の表情を調整
❹ GIMP でオーバーレイでドラゴンを少し黄土色に
❺ コントラストを上げる
❻ 白のオーバーレイでポイント的にさらに明るく
❼ 黒の全体オーバーレイで暗さを追加して中央を強調
ドラゴン・スレイヤー( Genesis 女性版 ) ※ クリックすると、Shadowbox で大きく表示します。
posted by at 2013-03-31 23:49 | Comment(0) | DAZ3D DAZStudio イラスト 3 | このブログの読者になる | 更新情報をチェックする

2013年03月29日


DAZ3D : 朱色の月と大刀と飛翔する初音ミク

背景にオレンジの月。手前にキャラ。間に Three.js で、小さな平面初音ミクを蝶のようにアニメーションで200人飛ばして、Shadowbox で IFRAME 内に描画しています。

あとは、画像をフェードインすべきなんでしょうけれど、そのへんはもっといろいろやってからですね。
こういう事をやっていると、マジで IE( Microsoft ) が WebGL を実装しない事に腹が立ちます。マツコ&有吉の怒り新党に訴えたいくらいです。


posted by at 2013-03-29 03:32 | Comment(0) | DAZ3D DAZStudio イラスト 3 | このブログの読者になる | 更新情報をチェックする

DAZ3D : 画像4枚を jQuery でフェードアニメーションにしてみました

最初 CSS3 のアニメーションでやろうとしたら、Google Chrome しか動かなくって、jQuery で実装しました。というか、Google Chrome って、background の 画像 url 指定までアニメーションしてくれました。解りにくいけれどやはり凄いですね。
使った画像は以下の五枚ですが、枚数を任意にするにはもっと頑張ってライブラリ化する必要があるようです。しかし、とりあえず背景+4枚ならこのまま使えます。











とにかく、メモリ沢山栄える為の 64ビットの マシンも買ったし、DAZ3D で作る 3D イラストも順調ですが、世の中はやはり自力で作る絵のほうが評価が大きいので( 特に日本はそういう国だし )、自分のスキル( プログラマ ) を生かして少しでも他人とは違う創作物にしたいわけです。

今のところ、Three.js とのコラボが一番インパクトありますが、地味に jQuery も重要なのでアニメーションのテストをしてみました。これはちゃんと作れば一般の人でも使えるものですし、DAZ3D では沢山コマを作るのは容易です。今はまだ DAZ3D の敷居は一般の人には高いですが、数年後にはみんな 3D やってそうな気もするのでワクワクします。3D と言えば、3D プリンタも凄くなって来てますし、日本でアニメ系の創作が平面で終わるとは到底思えないので期待しています。

とは言え。

自分の寿命がいつまであるかのほうが、最近は心配です・・・・



posted by at 2013-03-29 01:33 | Comment(0) | DAZ3D DAZStudio イラスト 3 | このブログの読者になる | 更新情報をチェックする

2013年03月27日


Three.js で『画像を群れで飛ばす』- 背景画像を設定したら結構素敵になりました

関連する記事

『初音ミクを群れで飛ばす』-- Three.js の Canvas サンプルで『鳥が群れで飛ぶ』という凄いのがあるんですが、平面の画像をテクスチャとして差し替えてブログに貼れるようしました。 

前回は、単純に Three.js のサンプルを貼っただけのようなものでしたが、画像をもっと簡単に使用できるようにして、いろいろやってるうちに、ブログで 3D の可能性が見えて来たような気がしてみたり。

ここまで来れば、背景やら画像やら差し替え機能の付いた、jQuery のプラグイン作るのはすぐですし。
※ まだ、ID が固定なので同じページに二つの記事が同じものを使うとまずいです。
<img src="http://lh6.googleusercontent.com/-rALYQbtofec/UU2QP5kdd2I/AAAAAAAAMa0/btK53_S7RSc/s60/wing.png" style="border: solid 0px #000000;cursor:pointer;margin-right:14px;" onclick='strat_birds(this.src)' />

<img src="http://lh6.googleusercontent.com/-ee7i9HqCPvo/UVHqU36hnAI/AAAAAAAAMc0/r78cSNjeu8g/s60/_img.png" style="border: solid 0px #000000;cursor:pointer;margin-right:14px;"  onclick='strat_birds(this.src)' />

<img src="http://lh5.googleusercontent.com/-AinOaWGth88/UVHj_A27xzI/AAAAAAAAMcs/_vJj9Koxq2s/s60/_img.png" style="border: solid 0px #000000;cursor:pointer;margin-right:14px;"  onclick='strat_birds(this.src)' />

<img src="http://lh3.googleusercontent.com/-4Em5315jEAI/T_GVyEMF5BI/AAAAAAAAHBg/s78i3fY94vU/s60/Black_Eagle_Miku_Elf4.png" style="border: solid 0px #000000;cursor:pointer;margin-right:14px;"  onclick='strat_birds(this.src)' />

<input type="button" value="表示終了" onclick='document.getElementById("birds").src="about:blank"'>
<div style='margin-top:8px;'>
<iframe
	src="about:blank"
	id="birds"
	name="birds"
	scrolling="no"
	width="600"
	height="400"
	marginwidth="0"
	marginheight="0"
	style='border:solid #000000 1px;background:url(https://lh4.googleusercontent.com/-RY1wQcR1nEE/UVHtKZXhRII/AAAAAAAAMc8/maFCUrPKRzw/s600/_img.jpg);'
></iframe>
</div>
<script type="text/javascript">
function strat_birds(url) {
	var str;
	str="<"+"script type=\"text/javascript\" src=\"http://homepage2.nifty.com/lightbox/three/three.min57.js\"></"+"script>";
	document.getElementById("birds").contentWindow.document.write(str);

	str="<"+"script type=\"text/javascript\">image_url='"+url+"';</"+"script>";
	document.getElementById("birds").contentWindow.document.write(str);

	str="<"+"script type=\"text/javascript\" src=\"http://homepage2.nifty.com/lightbox/three/birds.js\"></"+"script>";
	document.getElementById("birds").contentWindow.document.write(str);
	document.getElementById("birds").contentWindow.document.close();
}
</script>

関連する記事

『ブラウザ元年』 Three.js 使って、ブログにも簡単に 3D ディスプレイ


posted by at 2013-03-27 03:56 | Comment(0) | Three.js | このブログの読者になる | 更新情報をチェックする

2013年03月24日


『初音ミクを群れで飛ばす』-- Three.js の Canvas サンプルで『鳥が群れで飛ぶ』という凄いのがあるんですが、平面の画像をテクスチャとして差し替えてブログに貼れるようしました。

画像は、良く見ても絶対解りませんが以下が原寸です。

機能は変更して無いので、カーソルを避けて飛びます
画像の本来の姿は、DAZ3D の3Dキャラクタに初音ミクのツインテールさせて羽を付けた後姿です。




貼り付け方
<input id="birds_button" type="button" value="Three.js Birds 表示開始" onclick='strat_birds()' />
<div>
<iframe
	src="about:blank"
	id="birds"
	name="birds"
	scrolling="no"
	width="600"
	height="400"
	marginwidth="0"
	marginheight="0"
	style='border:solid #000000 1px;'
></iframe>
</div>
<script type="text/javascript">
function strat_birds() {
	str="<"+"script type=\"text/javascript\" src=\"http://homepage2.nifty.com/lightbox/three/three.min57.js\"></"+"script>";
	document.getElementById("birds").contentWindow.document.write(str);

	str="<"+"script type=\"text/javascript\">image_url='ここを好きな60x60の背景透過png画像に変更する';</"+"script>";
	document.getElementById("birds").contentWindow.document.write(str);

	str="<"+"script type=\"text/javascript\" src=\"http://homepage2.nifty.com/lightbox/three/birds.js\"></"+"script>";
	document.getElementById("birds").contentWindow.document.write(str);
	document.getElementById("birds").contentWindow.document.close();
}
</script>
ブログによったら、改行が br に変換されないようにする必要があるかもしれませんが、Seesaa では問題ありませんでした。( おそらく今時のブログならば問題無いと思います )

関連する記事

『ブラウザ元年』 Three.js 使って、ブログにも簡単に 3D ディスプレイ
Three.js で『画像を群れで飛ばす』- 背景画像を設定したら結構素敵になりました



posted by at 2013-03-24 00:03 | Comment(0) | Three.js | このブログの読者になる | 更新情報をチェックする

2013年03月20日


『ブラウザ元年』 Three.js 使って、ブログにも簡単に 3D ディスプレイ

IFRAME を使うと閉じた環境でブラウザのテクノロジを思う存分発揮して、ブログに埋め込む事ができます。記事内に直接貼り付ける事も可能ですが、その記事だけにしか使わない javascript をブログの環境に設定するのは意味無いですし、したとしても他の環境の影響で動作しない場合か結構な確率で発生します。
( この記事では、記事内から IFRAME に 対して JavaScript を書き込んでいるので、ブログパーツのようなものです )

IE10 もリリースされたし、Opera も Webkit になるそうですし、『ブラウザ元年』というか、やっと高確率で HTML5 等のテクノロジを使えます。

※ とは言っても、Opera 動かなかったです。
※ WebGL は IE で動きません。これははっきり言って『最低の所業』です。

操作
左ドラッグ : 回転
中央ドラッグ : 拡大・縮小
右ドラッグ : 移動 ( IEとSafari では動作しませんでした )
上で回っているのは、HTML5( Canvas ) です。Three.js 的に言うと、できる事は Canvas ではとってもとっても『しょぼい』です。WebGL で実行するスピードとは雲泥の差で、リアルに動くゲーム作るなら Canvas では無理があります(可能ですが、テクニックでカバーしなきゃいけませんし、描画するオブジェクトが増えるとアウトです)。

今後、そういう 3D コンテンツが増えれば、正直 IE を誰も使わなくなります。ですが、今はまだ Google Chrome や Firefox では『可能』ではありますが、技術的な敷居が高すぎて、誰もが作れるような状態ではありません。

この 3D 表示は Three.js で行っていますが、2か月に一回はアップデートされて、仕様変更が起こりまくりで、一線の人達がたくさん集まって試行錯誤している段階なので、一般に影響するのはまだまだ先のお話。

でも、プログラマが関係しない一般的な WEB ページは『ブラウザ元年』のおかげで一般のところまでやってきています。もっともっと簡単に WEB ページが華やかでかっこよくなるのです。

ここで実行しているソースコードは

http://toolbox.winofsql.jp/tool_html_links.htm で、青い『サンプル』ボタンをクリックして表示されるウインドウの中の『二つのCubeとOrbitコントロール』をクリックして下さい。ソースコードが表示されて、実行状態になります。

描画能力を比較すると

場合によって優劣変わりますが、Google Chrome と Firefox が良い状態です。速度やレスポンスは Google Chrome が上です。WebGL が可能なのは、Google Chrome と Firefox ですが、WebGL になると、その差が顕著になって、Google Chrome がおすすめになります。

IEは、IE10 になってやっとスタートラインに立ったところで、IE9 よりはスピードが上がりましたが、WebGL が動作しません。実は、IEWebGL という ActiveX のオブジェクトがあって、それをインストールした上でプログラマが専用のコードを書いてバインドすると Three.js の 3D コードも動くようにはなります。

ですが、こんな面倒な事が一般的に行われる事は無いので、IE10 の立ち位置は現在とっても微妙です。そもそも、IE と一口に言っても、現在 IE6、IE7、IE8、IE9、IE10 が存在していて、そのうちIE10 のみがスタートラインに立ってるんですが、結構対応するほうは嫌気がさしていて、IE10 ですらなんだかうさんくさいです。

この Three.js の Canvas 表示にしても、一番表示クオリティが悪いのがはっきりしています( 透過の端にゴミのような線が見えます )

Opera は Webkit に変わるそうなので、そうなればそれなりなクオリティは期待できますが、Windows の Safari は、Webkit なのにやたら遅いです。Mac 版はたぶん WebGL が動くと思うんですが( 良くしらない )、Windows では動かないので Apple は Windows ベースのアプリにやる気が殆ど無いようです。

そんな、いろいろな事情が交錯する中、使う側は一番いいものを使えばいいのであまり気にしなくていいですが、夢のような WEBスタイルが発現するのは、もうすこし未来になるでしょう。


使用している画像


※ 背景透過です


関連する記事

『初音ミクを群れで飛ばす』-- Three.js の Canvas サンプルで『鳥が群れで飛ぶ』という凄いのがあるんですが、平面の画像をテクスチャとして差し替えてブログに貼れるようしました。
Three.js で『画像を群れで飛ばす』- 背景画像を設定したら結構素敵になりました


posted by at 2013-03-20 14:41 | Comment(0) | 独り言 | このブログの読者になる | 更新情報をチェックする

2013年03月17日


テラフォーマーズがあまりにも素敵なので4巻買いに行ったら売り切れ。よって、Amazon に直行しました。

昨今、本屋さんは少なくって、駅前の TSUTAYA だのみですが、全くアウト。ローカルで大き目の本屋もアウト。まあ、みんな考える事はおんなじで、3巻の終わり方からして待ちに待ってたんでしょう。

自分は先週 1〜3巻をレンタルして衝撃を受けました。最初、『まだ、3巻しかない話・・』という認識だったんですが、TSUTAYA のおすすめは間違い無いので借りてみましたが、読み始めてびっくりしてしまいました。

まるで映画見てるみたい

もう、最初から本になる事を想定しているわ、その区切りの巻単位で一本の物語として成り立っているというか、焦らずきっちり一巻一巻丁寧に作られていねという印象でした。そして、圧巻なのは『敵』のデザイン。

これがもしあのデザインで無かったら、このお話の魅力は半減しているだろうし、やたらたと味方のほうのデザインがかっこいいので、人類側ばかり目立ってたでしょうが、敵がアレなんでいつまでも気持ちが引きずられというか、ページめくるたんびに心臓が『トクン』となるような感じです。

すごいです。
いつかハリウッドが CG 使いまくったトランスフォーマーのノリで実写化する事を祈ります。



posted by at 2013-03-17 18:37 | Comment(0) | マンガ : 超人 | このブログの読者になる | 更新情報をチェックする

2013年03月16日


DAZ3D : Fire Night Hawk ヴァンパイア

GIMP でブラシにしてから、ブラシでスタンプした3枚の同一レイヤーに炎と同じ色設定とブレンド設定をして、レイヤー毎にモーションぼかしするとこうなります。

元の顔

 

Fire Night Hawk ヴァンパイア



posted by at 2013-03-16 04:32 | Comment(0) | DAZ3D DAZStudio イラスト 3 | このブログの読者になる | 更新情報をチェックする

2013年03月15日


Highslide JS で、ストリートビューをポップアップさせる

Google MAP API V3 では、想像ですが、ストリートビューを見えない状態でロードしようとすると、ストリートビューそのものも『非表示に設定される』ようです。ですから、Highslide JS のイベントを使って、ポップアップの直前に setVisible を実行して表示させています。

ソースコード
これはどこだっけ・・・
更新履歴
2010-01-11 : 初回投稿
2013-03-15 : API V3 に対応



posted by at 2013-03-15 03:24 | ストリートビュー : ポップアップ | このブログの読者になる | 更新情報をチェックする

2013年03月14日


Highslide JS のすすめ




P1000591
わりとステキな公園にあるもの。
■ Highslide JS 用貼り付けコード作成

Highslide JS を簡単にブログに貼りこむ為のツールです。きちんと運用するには、http://highslide.com/ へ行って、自分のサイトに張り込む為の環境を自分のサイトに作る必要がありますが、作ったコードをそのまま使って下さっても結構です。


更新履歴
2009-06-20 : 初回投稿
2013-03-14 : ツール側のメンテナンスに合わせて文言変更



posted by at 2013-03-14 02:05 | ブログパーツ | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します
コンテンツ終了
右サイド開始
コンテナ終了
base 終了
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX