• ・AVCaptureVideoDataOutputクラス
• ・AVCaptureMovieFileOutputクラス

• ・AVAssetWriterクラス
• ・AVAssetWriterInputクラス

• ・openGLからCMSampleBufferRefを創りだす方法
• ・CGImageからCVImageBufferに変換する方法

• ・予算 : 3,000
• ・タイプ : CPC（クリック回数によって支払額を決めるクリック単価広告）

結果

予算がかなり低いので全体的な数値は低いですが、、
広告をクリックしてくれた人の半分以上がFacebookページをいいね！してくれた結果になりました。
これは思ってた以上です。

CTR（インプレッション数に対するクリック率）が低いのは何か修正の余地がありそうですが、もうちょっと試してみないとなんとも。
インプレッション数がこの予算でこの数字がいいのかどうなのかももうちょっと様子みですね。

また来月CPCで広告だしてみようかと思います。　5000円くらいは、、！

AVFoundation の AVCapture〜クラス

オーディオデータやビデオデータを扱うクラス

必要なフレームワークは

• ・AVFoundation
• ・CoreVideo
• ・CoreMedia

AVCaptureSession

入力データと出力データの調整をする
中心的クラス

– canAddInput:
与えられた入力データがセッションに追加できるかどうか

– addInput:
与えられた入力データをセッションに追加する

– removeInput:
与えられた入力データをセッションから削除

– canAddOutput:
与えられた出力データがセッションに追加できるかどうか

– addOutput:
与えられた出力データをセッションに追加する

– removeOutput:
与えられた入力データをセッションから削除

– startRunning:
フローの開始

– stopRunning:
フローの停止

beginConfiguration
呼び出した後にキャプチャデバイスの削除や追加をする

commitConfiguration
beginConfigurationの変更をまとめて適用する

running
セッションが実行中かどうか確認

AVCaptureDevice

入力データ（オーディオやビデオのデバイス）を取得
オブジェクトは入力デバイスごとに1つずつ存在する

+ defaultDeviceWithMediaType:
指定したタイプのメディアデバイスを取得する事ができる

+ devicesWithMediaType:
指定したタイプのキャプチャを入力できるメディアデバイスの配列を取得する事ができる
（カメラの表と裏）

AVCaptureDeviceInput

取得した入力データをAVCaptureSessionに渡す
リファレンスに載ってないクラス？

deviceInputWithDevice:
AVCaptureDeviceのインスタンスとエラー処理用のインスタンスを渡す

AVCaptureVideoDataOutput

出力データを受け取る

videoSettings
圧縮の設定を行う

alwaysDiscardsLateVideoFrames
処理が遅れるばあいにビデオフレームを落とすかどうか？
デフォルトはYES

– setSampleBufferDelegate:queue:
デリゲートとコールバック用のキューの設定

AVCaptureConnection

入力データと出力データの接続状態

videoMirrored
鏡像表示されているかどうか

videoOrientation
データの向き

AVCaptureStillImageOutput

メタデータを使って静止画をキャプチャするために使用する

– captureStillImageAsynchronouslyFromConnection:completionHandler:
静止画のキャプチャをする

+ jpegStillImageNSDataRepresentation:
キャプチャしたデータの取得

outputSettings
圧縮の設定を行う

AVCaptureVideoPreviewLayer

カメラで録画している内容を表示する

AVCaptureMovieFileOutput

ムービーファイルに出力する場合に使用

startRecordingToOutputFileURL:recordingDelegate:
QuickTimeムービーの録画を開始する

AVCaptureAudioDataOutput

キャプチャ中のオーディオデータを処理する場合に使用



間違ってたり、このメソッド重要だろうとかあったら教えてください。
ちょこちょこ書き足していく予定です。

参考

・リファレンス
・http://news.mynavi.jp/column/iphone/040/index.html
・http://news.mynavi.jp/column/iphone/041/index.html

support page

http://apps.azzip-azzip.com/ios/jp/picroll/

大阪

かに道楽（道頓堀）


赤い鳥（心斎橋）


通天閣


グリコ（道頓堀）

京都

京都タワー


三十三間堂


清水寺


祗園


祗園

他にもFlickrに
ぶらり大阪・京都の旅 2011 冬 〜大阪編〜
ぶらり大阪・京都の旅 2011 冬 〜京都編〜
で写真あげてありますんで、よかったら見てみてください。

プライベートワークをしっかりやる

• ・今やってる（1つはこれからやる予定の）個人プロジェクトをどんどん制作・更新していく
• ・iPhone or iPad アプリを合計で３つはリリースする！！

プログラミング・その他技術などのレベルアップ

• ・openGL / C++ / oblective-c などのC言語関連の知識の向上
• ・コンピュータビジョンの勉強
• ・電子工作も引き続き遊びながら覚えていきたい

