I has released a plug-in for Shade 12. I was correct the errors of the plug-in to send mail body. You can download the updated plug-ins.

ダウンロード

• caduceus.shdplugin(Ver 1.20120520)

まだ、最終的にどのような形にするか決めてないので、/examples/grids.html のみが、レスポンシブ・ウェブ・デザイン対応になっています。なお、画面の幅を判断して読み込む部分の記述は、 /js/responsive.js に記述してあります。今後ソースに含めるかどうか未定の部分の、iPhoneのアドレスバーを隠す記述も含んでいます。

今の所、MacのSafariとChrome、iPhoneのSafariでのみ確認をしています。他のブラウザで具合悪い部分がありましたらお知らせください。

keiso/k3gridsystem

今回の方法でも、スマートフォン側での読み込みに無駄があるので、最終的には、画面の幅を基準にCSSファイルの読み込みを分けるかもしれません。現在は、ベースのCSSファイルを読み込んだ後で、画面幅が狭い場合(481px未満)に responsive.css を読み込む形になっています。

今回は、現在iOSとAndroid用のBasicライセンスが無料になっているUnityを使って、iOS用の3Dゲームアプリを作るという内容です。講師役は私が担当します。入門編みたいな内容になる予定なので、そんなに難しい事はやらない予定です。

参加登録はいつもの様にATNDで受付中です。

広島マックユーザーグループ|3月25日(日曜日)の勉強会 : ATND

ちなみに昨日でkei3.comは丸12年になりました。以前ほど発信しているコンテンツが無いので、余り見に来る人も多くない状況ですが、今年はiOSアプリを色々とリリーする予定なので、ご期待下さい。

TwitterのBootstrapに触発されて作ったk3.grid.systemをアップデートしました。

ここで紹介するのは初めてだったと思うので、少し説明を書くと、もともとBootstrapもシンプルなグリッドレイアウト用スタイルシートだったのですが、バージョンアップを重ねる度に、色々なデザインが追加されてしまい、個人的には逆にそれが邪魔になって仕舞った事もあり、オリジナルのグリッドレイアウト用スタイルシートを作って公開しています。

基本的な考え方としては、まずDreamweaverで作業している時にレイアウトが崩れない事と、出来るだけ多くのブラウザで見る事が出来る事。この点に重点を置いて作っているつもりです。具体的にはIE 6以降を想定しているのですが、将来的には古いIEは外したいです。

今回バージョンアップしたモノには、スマートフォンでの表示を意識して、メディアクエリの記述が追加しました。各コラムが480px以下のブラウザで見た場合に、幅が100%に成るだけですが、今後は、もう少しスマートフォンらしい表示なども追加したいです。もともとグリッドレイアウト用の記述だけを想定していたので、k3.grid.systemと言う名前なのですが、ナビゲーションメニューくらいはスタイルシートを用意するかも知れません。実は、iPadのランドスケープ表示の時に現在の形だと余りにも格好悪いので、少し改良したいです。

その他、less.jsを使ったサンプルも追加してあります。

keiso/k3gridsystem – GitHub
https://github.com/keiso/k3gridsystem

ちなみにココはまだk3.grid.systemを使ってないのですが、何れはオリジナルに入れ替える予定です。

今回も、例年どおりクリスマス頃から作り始めたのですが、新たな試みとして3D-Coat Ver.3.7を使ってます。顔の部分だけですが、3D-Coatを使用してモデリングして、その他の部分はShade 12を使っています。レンダリングもShadeです。

3D-Coatは随分前に購入していたのですが、何度か起動して使ってみたモノの、サッパリ分からず、そのままになっていて、今回の年賀状用に殆どゼロから使う方を覚えたような状況でした。何本かチュートリアルビデオをみて、基本的な使い方を覚えつつ平行して、モデリングをしていた為、新しい機能が分かる度に、それまでに作った形状の一部をやり直したりで、思った以上に時間が掛かってしまいました。

基本的にはUstream中心だと思いますが、会場への出入りも自由みたいなので、生で見る事も出来ると思います。多分。

iOS24h -開発はリアルタイムで進行している-
http://ios24h.net/

実は、公民館まつりの当日の朝まで作って、ほぼぶっつけ本番状態での展示でしたが、大きなトラブルもなく終える事が出来ました。途中で、いきなりゴール判定になって仕舞ったり、処理落ちする事などもありましたが、その他の部分は特に問題なく、一番心配していた連続稼働も問題有りませんでした。処理落ちに関しては、原因が掴めず、途中で一部のオブジェクトを動かないように、コードをコメントアウトしたり、OSCの通信部分を少し間引いてみたりしたのですが、変化無し。結局最後まで原因が分かりませんでした。

