May 2010
1 post
MacWorld誌にてQuadCameraがベストトイカメラアプリに
via MacWorld誌にてQuadCameraがベストトイカメラアプリに@fladdict 雑誌MacWorldの3月号において、QuadCameraがベストトイカメラアプリ認定されました。 しかもTop50iPhoneアプリ特集の一番最初のアプリ扱い。ありがたいことです。 同時にTiltShift Generatorも、17more great appsという項目に。50ベストアプリに唯一の2つ同時のノミネート。 載ったよーというお知らせのメールを貰ったので、記念にそのまま特集の後ろ１ページまるまる買い取って広告だしてみました。広告効果があるのかないのか謎ですがドキドキです。 どこまで行けるかわかりませんが、できるだけ受託をしないで自社製品で勝負するというFlasherとして、なんか新しい形を体を張って実験できればと思います。そろそろ新作出せるように頑張ります。
March 2010
1 post
HTML 5 の可能性
via HTML 5 の可能性@typocode blog
//9elements.com/io/projects/html5/canvas/">
HTML 5 の可能性
最近技術的な方面には、とんと疎くなってしまいましたが
ちゃんとキャッチアップしたいと思っています。
そこで、何かと話題のHTML 5について。
processingとHTML 5で作られた
素晴らしいサイトを教えてもらいました。（上記よりリンク）
音の制御や、アニメーションなど
Flashを使わなくて、ここまで表現できる。
いつ頃、どこまでペネトレーションが図れるものなのか
まだ分かりませんが、また新しいものが生まれそうです。
via koxbox氏
December 2009
1 post
Cymatic Ferrofluid
via Cymatic Ferrofluid@all manner of distractions
Picture by munkt0n
This black oil is the reason I code. Not literally but it has had a profound impact on what I find myself coding. In 2002, I bought a small amount of?ferrofluid off the internet. It was around the time when I started to learn Processing. I began asking for advice on the Processing forum on how to translate the formulas for magnetism into code. I received a great deal of help and after a couple days, I had a working 2D prototype. I have been using some version of this prototype ever since. You can see the prototype here but it was written for a pre-beta Processing so the code is pretty old. If you are looking for source code, I recommend Shiffman’s tutorial on forces.
The reason the black oil appealed to me was that it allows you to visualize the invisible field surrounding magnets. Its like a three dimensional execution of the iron filings test but much more mesmerizing. I instantly wanted to know more about them. Why do they behave the way they do? Why are they spaced out just so? What insane amount of math is going on behind the scenes?
I recently came across a similar looking phenomenon when looking for late night distraction on YouTube.?Cymatics is described by wikipedia as being “the study of visible sound and vibration”. Below is an image of how vibrations from audio can create non-newtonian structures in a cornstarch and water solution.
If I wanted to create a similar looking structure, I would fill a space with magnetic particles (which would all push away from each other) and corral them with a central gravitational force (which would pull them all towards the center). It would look like this:
It is not a bad solution, but it doesn’t really have any personality. It just looks like the result of a circle-packing exercise. Not only that, it isn’t descriptive of the process I am trying to model. With the ferrofluid, there was no central gravitational force tying everything together.
Recently, I revisited the magnetism code. Somewhere in a flurry of ‘what if‘?guesses, I tied the mass/charge ratio to the particle’s distance from the origin. It ended up working surprisingly well.
As a particle moves towards the center, it would gain mass. If it moves towards the edge of the threshold, it loses mass.?I added a hint of Perlin noise to break up the circular boundary. It is mesmerizing to watch the particles fall into place. Something about it?feels right.
The next step was to disguise these particles. I added them to the multitouch project I have been working on (which I will talk about in my next post). In addition to the goo being distorted by touch, it can now be distorted by the magnetic particles. Every particle tells the mesh at the corresponding location to distort itself by an amount equal to the mass of the particle. Additionally, each particle creates large but shallow surface ripples. Again, the larger the mass, the larger the ripple. This creates a lens distortion which keeps the mesh surface dynamic.
This project also uses webcam input as a simple environmental reflection. I realized I could get a simplified subtle global illumination effect by having the webcam pull in color and brightness directly from the output, creating a highly decaying feedback loop. In short, I draped a piece of white paper over the laptop webcam so that the camera only saw light coming off the monitor.
Here are a couple short renders. They reflect realtime performance. I hope to have videos with audio soon.
Cymatic Fluid from flight404 on Vimeo.
Cymatic ferrofluid, lighting test from flight404 on Vimeo.
Cymatic ferrofluid from flight404 on Vimeo.
Next up, I will talk about the process I used for creating the goo itself. Perhaps eventually, I will be able to code my own cornstarch monsters. Stranger things have happened.
July 2009
3 posts
Climbing back down
via Climbing back down@all manner of distractions Local Optima
In mathematics and computer science, there is a concept called?local optima. In short, the easiest to achieve solution (local optima) isn’t always the best solution (global optima). A nice metaphor for this concept is the?Hill Climbing algorithm.
Imagine that you wake and find yourself in a featureless world. Because of a dense fog, you can only see a few meters in each direction. In your hand is a note.
“Climb to the highest point.”
The ground rises to your right. You head right. It makes sense to you that if you always head in the direction which promises the greatest positive elevation change, you might be heading towards the highest point. After half an hour, the ground levels out. You have reached the destination. Unless…
Had you initially headed left, you might have only lost elevation for a few meters before starting to climb to an even higher peak.
This has been my experience with coding. You need to often go backwards to get further forwards. Or to stick with the metaphor, sometimes you need to head into the valley in order to find a higher peak. A couple weeks ago, I started back down the Java hill. I decided it was time to learn C++.
(note to the highly excitable: This is not a reflection of the merits of Java vs. C++. I get it… they each have their strong suits. Just like Flash has its pros vs. Java and C++).
Now, I am not a crazy person. I wouldn’t just do something like this out the clear blue sky. Anyone who knows me knows that I am generally adverse to change, especially change which is initially damaging to both your ego and your productivity. I couldn’t just copy everything over from Java to C++. I wouldn’t just be launching XCode instead of Eclipse.
This would turn out to be like the time I finally found a classical guitar teacher because I am overly fascinated with learning how to play the Usher Waltz by Koshkin to the point where it is all I have tried to learn for years. The teacher I found said I had developed a bunch of bad habits and would have to stop playing the Koshkin piece for a very long time. Instead, I should practice beginner finger exercises. No way. I showed him my strongest finger and left.
Can I help you with that?
C++ is a scary place. Happily, there was a guide. It’s called (codename) Flint and it is a C++ framework being developed at The Barbarian Group. It is still very much under development and its eventual status (internal or external, open-sourced or not) is unknown. I cherish it for helping to make my transition a bit less thorny. Otherwise, I might have flipped off C++ and gone happily back to Java.
(note:?OpenFrameworks is another C++ framework which has been used on tons of beautiful projects. It also has the added benefit of actually being available whereas (codename) Flint is still being developed. I highly recommend checking it out.)
But switching to C++ from Java?is still an initial step backwards. I have to learn about pointers and references and headers and operator overloading and much more. I know my limitations enough to know that I should leave the Fuji project on the back burner for a bit. If I were to dive right in and try to port that project right away, I would end up pulling out quite a few angry hairs. So I decided to do my finger exercises.
Earthquake!!!
Most of the work I have done in the last month has involved creating suggested sample applications in the spirit of learning the ropes. Andrew Bell has been giving me assignments. First up, create a globe and map earthquake data onto it.
I had done something similar a while back in Processing but my data was limited to California and Nevada. Now I would be working with 7 days worth of data from all around the world for any earthquakes with a magnitude of 2.5 or higher. It isn’t a huge amount but I would have to find ways to deal with the clusters that are associated with any earthquake data visualization.
Creating the actual globe was great fun. I was pointed towards NASA’s Blue Marble project. There you can download Earth textures at astronomical sizes. Some are available at 86400×43200 pixels. I grabbed a color map and a height map. Using NormalMappr, I created an additional normal map from the height map.
The one drawback of the NASA data is the river systems aren’t as prominent as I would have liked. I ended up adding in the rivers and smaller lakes using this image as a source.
As I mentioned earlier, earthquakes come in clusters. The Dominican Republic had a few dozen 3.0M to 4.0M quakes in that week. If I just stuck pins exactly over the epicenter, all of the Dominican Republic pins would be reduced to a single blurry pin which would not give an accurate summary of the area.
I decided to go back to my old friend Magnetism. In order to keep the quakes grouped but individually distinct, I anchored the pin to the epicenter but allowed the other end to drift a short distance away. This distance would be determined by making each pin-head magnetic so that it pushes away its neighbors’ pin-heads.
It worked well enough so it was time to move on to a new assignment. I will eventually come back to this project because there is plenty more I would like to add such as timelined events and more interesting animations for the actual quake graphics. There are a couple more screenshots later in this post but it makes more sense to move on to the next project.
Addition/Subtraction
Next up, learning more about vectors and lists by making a flow field simulation. It would involve 20,000 particles which react to external forces and can be reborn locally if they should happen to stray too far. Into this mess of particles, you can place either an attractive force (gravity) or a repulsive force (orbital). The attractive forces pull every particle towards it based on the laws of gravitation. The repulsive forces spin either clockwise or counterclockwise and any particles nearby would be thrown away from the center of the rotating force.
Below I have added one of each type of force. The gravity is on the left and the orbital is on the right. The orange strands are the motion trail of each particle as they are pulled into the black hole where they are respawned in a random location on screen.
As you continue to add more forces of each variety, more complicated compositions can be formed. Here, there are 13 gravitational forces and 8 orbital forces (4 of each spin direction).
After a while it starts to look like a painting application created by H.R. Giger (but with fewer dead babies and engorged penises… man that guy was weird).
More Earthquakes!!!
How about combining these last two projects? Sure! Why not! Below you see a couple more images from the Earthquake visualizer but now, each earthquake acts as a gravitational force for a few thousand particles mapped to spherical coordinates. It ends up creating a faux atmosphere and can draw the eyes towards areas of strong seismic activity.
Below, you can see the 7.8M quake that struck New Zealand a couple weeks ago. For scale contrast, the larger sphere near the top of the image is a 6.3M quake.
Particle Engine
Andrew had already ported my particle source code over to (codename) Flint but he did a fairly direct translation, keeping all my poor judgement and outdated methods intact. I decided to have a fresh go at it and below you can see the results. It pretty much behaves the same way as before but with a few aesthetic changes. The emitter is a solid bumpmapped sphere which shrinks and spins and eventually starts throwing off sparks. The perlin noise is now a perlin noise derivative. Still on the to-do list, figure out how to do particles directly on the shader. But honestly, not sure if that is at all reasonable. Im guessing its harder than it sounds.
Where is it leading?
Eventually, I will make my way back here. These are the most recent screen grabs from the Fuji project which I had been building in Java. Though this build could run at about 25 frames per second, I feel a switch over to C++ and recoding the whole thing from scratch will most likely lead to a bunch of speed optimizations which will hopefully push it back into the 60 fps range. I know I was taking quite a few shortcuts and now I can begin to address them. Fingers crossed!
The last bits I added before moving over to C++ are swarming birds. I only got as far as creating them and having them fly from tall tree to tall tree. The flocking has not yet been added so it looks a bit haphazard.
I still have quite a long way to go. I plan on tacking a mesh terrain project next. I don’t know if I will do any of the beautiful but difficult terrain mesh optimizations like featured in this article by Shamus Young. I get the concepts entirely but have no idea how to deal with all that irregular data. Grids make sense to me. Adaptive resolution mesh does not.
And there you have it. A huge life change reduced to a single blog post. I will continue to post my new work with (codename) Flint as well as my continued work with Processing/Java. And once details about (codename) Flint become available, you will be able to read about them here.
openframeworksでaddonを試す
via openframeworksでaddonを試す@hysysk:blogFATで入ってるaddonはいいとして、他のaddonを使う時はどういう方法がいいのかなと思って試してみました。かなり愚直なやり方です。ofxMSAPhysicsを使ってみる。processingのtraer physics(いつの間にかソースが公開されている!)に似たAPI。1.ダウンロードsvnがわかる人はsvn checkout http://ofxmsaof.googlecode.com/svn/trunk/ ofxmsaof-read-onlyわからない人はミラーからダウンロードできます。ofxPhysics以外にも色々入ってます。
: bold;">2.プロジェクトを作るapps/examples/emptyexamplesフォルダをコピーしてペースト。フォルダの名前をPhysicsTestとする。その中にaddonsというフォルダを作り、ダウンロードしたフォルダの中からofxMSAPhysicsとofxObjcPointerをコピーしてaddonsフォルダの中にペースト。srcフォルダ以外を消しておく。ofxObjcPointerはメモリ管理に使っているらしい。xcodeprojファイルを開いて、Finderからaddonsフォルダをドラッグして「Groups & Files」にドロップ。日本語環境だと「グループとファイル」。僕は調子こいて英語にしています。ダイアログが出てくるので多分そのままOKすればいい。上の方にフォルダをコピーするかどうかチェックする項目があるけど、今回はプロジェクト内に既にコピーしてあるのでチェックは外しておく。ラジオボタンは「Recursively Create Groups for any added folders(追加したフォルダに再帰的にグループを作成する)」方で。src以外を消したのはここで変なことになぁ
蕕覆い燭瓠
openframeworksの始め方
via openframeworksの始め方@hysysk:blog去年YCAMでのワークショップに参加したopenframeworksですが、その後iPhone版(ofxiphone, mobileframeworks)が出たり、多摩美の授業SBAW09が公開されてたしているので、再び勉強してみようと考えています。Mac OS10.5.7 Xcode3.1.3です。買ったばっかりのMacBook Proです。 openframeworksはここからダウンロードできます。FATというのはOpenCVなどがaddonとして組み込まれているバージョンです。通常はこちらをダウンロードして使えばいいと思います。 一番最初にopenframeworksに触れた時は、Xcodeの使い方がわかぁ 蕕覆い海箸發△蝓
June 2009
1 post
Quiet but not inactive
via Quiet but not inactive@all manner of distractions Been a while since I last updated. I assure you I have not been resting. Unfortunately I am working on projects that need to remain under the cover of vagueness until they are either 1)more fleshed out or 2)officially launched. But that doesn’t mean I can’t tease a bit, right? The two things that have been occupying most of my time the last...
May 2009
1 post
読書日記 ユメ見るiPhone
via 読書日記 ユメ見るiPhone@fladdict
ユメみるiPhone―クリエイターのためのiPhone SDKプログラミング
いつもお世話になってる、ワークスコーポレーションのO女史(.flaの編集だった方)から、徳井さんの「ユメみるiPhone」を献本いただいた。多謝です。
徳井さんといえば、CBCで「ソウゾウ的iPhoneアプリのすすめ」等の連載をされている人で、MAX/MSPとかDJとかメディアアートとか系の方です。
そういうわけでサンプルも、OpenALで音をならしたり、加速度センサやマルチタッチだったり、OSCでデバイス通信してみたりと、メディアアート、インタラクティブよりの事例のみで構成されています。
世にあるiPhone本の大半は、UIKitコンポーネント紹介してお茶を濁してて「俺はテキストフィールドだしたいんじゃねぇ！！グリグリ動かしたいんだよ！！」と叫びたくなるものが多いのですが、この本はもうちょっとFlash使い達のやりたいところを集中的に紹介してていい感じ。アプリアプリしたダサいアプリじゃなくて、お洒落なアプリ作りたいっすな人にはお勧め。
なぜか僕も巻末対談で登場させていただいてるのですが（それで献本もらった）、他のメンバーがあのポケットギターの笠谷さんや、Ages5&Up(デラウェア)の人だったりと、ビッグすぎてビビル。 気圧されないように空気読まないでガンガンしゃべってみましたが・・・
Flasherやprocessing野郎がiPhoneに手をだすならば、とっかかりとしてはかなりいい感じの本です。初心者はこれプラスiPhone SDK大全かiPhone CookBookと、ObjectiveCの荻原本のチーム編成がよいかと思われます。
April 2009
1 post
actionscript3でglitchする
via actionscript3でglitchする@hysysk:blog 参考にしたのはこのforum。 Processing 1.0 - glitch art ヘッダになっているであろう位置をとばして適当な位置のデータを置き換える。 ヘッダの位置予想は適当。ヘッダがあれば、何でもできる。 バイナリのいじり方はflash oopを参考にした。 本当はhex editorみたいに全部展開してちゃんと狙ってglitchさせたいけど、イベント処理が重く分割させる必要がある。これもflash oopにイベントを分割してァ 疋薀乾鷆弊
February 2009
1 post
E15:oGFx
via E15:oGFx@hysysk:blogalpha版出た(Mac OS10.5のみ)。 http://ogfx.mitplw.com/ pythonベースで、processingとかnodeboxみたいな感じで書ける。 アニメーションを実行させながらコードを書き換えられるon the flyなスタイル。 今のところスクリプトの保存はwebに。 http://e15web.media.mit.edu/users/52 この仕組みいい。 見るためには登録しないといけないかも。 保存したらすぐスクリーンショットができてページが作られてる。 そういうところがどうなってるのか気になったり。 何かエラー出た後直してもちゃんと動かなかったり、deleteしたらポインタが変なとこに行ったりして不安定なところがある気がするけど、楽しい。新鮮。 ぁ △隼澆疂
January 2009
5 posts
Cam with me | Sony
via Cam with me | Sony@typocode blog
//www.sony.jp/products/Consumer/handycam/camwithme/main.html">SONYのデジタルビデオカメラ Handycam “ハンディカム” のサイト。
話題のサイト。やっと見た。こんな時間も確保できなかった。
ぶっ倒れない自分の身体を尊敬する。
いやいや、もうそれはそれは各所で紹介されているので
サイトの詳細は割愛するとして、ほんとにこのサイト泣けます。
ただ僕の涙腺が弱くなっているだけではないはず。
感動したもん。
putSWF('iW4r5762IyXS6i2ZJakHsYwT5aXaEJKrIrcS8wOHodCRy4iHYUp9x6EjhUxdyPpVspGkp5rx1XLowwVme6LvitLtN5Vcc.wv7B1nGv9Fb34_');
やっぱり赤ん坊の頃から知ってる娘なので
「大きくなったなぁ」とか、彼氏らしき姿が見えると
「ふざけんな」みたいな気持ちになる。
もう夢中です。
もうあの娘の父親です。
もう一回見ようかな、とか思う。
しかしこのサイト、マーケな視点から見てもよく出来てる。
ひとまず共有させる、”したくなる”仕掛け説明は他サイトに譲るとして
このサイトの明確な目的とか、ゴールってのが
自然な導線の中に組み込まれていて、実にうまいと思います。
ムービーが再生されてた位置に、ゴールへの導線並ぶもんね。
遷移率低いわけない。
要は商品のプロモーションなので
認知拡大を図る訳ですから
詳細なスペックなんてどうでもよくて、
「ソニーが新しいハンディカム出したくせー」
みたいな雰囲気を出せればよい。
スペック説明ページは他にあるし、
まだプレオーダーだし。
プレオーダー数がKPIか？
ムービーの再生回数か？
※追記
プレオーダーはブログパーツの再生終了後ない。
こっちからのKPIではないよね。
認知率とか、KPIの達成率知りたい。
きっと大幅に達成してるんじゃないかな。
この盛り上がり半端ないし。
個人情報取りまくりなんじゃないかと。
ブログパーツとサイトの内容が
ほぼ一緒だけど、わざわざサイトに
来訪させる必要ないもんね。
ブログパーツ内で十分プロモートできるし。
使ってるシーンを具体的に想起させるなぁ。
誰でも思ひ出はとっておきたいだろうしね。
共有したくなるし、ラベリングもうまいし。
ナビゲーションも的確だし。
Skipできなくてもイライラしないし。
つーか20数年もハンディカムって動くのか？
とかほんとに最低なこと思う。思ってみた。
Links for 2009-01-21 [del.icio.us]
via Links for 2009-01-21 [del.icio.us]@fladdict
SWFのメモリ使用量とかFPSをグラフ表示してくれるSWF Profiler (Unknown Quality)
SWFProfilerという、swfの右クリックから表示できるプロファイラクラスがいいらしいという話。けどプロファイラのスクロール方向って普通逆じゃないかなぁとか思ってしまう。
100 Abandoned Artworks
processing実験ブログ。 こういう意味ないけど綺麗な実験は好き。
Gravity Tutorial for iPhone Part 1 | BIT-101 Blog
キース超先生がFlahser向けのiPhoneチュートリアルをはじめた件
Timeline
iPhone写真家ブログ。 2/2から恵比寿で展覧会やるみたい。
http: //www.super-minimum.com/timeline.html
第1回はてな1万ポイント質問終了と、第3回1万ポイント質問開始のお知らせ
via 第1回はてな1万ポイント質問終了と、第3回1万ポイント質問開始のお知らせ@fladdict １個目の「はてな１万ポイント質問」が無事終了いたしました。 支払い設定を失敗しまったのですが、手動投げ銭で１万ポイントを送信しました。届いていない人がいたらご連絡ください。ポイント明細は、質問ページのコメント欄に。 「こんな質問して意味があったの？ 馬鹿なの？」と思う人も多いみたいです。が、私個人としては海外の売り上げがビックリな感じに膨れ上がったので意味がありました。 他のプレイヤーにも、この情報が同程度に有効ならば、国内全体で少なくとも数千万ぐらい外貨獲得ができるんじゃないかと。別に僕に損はないので、ご自由にお使いください。 ToyCameraの利益以上には、社会還元できたのではないかと思います。 ...
ToyCamera 2.01 (実質3.0) をリリースしました。
via ToyCamera 2.01 (実質3.0) をリリースしました。@fladdict
ToyCamera 2.01 (実質3.0) をリリースしました。
ついにエフェクトのカスタマイズ機能がつきました！！ ほんと永らく、お待たせいたしました。 新エフェクトの詳細はコチラに。
レビュー欄で「エフェクト選択なきゃ駄目」って書いていた方々、まだToyCamera持ってたら再レビューしてくれると幸いです。 以下つぶやき。
2chの板で、「ToyCameraなんでエフェクト選択さっさとつけねぇんだ！！」と怒ってる人がいたので、名前さらして2chに突撃したら案の定、宣伝乙の３文字ですまされてしまったり。でも真面目に意見くれた方もいらっしゃったので多謝。とりあえずこれで、ある程度は約束を果たせたかと思います。
やっぱりレビューは一方的だし、メールやtwitterは敷居が高いしで、もうちょっと匿名で意見交換できる場所が欲しいなぁと思う今日この頃。お互いの意図が正確に伝わらないと、期待と違う方向にバージョンアップする場合とかがあって難しいデス。 荒らしなし、マンセーなし、煽りありぐらいのルールで、2chに専スレ立てるべきか考え中。
Appleのアプリ審査の大人の事情でバージョン番号がずれていますｗ。2.01の審査がずっとリジェクトされていて、しょうがなく2.01の審査中に3.0相当の機能をのっけてしまったしだいです。
そんな感じ。
wonderflに期待
via wonderflに期待@fladdict 今現在一番注目してるサービスの１つwonderfl。 ニコニコ、pixiv、ピアプロの次ぐらいに注目してます・・・ってなんかCGMばっかですが。 wonderflはFlashのコードをブラウザで書いてコンパイル、みんなで習作を共有しよう、みたいなサービスです。人のコードから分岐したりもできるので、勉強教材としてかなりポテンシャルを感じるのです。.flaを書いていた時代にコレがあったら、これでサンプルコード書いてたですよ絶対。ちなみにあまりやってない僕のアカウント。 個人的に今年の注目テーマは、マイクロペイメントの趨勢と、オンライン教育システムな感じで、後者のテーマとしてwonderflは気になります。 Flashの勉強装置としてポストprocessingを世界規模で狙えるような予感もします。...
December 2008
6 posts
Adobe Records始動
via Adobe Records始動@fladdict ティザーのままだったAdobe Recordsがついに本始動した模様。 どういうサイトかと思ったら、Adobe手動のクリエイターコンペだった模様。 音楽、CG、インタラクィブアート、映像を集めて、１個のCDとしてリリースするみたい。 試みはとても面白そう。 Adobeがこういうこと主導でやるってのが新鮮。 ただ、このご時勢に店頭CDというところの意図がちょっとわからない。 個人的にはこのタイミングでFlash mx 2004とかすげー盛り上がるんじゃないかと思うです。
Links for 2008-12-18 [del.icio.us]
via Links for 2008-12-18 [del.icio.us]@fladdict
fladdict» ブログアーカイブ » SepiaCameraを無料リリースしました
これでToyCameraシリーズはひと段落。次は新作。
ownyourC.com
このフンワリ感はすばらしい
Vimercati Meda - Luxury Classic Furniture
papervision3dをきれいに使い込んでる
Fnk (alpha) - Browser version
MAX MSPをFlashで実装した馬鹿がいる。超すごい
recom / PORTFOLIO / FARBSUCHE / R: 153 G: 38 B: 41 / PAGE 1
ポートフォリオサイト。画面右のカラーピッカーUIがおもしろい
Quasimondo : Incubator : Processing : Fast Gaussian Blur
processingによるガウスブラーの高速実装
cocoro
ギフトショップのサイト。クリーンだなー。サムネイルの出方がオリジナリティあふれてて素敵。
20081206-20081207
via 20081206-20081207@hysysk:blog12/6 木曜日くらいに中西君から山口行きのお誘いを受ける。いつも週末に持ち越し気味の仕事にキリをつけてprocessing monsterもやって、始発の飛行機(6:40)も予約して準備万端だったのに、目覚めた時には飛行機は飛んでました。 とりあえずシャワーを浴びて、冷静になって、携帯で羽田-山口宇部の空席状況を確認。そのまま予約できるのはもっと後の時間になるので「遅れます」と留守電を入れて羽田行きの電車に乗り込む。 9時過ぎに空港到着。このメンツ、このやり方、この曲でロックし続けるタイミングは多分もうないので、時価だと思ってビジネス特割のチケットを払い戻し、10時のフライト購入。 12時過ぎに宇部到着。雪。バスで新山口へ。雪強い。電車遅れる(そして少ない)。街中を舞台に
「ビジュアライジング・データ」をビジュアライズしてみた
via 「ビジュアライジング・データ」をビジュアライズしてみた@fladdict
Search with amaznode: ビジュアライジング・データ
せっかくだから、amaznodeで「ビジュアライジング・データ」の潜在顧客を可視化してみた。
関連するクラスターは主に４つ。
・「ビジュアライジング・データ」の属するクラスタは、Flash, processing,メディアアート系。
・周辺クラスタは、「集合知プログラミング」を中心としたサーバーサイド技術クラスタ。
・上記２つは、スケーラビリティに関する書籍でつながってる。
また
・コンピュータサイエンスや数学などのアカデミックなクラスタがあり、
・「ビューティフルノード」を仲介して、ゲーム系のプログラミングの巨大クラスタがある。
これを見てると、「ビジュアライジング・データ」は、今はFlashとprocessing系に売れてるけど、ゲーム関係の分野にプロモれると色々おもしろくなるんじゃないかな？といった仮説がなりたってくる。
っていうか、iPhoneアプリの関連性をビジュアライズしたいんだけど、iTunesで十分な情報が取得できないのがなぁ。
「ビジュアライジング・データ」日本語訳ついに発売
via 「ビジュアライジング・データ」日本語訳ついに発売@fladdict
ビジュアライジング・データ
processing 1.0がリリースされたいいタイミングで、Ben Frayの「Ｖｉｓｕａｌｉｚｉｎｇ Data」の翻訳版が発売。しかも監修はUIマスターの増井俊之さん。
英語版の愛読者だったのですが、オライリーの中の人から日本語版もいただきました。多謝です。
著者のBenFryはMITで情報の可視化をバリバリやってる、processingの作者の一人。最近のプロジェクトだと、全米の全ての道路をマッピングした地図とか。
日本だと、小説の単語の関連性を解析した //benfry.com/valence/">Valence (ビデオ), サイトのネットワーク構造を可視化したＡｎｅｍｏｎｅ (ビデオ)あたりが有名ですよね。どちらも、あれからもう10年とは思えない。
本書では多量情報の可視化に必要な、基本的な表現手法、データ形式、アルゴリズム、スケール性、そしてどういう形で落としこむか？という非常にコンセプチュアルな部分にまで踏み込んだ本です。ふだん僕がflashでやってるような、ひたすら大量のものを表示してマッピングする系のプロジェクトでは正にバイブルです。 もう４年ぐらいたつけどAmaznodeとかも、BenFryの影響バリバリ受けて作ったわけで。
多量情報のビジュアライズやりたい人は、こっちの集合知プログラミングと対で手にいれる、あるいはこの本が理解できるサーバーサイド側の人と組むのがお勧めなんじゃないかと思います。意外と一番最初の意味のある多量情報を収集するのって、クライアントサイド屋には壁だったりするので。
個人的にはiPhoneの分野は、まだ誰も多量情報のビジュアライジングには進出してないので、これ使っていろいろやんちゃなことができるんじゃないかと思います。 Flash, processing、 iPhone開発者にはお勧めします。
Processing, all grown up.
via Processing, all grown up.@all manner of distractions Earlier today, Processing shed its ‘beta’ status to become an official point release. Processing 1.0 has finally arrived and you can download it here. Congratulations Ben and Casey (and all the developers who donated their time to track down bugs and implement features)! To celebrate this awesome event, I thought I would take a walk down...
November 2008
5 posts
祝、Processingリリース
via 祝、Processingリリース@YOPPA BLOG
Casey ReasとBen FryによるProcessingが、長い長いβ版から抜け、ついに正式リリースされたようだ。それにあわせて、アイコンやUIがリニューアル。クールな印象でなかなかいい感じ。
ささやかながらお祝いという意味で、久しぶりにProcessingのアプレットを晒してみる。
重力ペインター
空間にランダムに配置された8つの粒子が互いの引力で引き合いながら、複雑な軌道を描いていく様子が画像として生成されていく。画面クリックで再描画。物理計算には、traer.physicsライブラリを使用してみた。基本となるアルゴリズムは、今週のSSAW08の授業で作成したサンプルパッチを流用。
「物理演算系」の動きは、予想外に複雑なパターンを生み出すこともあり、かなり奥深い。8つの点の間の重力を計算するだけで、予想を越えた動きになる。面白い。学生の頃に石井威望さんの授業で習った、カオスやフラクタルの話を思いだすなあ…
20081110
via 20081110@hysysk:blog20081108 make tokyo meeting 02行って来た。案の定同窓会と化して挨拶ばかりしていた。 インターネットでおなじみの人達にも会えて良かった。もっと話したかったけど。 ガセネタリウムは確かに佐竹の言葉通り「make:の精神を見た」。 中西君がエディトリアルしたmaking things talkを買おうと思ったが売り切れ。 学食も終わっていて失われた青春が帰ってくることはなかった。 20081109 食べ過ぎで寝過ぎ。会社で亀の世話をしつつプログラミング。making things talkがないので手で餌をやってぶちまける。natzkeのas3のコードを自分なりの解釈でp5にポーティング。気づいたら妖怪終電逃しに会う。 20081110...
Parametric Design - Millions of Flowers
via Parametric Design - Millions of Flowers@YouTube :: Tag // processing.jp The movie explores design and implement of a parametric design by using Context Free and Processing which allows grammars to be augmented with variables. processing http://processing.org/ http://processing.jp/ Context Free http://www.contextfreeart.org/ Author: sonicidea Keywords: processing context free parametric...
build ribbons
via build ribbons@hysysk:blogerik natzkeのflash on the beachの発表なのかな。jonathan harrisへのレスポンスと一緒に上げられてた気がするけど。 Untitled Document Flash on the Beach and “The Jonathan Harris Affair” | THOMAS KR?FTNER これのParticlesのソース見て、動かしてみて、この書き方がいいのかどうかは知らないけどprocessingでもループ内でnewしてParticlesを生み出したいと思った。最初に思いついたのが配列を使って実現する方法。サイズの宣言と値を代入する必要があるので、適当に埋めてやってたんだけど、ださい(し、これでは意味がない。最初に決まった数のオブジェクトを作るんじゃなくて、ループの度に増やしたい)。 !...
non-formatize
via non-formatize@hysysk:blog六本木のTSUTAYAでお洒落なデザイン本などを眺めていたら発見したnon-formatの作品集。 これの左上。 で大体やりたいことはわかると思うけど、やってみました。 輝度が低い、暗いとこは振幅を大きくして、線が重なることで濃くしてある。だけ。 オリジナルに近
October 2008
3 posts
It is like I made it myself!
via It is like I made it myself!@all manner of distractions I have always hated New York City. I was never able to see the charm. I have only been there a handful of times and I am always overjoyed when it is time to return to San Francisco. New York City is for the young. New York City is for the patient. I am neither. However, this most recent trip was different. On this trip, I tried to loosen...
中間速報：ToyCameraがiTunesトップページ入り
via 中間速報：ToyCameraがiTunesトップページ入り@fladdict さきほどToyCameraがなんとiTunes Storeのトップページに登場。 購入、応援、紹介、レビューを書いてくださった皆々様、本当にありがとうございます！！ 取り急ぎ、スマートモバイル市場にFlash軍団が進出する足がかりの為に情報共有をば。 ■Toy Camera 最大瞬間風速5位。 「写真編集アプリじゃねぇんだ、カメラなんだよ！」という乱暴なコンセプトが評価していただけた模様。リリース日が8月扱いの割には物凄い頑張ってます。紹介してくださった皆様、超多謝です。 ■Old Camera 最大風速50位。 ついに宿敵Hiconを追い抜きました。この2ヶ月間、HiConに席巻されたことだけが、悔しくて悔しくてたまらなかった。 ■LiquidPics 最大風速28位。 ...
iPhone アプリ ToyCamera と OldCamera
via iPhone アプリ ToyCamera と OldCamera@fladdict もうどうせアプリ当分でないし、俺よりあとに提出された100%同じネタのアプリが先に発売されるわ、んでAppStoreランキング７位ってなによ？ 初めてのアプリだからたいしたクオリティじゃないけど、ワクワクしながら待ってたのに。遠足の日に雨になった気分。 ToyCamera および OldCameraは、それぞれトイカメラ風、白黒カメラ風に撮影できるiPhone専用カメラアプリ。これでとると、どんな写真もそれっぽくお洒落な感じに変換されます。それぞれ230円と115円、あまりにむかつくから両方0円にしてiPhoneトイカメラ市場を破壊する勢いでリリースしようかな。大絶賛発売未定。 ...
August 2008
3 posts
Vectors
via Vectors@hysysk:blognature of codeをちゃんとやろうと思った。何となく読んだりコード書き換えてみたりはしてたんだけど、いくつか勉強しておきたい項目を取り上げて書くつもり。まずはVectorsから。実はVector3Dクラスが何をしてるのかとかよく理解してなかった。 motion 101のメインになる部分(hellomotion.pde)とThingクラスの余計なところを削って円の動きだけに注目。Vector3Dクラスを使うにはVector3D.javaをAdd File…でスケッチフォルダに追加するかライブラリを入れてimport noc.*;と書いておく必要がある。 vec3dmotion.pde Thing t; void setup() { t = new Thing! (new Vector3D(0.01, 0.01), new...
Moving over... PostSpectacular is here
via Moving over… PostSpectacular is here@toxi.in.processAs one or the other might have noticed by now, this blog has not gotten a lot of love (or any attention in general) from me for a long, long time now and this will most likely be one of the last posts over here… The reason for all this silence has been that last autumn I decided to finally take the step I’d been preparing...
helloこんにちは
world!世界！ ががががが
July 2008
1 post
House of Cards | Radiohead
via House of Cards | Radiohead@typocode blog House of Cards | Radiohead RadioHeadの「House of Cards」のPVがちょーやばい。 ゴリゴリのprocessingです。 しかもソースコードをgooglecodeでDLできてしまう。。 圧巻です。 via Computerlove
June 2008
1 post
Links for 2008-06-12 [del.icio.us]
via Links for 2008-06-12 [del.icio.us]@fladdict nutsu/Frocessing - Spark project flashをprocessingっぽく使う為のライブラリ。 http://www.sebastiaanholtrop.com/samples/covercube/ CoverFlow的なPV3Dのデモ。やっぱこういうの作る場合は、エディタ的なものを用意してリアルタイムに調整しないとだめだなぁ。 Saqoosha.net :: ARToolKit を Flash に移植したよ。 さくーしゃさんがARToolKitを移植した。そのうち使う
May 2008
3 posts
小学生に携帯電話を持たせるな
via 小学生に携帯電話を持たせるな@fladdict 「小中学生に携帯電話持たせるな」教育再生懇提言へ なんか、はてぶのコメントとか見るとスゴイ賛否両論。教育再生の根本ってわけじゃないと思うけど、基本的には賛成。ただこれをやるなら、TVや書籍、雑誌にももっと細かいレーティングつけるべきだとは思うけど。 こういう規制に子供の権利や可能性ウンヌンで反対する人は、「小中学生も自動車免許とれるようにするべきだ！」って考えるのだろうか。個人的にはそういうレベルでの規制だと思ってたので、無問題だった。 ビギナーに対するフェイルセーフやパーミッションコントロールは、普通に必要だと思う。能力や適正のある人間は、勝手に使ってジェイルブレイクするだろうから、まずリテラシー底辺の安全を確保すべきじゃないかな。...
インタラクティブアート用JSライブラリ processing.js
via インタラクティブアート用JSライブラリ processing.js@fladdict Javaによるインタラクティブアートの定番である、processingをJavaScriptにポーティングした猛者があわられた。 via keitap情報 processingはご存知、コードで絵を描く人のたしなみっぽいツールだけど、それがJavaScriptのキャンバスで動く。なんかスゴイ。遅いけど。 ・既存のprocessingのJavaコードを、js用に変換するポーティングライブラリ。 ・js用のprocessing api の両方つくったっぽい。すごいね。怒涛のサンプルを見よって感じ。...
golden rectangle
via golden rectangle@hysysk:blog Balance in Design読みながらprocessingで黄金長方形のコーディング。作図法を参照しながら、コードは自分で考えるというのがちょうどいい。 スクリーンのサイズ、背景色、塗りなどを設定。 size(400, 250); background(255); smooth(); noFill(); 正方形を描く。 int square = 200; rect(0, 0, square, square); 一辺の中点aから相対する角bまで斜線を引く。 float[] a = {square/2, square}; float[] b = {square, 0}; line(a[0], b[0], a[1], b[1]); 斜線abを半径とする弧を描く。 abの長さは三平方の定理で求められる。...
April 2008
2 posts
Visualizing Radiohead
via Visualizing Radiohead@all manner of distractions As many of you know, Radiohead is having a video contest dealie. Lance pointed this out to me back in March and suggested that I give it a go. And a go I did give. First, however, I will discuss why I have decided not to submit my entry. After I started working on the piece, I read the rules and regulations and reread the original post on...
The World's 50 Most Innovative Companies
via The World’s 50 Most Innovative Companies@起業家・Webデザイナー・SE→CIOを目指しつつの大学生のアレ お久しぶりです。 一応国内の就活はひと段落したのでちょこちょとエントリーを。 「国内」と書きましたが、国外での就活も視野に入れていて、ひたすら海外企業を調べている中??? ”The World’s 50 Most Innovative Companies”っていうのをBusinessWeek誌が発表していました。 » The World’s 50 Most Innovative Companies » メディア・パブ: イノベーティブ企業の世界ランキング，ビジネスウィーク誌が選出 BusinessWeek/Boston Consulting...
March 2008
1 post
Seed Magazine
via Seed Magazine@all manner of distractions The April 2008 Seed Magazine is out. Hooray! Im excited both for the content, and the 4 full spreads that I did at their request. This issue profiles ‘7 revolutionary minds’, but the Seed Salon is dedicated to Benoit Mandelbrot. Seed Magazine asked me to provide some fractal images, specifically whole Buddhabrots. The Buddhabrot is an alternate...
February 2008
5 posts
SRC: Particle Emitter, pt. 2
via SRC: Particle Emitter, pt. 2@all manner of distractions My creative process is very sculptural. Seeing as how I graduated with a degree in sculpture, this is no surprise. When I code, I keep adding and adding and adding until I reach a point where I start to get confused. Then I step back and look at the piece from all angles until I see some direction I would like to explore. Then I do a...
SRC: Particle Emitter
via SRC: Particle Emitter@all manner of distractions For this first release, I am showing how I go about making a generic particle emitter. I used Processing v.135 and Karsten Schmidt’s Vec3D library. It was developed on a MacBook Pro laptop, but this shouldn’t be a problem. There is an emitter on screen which will follow your cursor position. When you click and hold the left mouse button, it...
glitch (alike) for vjs
via glitch (alike) for vjs@hysysk:blogvade ? Blog Archive ? Real World Max/MSP/Jitter 1 - Glitch (alike) for VJs glitchっぽい映像を、jitterで作るチュートリアル。 glitchの特徴はfragmentation, repetition, linearity and complexityだそう。 随分前にブックマークしておいたんだけど、今になってprocessingでやってみようと思った。 まずイメージと、ブロックノイズを組み合わせてるんだけど、ブロックノイズの作り方。 2通り思いつく。 普通にrect()で作る。 Noiser noiser; int colNumber = 5; int rowNumber = 5; void setup() {...
Flashでインタラクティブアートとかやりたい人向けの書籍まとめ
via Flashでインタラクティブアートとかやりたい人向けの書籍まとめ@fladdict.net blog 最近のFlashって、絵描く人とコードコードした人が分離しすぎちゃって詰まらないなぁと思ったので、両側やってみたい人向けのとっかかりになる本とかまとめてみた。Flashでモニョモニョ動いたり、ビュワビュワ多量情報をビジュアライズした人向けの資料集。自分が実際に読んだ本／持ってる本からピックアップ。 ストックエントリベースだから、最新の本とかは抜けもあるかも。 ■ActionScript 1 & 2編 Flash Math Creativity ...
MAX_FLOAT, MIN_FLOAT
via MAX_FLOAT, MIN_FLOAT@hysysk:blogvisualizing data読み始めて、知った。 最小値とか最大値を比べて取得する場合、初期値を代入する時に float dataMax = MIN_FLOAT; float dataMin = MAX_FLOAT; としておく。 読んで字のごとくMIN_FLOATはfloatで一番小さい値で、MAX_FLOATはfloatで一番大きい値。 どんな数値もこれより小さくて大きい。 sonicodeでは文字をビットマップにして黒いところに順番に番号つけて、縦のセルで大きさを比べて最大値と最小値を出してるんだけど、最大値を入れるための変数の初期値を0にしてた。これだと負の値がきたときに動かない。 設計上負の値がくることはないからいいや、と思ってたけど、気持ち悪かったんだよね。 MIN_INT, MAX_INTもある。...
January 2008
4 posts
情報可視化のバイブル Visualizing Data
via 情報可視化のバイブル Visualizing Data@fladdict.net blog Visualizing Data 最近は「見える化」っていうんですかね、著者のBen Fryはprocessingの生みの親にして、多量情報のビジュアライズを専門にするMITの研究者。 有名なところだとAnemoneとValenceなのかな。 同書は情報の可視化から、その理論、使いどころ、アルゴリズムからソースコードまで色々列挙されたナイスな本。まぁ英語だけどパラパラ見て絵が気に入ったらソースコード読むで色々勉強になりそう。 あとBen Fryの論文読みたければ、「情報デザイン―分かりやすさの設計」 という本に和訳が入っててお勧め。こちらもかなり名著というかマスァ 箸憤貮福
MUSEUM OF BEAUTY
via MUSEUM OF BEAUTY@typocode blog KONICA MINOLTA MUSEUM OF BEAUTY コニカミノルタの3D デジタイザーが 以下に優れているかを説明するサイトだと思うんだけど、 ヴィーナスの画像がきれいすぎて、 はなぢ出しながらひっくり返った。 processingな感じツボりました。
今年の目標（仮）
via 今年の目標（仮）@空即是色 まずは帰省と帰京のご報告（インターネット限定）。 1月3日〜6日の間、実家に帰省していて、 その間インターネットに全く触れなかったわけなのだが、 帰京してからまず始めにやったこと。 Twitterを過去3日分さかのぼって見る。 Mixiを過去3日分さかのぼって見る。 メールの確認。 ウェブアゴラやぷ.jp、逝ってみあ等を一通り眺める。 RSSリーダーを開いて目星をつけたものだけ見る。 ニコニコ動画を見る（主に鏡音リンまわり）。 この間、だいたい30分くらい。 最近はMixiとRSSリーダーはさっくり見るようになり、 TwitterもほぼROMなので、 1〜5には、殆ど時間を費やさなくなった。 が、休日にニコニコ動画とYouTubeにかなりの時間を費やすため、 その分増えて全体としては変化無しという具合。...
recursion
via recursion@hysysk:blogit’s hoba シンプルなコードで、視覚的に強い。 血が滴るみたいなやつ。 it’s hoba: Processing 13 再帰を使って書き直してみた。 //based on hoba's code(http://hobagoogle.blogspot.com/2007/12/processing-13.html) //rewrite by using recursion void setup() { size(800, 450); background(152); noStroke(); smooth(); colorMode(HSB); } float e, r, var, posx, posy, a, dex, lengh, bri; int cnt; void draw() { } void...
December 2007
2 posts
特定のキーワードにマッチした内容の記事をTumblrやMovableTypeに自動的に投稿する
via 特定のキーワードにマッチした内容の記事をTumblrやMovableTypeに自動的に投稿する@空即是色 ぷ.jpの活動にインスパイアされたので、RSSフィードから、特定のキーワードにマッチした内容の記事をTumblrやMovableTypeに自動的に投稿するプログラムを作ってみた。 例えば、自分がよく読むブログからprocessingに関連した記事を抽出してTumblrに自動的にブックマークする。と言ったことができたり、MovableTypeに自動的に投稿して紹介することでprocessingの日本語情報ポータルを運営する。と言ったことができると思う。 汎用的に使えるようにプログラミングしたつもりなので、いろいろ弄って自分用にカスタマイズしてみるとよいかも。 RSSフィードはRSS0.9とRSS1.0に対応。...