数学知識の向上

• ・プログラムの勉強をしていく中で数学の勉強も
• ・ゲーム制作のための数学・物理本を参考にして勉強

英語の習得

• ・webページの一日一日の課程をやっていく
• ・twitterを利用して覚えていく

その他もろもろ

• ・ダイエット！ -10kgくらい！
• ・本をたくさん読む

openFrameworksの設定

addonsExamplesの中にある networkTcpClientExample をベースにして、
[c]
//testApp.cpp
weConnected = tcpClient.setup(“localhost”, 10500);
[/c]
testApp.cppの上の部分の行をこういうふうに変更。
ビルドして.appを起動。

Juliusの設定

Juliusはターミナルからモジュールモードで起動してあげる。

手順
1. dictation-kit-v4.1.tar.gz をjuliusのサイトからダウンロードして解凍。 Linux版でもWindows版でもどっちでもいいっぽいです。
2. ターミナルで以下のコマンドを実行してdictation-kit-v4.1のディレクトリに移動。

• ・openGL と openGL ES 2.0
• ・GLKitとは
• ・GLKitのテンプレさわってみる

まずはopenGLとopenGL ES 2.0の違い

GLKit について

iOS 5で追加されたopenGLのフレームワークで、openGL ES 2.0を使いやすくしてくれます。

リファレンスより（google翻訳使いました）

GLKitのテンプレさわってみる

とりあえず最低限の使い方を理解したいので、テンプレート触ってみます。
GLKitの機能を使っているものと、shaderを使っているものの２つ分記述してあるみたいなので、GLKitの部分だけを見ていきます。

最初は立方体が2つぐるぐる回ってますが、シンプルにしていって最終的にはこんな感じに。



[c]
// – (void)viewDidLoad

self.context = [[EAGLContext alloc] initWithAPI:kEAGLRenderingAPIOpenGLES2];
[/c]
初期化と、指定したバージョンの OpenGL ES レンダリングAPIを割り当て。


[c]
// – (void)viewDidLoad

GLKView * view = (GLKView *)self.view;
view.context = self.context;
view.drawableDepthFormat = GLKViewDrawableDepthFormat24;
[/c]
GLKitの準備。


[c]
// – (void)setupGL

[EAGLContext setCurrentContext:self.context];

self.effect = [[GLKBaseEffect alloc] init];
self.effect.light0.enabled = GL_TRUE;
self.effect.light0.diffuseColor = GLKVector4Make(1.0f, 0.4f, 0.4f, 1.0f);
[/c]
最初に現在のレンダリングスレッドをセット。

次にGLKBaseEffectクラスのeffect変数にライティングを設定しています。
openGLでは8つの光源が設定できましたが、GLKBaseEffect.light* は0, 1, 2の3つしかないっぽいです。
ていうかopenGL ESはもともと3つしかないのかな？
エフェクトの初期化を抜けば、２行でライティングの設定ができて楽です。

その後はVBOの設定をしているみたいです。


[c]
// – (void)tearDownGL

[EAGLContext setCurrentContext:self.context];

glDeleteBuffers(1, &_vertexBuffer);
self.effect = nil;
[/c]
viewDidUnloadではtearDownGL関数を呼んでいます。
後始末。


[c]
// – (void)update

/**
* PROJECTION
*/
float aspect = fabsf(self.view.bounds.size.width / self.view.bounds.size.height);
GLKMatrix4 projectionMatrix = GLKMatrix4MakePerspective(GLKMathDegreesToRadians(65.0f), aspect, 1.0f, 100.0f);
self.effect.transform.projectionMatrix = projectionMatrix;

/**
* MODEL VIEW
*/
GLKMatrix4 modelViewMatrix = GLKMatrix4MakeTranslation(0.0f, 0.0f, -3.0f);
modelViewMatrix = GLKMatrix4Rotate(modelViewMatrix, _rotation, 1.0f, 1.0f, 1.0f);
self.effect.transform.modelviewMatrix = modelViewMatrix;

[/c]
更新用のデリゲートメソッド
本来はglkViewControllerUpdateだけど、 GLKViewControllerのサブクラスだからupdateを呼べばいい？（たぶん）

まずはopenGLでいうところの glMatrixMode(GL_PROJECTION); 的な部分の記述。
GLKMatrix4MakePerspectiveではgluPerspectiveとほぼほぼ同じようにかけます。GLU系が使えないけど代替の機能があるので助かります。
最後にeffect.transform.projectionMatrixに代入。

次にopenGLでいうところの glMatrixMode(GL_MODELVIEW); 的な部分の記述。
GLKMatrix4MakeTranslationでマトリックス作りつつtranslationの設定。glTranslatedてきな感じ。
あとは必要な設定をしてeffect.transform.modelviewMatrixに代入。
glTranslated, glRotate, glScaleっぽい設定ができます。