今回、時間が無くてトータルすると、7日位が制作期間です。Unityを初めて勉強し始めて空なので、実質最後の1日でゲームの全体の半分くらいを作った状況です。会場で準備をする12時間前には、半分以上のシーンが未完成だった為、本当に出来るのか不安でしたが、やれば出来ますね。(笑)

結果的には、何度もプレイしてくれた子供もいて、楽しんで貰えたようです。終了に近付くと、「明日は無いの？」とか言ってくれた子もいて嬉しかった。仕組みがシンプルだった事も良かったのかも知れません。気になっていた難易度も丁度良かったようで、何度かプレイした子供はクリア出来るまでになってました。今回の経験から分かった課題としては、会場が和室で、場所が分かりづらく、そこで何をやっているのかが分からない事かな。会場前に何らかのディスプレイを用意する事も考えたのですが、準備の都合や、機材の問題で今回は出来ませんでした。リアルタイムに会場でどの様な事をやっているか見せる仕組みを用意するか、事前に収録した映像を公民館のロビーにテレビを置いて流すなど考えた方が良さそうです。

スクリーンキャプチャ

メニュー画面

この画面には練習モードも当初有ったのですが、時間の関係上なしになり、その部分に説明を追加しました。結果的に見た目的に良かった感じです。やや右でステイする事でゲームがスタートします。画面に対して真ん中でスタンバイして説明を聞くだろうと想定して、少し外していたのですが、真ん中でステイしてゲームがスタートでも良かったかも。その場合、何か説明の音声か、画面表示があった方が良いかな。

メイン画面

ゲームプレイ中のメイン画面。見ての通りの、某テレビ番組のアレです。(笑)

Quartz Composer

Kinectからの奥行き情報を処理して、UnityへOSCで送信しています。画像処理を少しでも軽くする為に、上下はカットして、中央部分しか使っていません。実際にゲームをする場合は、腰の辺りを中央に合わせます。公民館まつりの時は大人の腰の辺りで合わせたままにしてたのですが、小学生でも特に問題なく出来ていました。不要な奥行きをカットするようにしているので、調整すれば手だけでも出来ます。

制作環境

制作に使用したツールを紹介しておきます。

Unity

ビヘイビアの記述はC#

Quartz Composer

Kinectからの奥行き情報を処理し、OSCでUnity側へ送信。

Xcode 4

Quartz Composerでのメインの画像処理は、Objective-Cでプラグインを書きました。今回は奥行き情報使って、前に出ている部分は厚みがあるモノと判断して、重心を割り出しています。その部分の処理をプラグインで行っています。思った以上に精度とレスポンスが良かったので、他でも使えそうです。何よりも、骨格情報を使ってないので、仕組みがシンプル。キャリブレーションも簡単です。

Reason 6

効果音を除いて音楽は全て今回Reasonで制作しました。

Fireworks CS 5.5

タイトルやメニューの画像など

来週の土曜日(2011年11月12日)に、広島マックユーザーグループとして、三篠公民館の公民館まつりに参加します。

昨年はARネタをやりましたが、今年はKinectを使った体験型の展示を行います。一つは、Flashを使ったデジタルサイネージで、もう一つ、私の担当分はUnityとQuartz Composerを組み合わせて簡単なゲームを予定してます。

展示の場所が13時半から16時までしか確保出来なかったので、ちょっと時間が短いですが、ゲームの方ではクリアした人には、景品を用意しますので、お暇なら来てね。景品と言っても体そうなモノではなく「うまい棒」の予定。

日時：
平成23年11月12日(土) 13:30〜16:00

場所：
三篠公民館　和室
広島市西区打越町10-23

大きな地図で見る

広島マックユーザーグループの勉強会で行ったハンズオンセミナーのフォローアップです。音に反応してスペクトルアナライザ風の画像を表示するQuartz Composerファイルです。

使用しているパッチは以下の通りです。

• Audio Input
• Iterator
• Iterator Variables
• Structure Count
• Structure Index Member
• Math
• HSL Color
• Sprite
• Clear

ダウンロード

• SpectrumAnalyzer.qtz.zip 4KB

広島マックユーザーグループの勉強会で使用したQuartz Composerで作ったプレゼンスライドを公開します。実際に使ったモノには3Dの背景が付いていましたが、分かりやすくする為に、スライド部分のみにしてあります。

ちなみにスライドはMacのKeynote.appで作ってあります。勉強会ではPNGファイルを使っていましたが、公開するにあたりそのままではファイルが大きかったので、画像はJPEGに変更しました。

ダウンロード

• QCKeynote.zip 2.1MB