テンプレではGLKMatrix4Multiplyを使って２つのマトリックを掛け合わせたりしてるみたいですが、
とりあえずはシンプルに理解したいので、そこはカット。

最後にテンプレではアニメーション用の_rotationの値を更新してます。


[c]
//- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect

glClearColor(1.0f, 1.0f, 1.0f, 1.0f);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

[self.effect prepareToDraw];
glDrawArrays(GL_TRIANGLES, 0, 36);
[/c]
描画用のデリゲートメソッド
prepareToDrawメソッドで エフェクト使うよ というのを定義して、
その後描画してます。

まとめ

いまはopenGLにすごく興味があるので、GLKitを勉強してみました。

GLKitがあればシェーダの知識がなくても使うことができて便利なので、
アプリにちょっとだけopenGL使いたいってなったときにはこれから使っていけそうです。
ただ個人的にはやっぱりシェーダーをしっかり覚えていきたいので、がっつり使って何か作るという機会はなさそうです。
ゲームっぽいの作ろう！ってなってもきっとcocos2d使うと思いますし。

クリスマスが爆発する何かを作る予定でしたが、時間がなくて断念。
勉強しながらの薄い内容で申し訳なかったですが、みなさんよいクリスマスイブを〜！!

間違いなどのご指摘あれば @_azzip まで連絡ください。

参考

・http://developer.apple.com/library/ios/#documentation/GLkit/Reference/GLKit_Collection/_index.html
・http://nantekottai.com/2011/10/13/opengl-game-template/
・http://nantekottai.com/2011/10/25/glkit-basics/
・http://d.hatena.ne.jp/nakamura001/20111117/1321545530
・http://monsho.blog63.fc2.com/blog-category-5.html
・http://d.hatena.ne.jp/ntaku/20090610/1244619913
・http://www.asahi-net.or.jp/~yw3t-trns/opengl/opengles/index.htm

フィジカルコンピューティングを「仕事」にする

フィジカルコンピューティングを「仕事」にする
前半のチュートリアル部分はわかってる部分も多々あったのでパラパラパラっと軽く読みました。実際に使うときにリファレンス本的に使う感じにしたいです。
お目当ての実案件の紹介が載っている後半部分はじっくり読みました。
実案件への以ていきかた、実際にどように実装したか、現場で起こった事故にどう対処し、その後どう生かしているかなど。
普段なかなか聞きたくても聞く機会のないことがたくさん書かれているので素敵です。特に実装方法の部分ではこういった方法で作ってるのか！など発見があり、勉強になりました。これから先インスタレーションの仕事をする機会があれば参考にしていきたいです。　1社に1冊は欲しいっすね！

FORM+CODE -デザイン／アート／建築における、かたちとコード

FORM+CODE -デザイン／アート／建築における、かたちとコード
プログラミングするときの考え方が載っている本で、いろいろ難しい言葉も出てきましたが、すらっと読めました。
最近読んだ本の中で一番面白かったです。
繰り返す、変換する、パラメーター化、可視化、シュミレートなどのカテゴリ分けでいろいろ書かれてますが、
個人的にはパラメータ化とシュミレートの部分が面白く、印象に残ってます。　歴史の話はマニアックすぎて自分にはちょっと難しかったです、、、
この本読んで自分の中で考え方が変わったものもあって、プログラミングでかっこいいもん作りてーー！と思えました。

OpenGL+GLSLによる画像処理プログラミング

OpenGL+GLSLによる画像処理プログラミング―「OpenGL」と「シェーダ言語」で「レタッチ・ソフト」の仕組みを知る! (I・O BOOKS)
GLSLの勉強したくて買った本。GLSLのサンプルがいろいろのっているのと、基礎について書かれているのでかなり参考になりました。
メインの画像処理部分は難しすぎてほとんど読めていませんが、、レビューに書いてあったとおり、やりたいときにリファレンス本として読んでいく方がいいのかな〜という感じです。
GLSLの部分はわりと整理出来た感があるので、苦手意識は少しは消えました。まだまだ勉強中なのでこれからも読んでいこうと思います。

レイアウトのデザインパターン帖

レイアウトのデザインパターン帖
とにかくデザインのレイアウトパターンが載っている本で、パラパラっとどんなのがあるかな〜という感じで読みました。
「このレイアウトはここがこうなって、こうでここがこうなっているから良い！」とか、そういう考え方の本ではなかったですね。そういうもんだと思ってアマゾンで買いました、違いました。 ちゃんとレビューとか読んでなかったです。　反省。
でもこれはこれで、パラパラっとどんなレイアウトの例があるかなーと見れるので結果オーライで！　

iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン

iPhoneアプリ設計の極意 ―思わずタップしたくなるアプリのデザイン
買いましたが、まだちゃんと時間とって読めてないのでこれから読みます！

蒼井優写真集 「ダンデライオン」

蒼井優写真集 「ダンデライオン」
蒼井優ですね！　かわいいですね！　言う事無しです！　1家に1冊！

うそっ。

うそっ。
蒼井優ですね！　かわいいですね！　言う事無しです！　1家に1冊！

座標系と変換の流れ

1. オブジェクト座標系（モデリング座標、ローカル座標）
オブジェクトの頂点や法線を表す座標系

•     ▼ モデリング変換 : オブジェクト座標系をワールド座標系に変換

•     ▼ 視野変換（ビューイング変換） : ワールド座標系から視点座標系への変換

•     ▼ 射影変換 : 視点座標系からクリップ座標系への変換（オブジェクトの奥行き情報を保持する変換）

•     ▼ 遠近除算 : 遠近除算（正規化）処理をすることで、クリップ座標系から正規化デバイス座標系になる

•     ▼ ビューポート変換 : 正規化デバイス座標系からウインドウ座標系への変換

ビューポート変換 5 → 6

正規化デバイス座標系からウインドウ座標系への変換
ウインドウに設定される実際の描画領域の設定
通常は表示ウインドウとビューポートのサイズを一致させて作る
[c]
void glViewport(GLint x , GLint y , GLsizei width , GLsizei height);
[/c]
▼

射影変換 3 → 4, 5

視点座標系からクリップ座標系に変換
投影の設定
[c]
glMatrixMode( GL_PROJECTION );
glLoadIdentity();
[/c]
射影行列を使うことを宣言してから、変換を行う

・透視投影の場合
[c]
void gluPerspective(
GLdouble fovy , GLdouble aspect ,
GLdouble zNear , GLdouble zFar
);[/c]
aspectをビューポート変換で設定した width / height に設定することで
図形の長さの比が保たれるようになる

・正射影の場合
[c]
void glOrtho(
GLdouble left , GLdouble right ,
GLdouble bottom , GLdouble top ,
GLdouble near , GLdouble far
);
[/c]
▼

視野変換 2 → 3

ワールド座標系から視点座標系への変換
視点の設定と中心点の設定を行う
[c]
glMatrixMode( GL_MODELVIEW );
glLoadIdentity();
[/c]
モデルビュー行列を使うことを宣言してから、変換を行う
[c]
void gluLookAt(GLdouble ex, GLdouble ey, GLdouble ez,
GLdouble cx, GLdouble cy, GLdouble cz,
GLdouble ux, GLdouble uy, GLdouble uz)
//例)
gluLookAt(3.0, 4.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0);
[/c]
ex, ey, ez : 視点（カメラ）の位置
cx, cy, cz : シーンの中心点
ux, uy, uz : 視体積の上方部分（ 通常は 0.0, 1.0, 0.0 でおっけ）

▼

モデリング変換 1 → 2

オブジェクト座標系をワールド座標系に変換
下記の関数を利用して変換することを「アフィン変換（モデリング変換）」という
[c]
glScale*(sx, sy, sz);
glRotate*(angle, ax, ay, az);
glTranslate*(tx, ty, tz);
[/c]
▼

オブジェクトの描画

実際に表示させるオブジェクトを描画する

参考

・OpenGL+GLSLによる画像処理プログラミング―「OpenGL」と「シェーダ言語」で「レタッチ・ソフト」の仕組みを知る! (I・O BOOKS)
・OpenGLの座標系

シェーダの種類

• ・バーテックスシェーダ（頂点シェーダ）
• ・フラグメントシェーダ（ピクセルシェーダ）

shader.frag と shader.vert

参考にさせてもらったサイトのバーテックスシェーダとフラグメントシェーダのソースをほんーーのちょっとイジったやつ。
[c]
//shader.vert

uniform int a;　//openGLと値のやりとり用
void main(void)
{
//transform
gl_Position = ftransform();

// normal color
gl_FrontColor.rgb = 0.5 * gl_Normal.xyz + 0.5;
gl_FrontColor.a = float(a) * 0.01;
}
[/c]
[c]
//shader.frag

void main (void)
{
gl_FragColor = gl_Color;
}
[/c]
shader.vertのgl_FrontColorの値がshader.fragのgl_Colorに渡されて、
shader.fragのgl_FragColorの値がopenGL側に適用される感じ？
次あたりここら辺はまた詳しく勉強してメモしたいです。

openGLとGLSLでのやりとり

GLSLを使うためのお決まり処理の流れは、参考サイトに書かれているものによると、