May 9, 2010

MacWorld誌にてQuadCameraがベストトイカメラアプリに

via MacWorld誌にてQuadCameraがベストトイカメラアプリに@fladdict

雑誌MacWorldの3月号において、QuadCameraがベストトイカメラアプリ認定されました。
しかもTop50iPhoneアプリ特集の一番最初のアプリ扱い。ありがたいことです。

同時にTiltShift Generatorも、17more great appsという項目に。50ベストアプリに唯一の2つ同時のノミネート。


載ったよーというお知らせのメールを貰ったので、記念にそのまま特集の後ろ1ページまるまる買い取って広告だしてみました。広告効果があるのかないのか謎ですがドキドキです。

どこまで行けるかわかりませんが、できるだけ受託をしないで自社製品で勝負するというFlasherとして、なんか新しい形を体を張って実験できればと思います。そろそろ新作出せるように頑張ります。

March 28, 2010

HTML 5 の可能性

  • <p> via <a href="http://blog.typocode.net/2010/03/html_5.html">HTML 5 の可能性@typocode blog</a></p><blockquote cite="http://blog.typocode.net/2010/03/html_5.html">
  • <a href="http: //9elements.com/io/projects/html5/canvas/"><img alt="html5.jpg" src="http://blog.typocode.net/img/html5.jpg" width="250" height="230" /></a>
  • <a href="http://9elements.com/io/projects/html5/canvas/"> HTML 5 の可能性</a>
  • 最近技術的な方面には、とんと疎くなってしまいましたが
  • ちゃんとキャッチアップしたいと思っています。
  • そこで、何かと話題のHTML 5について。
  • processingとHTML 5で作られた
  • 素晴らしいサイトを教えてもらいました。(上記よりリンク)
  • 音の制御や、アニメーションなど
  • Flashを使わなくて、ここまで表現できる。
  • いつ頃、どこまでペネトレーションが図れるものなのか
  • まだ分かりませんが、また新しいものが生まれそうです。
  • via koxbox氏
  • </blockquote>
December 30, 2009

Cymatic Ferrofluid

  • <p> via <a href="http://www.flight404.com/blog/?p=370">Cymatic Ferrofluid@all manner of distractions</a></p><blockquote cite="http://www.flight404.com/blog/?p=370"><p><a href="http://www.flickr.com/photos/munkt0n/98771733/"><img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_01.jpg" alt="" width="500" height="313" /></a><br />
  • <span style="font-size: xx-small; "> Picture by munkt0n</span></p>
  • <p> This black oil is the reason I code. Not literally but it has had a profound impact on <em>what</em> I find myself coding. In 2002, I bought a small amount of?<a href="http://en.wikipedia.org/wiki/Ferromagnetic_fluid">ferrofluid</a> 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 <a href="http://www.flight404.com/processing/magnets_2D/">here</a> but it was written for a pre-beta Processing so the code is pretty old. If you are looking for source code, I recommend <a href="http://www.shiffman.net/teaching/nature/forces/">Shiffman&#8217;s tutorial on forces</a>.</p>
  • <p> 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 <a href="http://www.emovendo.net/images/T/t-16190-58.jpeg">iron filings test</a> 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?</p>
  • <p> I recently came across a similar looking phenomenon when looking for late night distraction on YouTube.?<a title="Wikipedia::cymatics" href="http://www.youtube.com/results?search_query=cymatics&amp;search_type=&amp;aq=f">Cymatics</a> is described by <a href="http://en.wikipedia.org/wiki/Cymatics">wikipedia</a> as being &#8220;the study of visible sound and vibration&#8221;. Below is an image of how vibrations from audio can create non-newtonian structures in a cornstarch and water solution.</p>
  • <p> <img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_00.jpg" alt="" width="500" height="313" /></p>
  • <p> 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:</p>
  • <p> <img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_05b.jpg" alt="" width="500" height="313" /></p>
  • <p> It is not a bad solution, but it doesn&#8217;t really have any personality. It just looks like the result of a circle-packing exercise. Not only that, it isn&#8217;t descriptive of the process I am trying to model. With the ferrofluid, there was no central gravitational force tying everything together.</p>
  • <p> Recently, I revisited the magnetism code. Somewhere in a flurry of &#8216;<em>what if</em>&#8216;?guesses, I tied the mass/charge ratio to the particle&#8217;s distance from the origin. It ended up working surprisingly well.</p>
  • <p> <img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_05a.jpg" alt="" width="500" height="313" /></p>
  • <p> 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?<em>feels </em>right.</p>
  • <p> <a href="http://www.flickr.com/photos/flight404/4171344654/"><img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_05.jpg" alt="" width="500" height="313" /></a></p>
  • <p> 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.</p>
  • <p> <a href="http://www.flickr.com/photos/flight404/4171344722/"><img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_04.jpg" alt="" width="500" height="313" /></a></p>
  • <p> 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.</p>
  • <p> <a href="http://www.flickr.com/photos/flight404/4170587155/"><img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_03.jpg" alt="" width="500" height="313" /></a></p>
  • <p> <a href="http://www.flickr.com/photos/flight404/4171350872/"><img class="alignnone" title="Ferromagnetic fluid" src="http://www.flight404.com/blog/images/ferro_02.jpg" alt="" width="500" height="313" /></a></p>
  • <p> Here are a couple short renders. They reflect realtime performance. I hope to have videos with audio soon.</p>
  • <p> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="500" height="281" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://vimeo.com/moogaloop.swf?clip_id=8071647&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" /><embed type="application/x-shockwave-flash" width="500" height="281" src="http://vimeo.com/moogaloop.swf?clip_id=8071647&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
  • <p> <a href="http://vimeo.com/8071647">Cymatic Fluid</a> from <a href="http://vimeo.com/flight404">flight404</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
  • <p> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="500" height="313" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://vimeo.com/moogaloop.swf?clip_id=8067021&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" /><embed type="application/x-shockwave-flash" width="500" height="313" src="http://vimeo.com/moogaloop.swf?clip_id=8067021&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
  • <p> <a href="http://vimeo.com/8067021">Cymatic ferrofluid, lighting test</a> from <a href="http://vimeo.com/flight404">flight404</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
  • <p> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="500" height="281" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://vimeo.com/moogaloop.swf?clip_id=8066324&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" /><embed type="application/x-shockwave-flash" width="500" height="281" src="http://vimeo.com/moogaloop.swf?clip_id=8066324&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
  • <p> <a href="http://vimeo.com/8066324">Cymatic ferrofluid</a> from <a href="http://vimeo.com/flight404">flight404</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
  • <p> 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 <a href="http://www.youtube.com/watch?v=xSjWt9zxeuw">cornstarch monsters</a>. Stranger things have happened.</p>
  • </blockquote>
July 31, 2009

Climbing back down

  • <p> via <a href="http://www.flight404.com/blog/?p=325">Climbing back down@all manner of distractions</a></p><blockquote cite="http://www.flight404.com/blog/?p=325"><p><strong>Local Optima</strong></p>
  • <p> In mathematics and computer science, there is a concept called?<a href="http://en.wikipedia.org/wiki/Local_optima">local optima</a>. In short, the easiest to achieve solution (local optima) isn&#8217;t always the best solution (global optima). A nice metaphor for this concept is the?<a href="http://en.wikipedia.org/wiki/Hill_climbing">Hill Climbing algorithm</a>.</p>
  • <p> 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.</p>
  • <p> <em>&#8220;Climb to the highest point.&#8221;</em></p>
  • <p> 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&#8230;</p>
  • <p> Had you initially headed left, you might have only lost elevation for a few meters before starting to climb to an even higher peak.</p>
  • <p> 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++.</p>
  • <p> (note to the highly excitable: This is not a reflection of the merits of <a href="http://en.wikipedia.org/wiki/Comparison_of_Java_and_C%2B%2B">Java vs. C++</a>. I get it&#8230; they each have their strong suits. Just like Flash has its pros vs. Java and C++).</p>
  • <p> Now, I am not a crazy person. I wouldn&#8217;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&#8217;t just copy everything over from Java to C++. I wouldn&#8217;t just be launching XCode instead of Eclipse.</p>
  • <p> 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.</p>
  • <p> <strong>Can I help you with that?</strong></p>
  • <p> C++ is a scary place. Happily, there was a guide. It&#8217;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.</p>
  • <p> (note:?<a href="http://www.openframeworks.cc/">OpenFrameworks</a> 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.)</p>
  • <p> But switching to C++ from Java?<em>is </em>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.</p>
  • <p> <strong>Earthquake!!!</strong></p>
  • <p> 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.</p>
  • <p> I had done something similar a while back in <a href="http://processing.org">Processing</a> 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&#8217;t a huge amount but I would have to find ways to deal with the clusters that are associated with any earthquake data visualization.</p>
  • <p> Creating the actual globe was great fun. I was pointed towards <a title="NASA's Blue Marble project" href="http://visibleearth.nasa.gov/view_set.php?categoryID=2363" target="_blank">NASA&#8217;s Blue Marble project</a>. There you can download Earth textures at astronomical sizes. Some are available at 86400&#215;43200 pixels. I grabbed a color map and a height map. Using NormalMappr, I created an additional normal map from the height map.</p>
  • <p> The one drawback of the NASA data is the river systems aren&#8217;t as prominent as I would have liked. I ended up adding in the rivers and smaller lakes using <a href="http://naturalearth.springercarto.com/ne3_data/8192/textures/2_no_clouds_8k.jpg" target="_blank">this image</a> as a source.</p>
  • <p> <img class="alignnone" title="Earthquake" src="http://www.flight404.com/blog/images/quakes_01.jpg" alt="" width="500" height="350" /></p>
  • <p> 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.</p>
  • <p> 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&#8217; pin-heads.</p>
  • <p> <img class="alignnone" title="Earthquake" src="http://www.flight404.com/blog/images/quakes_02.jpg" alt="" width="500" height="350" /></p>
  • <p> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="500" height="281" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://vimeo.com/moogaloop.swf?clip_id=5454686&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" /><embed type="application/x-shockwave-flash" width="500" height="281" src="http://vimeo.com/moogaloop.swf?clip_id=5454686&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
  • <p> 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.</p>
  • <p> <strong>Addition/Subtraction</strong></p>
  • <p> 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.</p>
  • <p> 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.</p>
  • <p> <img class="alignnone" title="FlowLines" src="http://www.flight404.com/blog/images/flowLines_01.jpg" alt="" width="500" height="350" /></p>
  • <p> 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).</p>
  • <p> <img class="alignnone" title="FlowLines" src="http://www.flight404.com/blog/images/flowLines_02.jpg" alt="" width="500" height="350" /></p>
  • <p> After a while it starts to look like a painting application created by H.R. Giger (but with fewer dead babies and engorged penises&#8230; man that guy was weird).</p>
  • <p> <img class="alignnone" title="FlowLines" src="http://www.flight404.com/blog/images/flowLines_03.jpg" alt="" width="500" height="350" /></p>
  • <p> <object width="500" height="281"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=5564490&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=5564490&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="500" height="281"></embed></object></p>
  • <p> <strong>More Earthquakes!!!</strong></p>
  • <p> 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.</p>
  • <p> <img class="alignnone" title="Earthquake" src="http://www.flight404.com/blog/images/quakes_03.jpg" alt="" width="500" height="350" /></p>
  • <p> 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.</p>
  • <p> <img class="alignnone" title="Earthquake" src="http://www.flight404.com/blog/images/quakes_04.jpg" alt="" width="500" height="350" /></p>
  • <p> <strong>Particle Engine</strong></p>
  • <p> 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.</p>
  • <p> <img class="alignnone" title="FlintBall" src="http://www.flight404.com/blog/images/flintBall_01.jpg" alt="" width="500" height="350" /></p>
  • <p> <object width="500" height="281"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=5637328&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=5637328&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=01AAEA&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="500" height="281"></embed></object></p>
  • <p> <strong>Where is it leading?</strong></p>
  • <p> 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!</p>
  • <p> <img class="alignnone" title="Fuji Update" src="http://www.flight404.com/blog/images/fujiUpdate_01.jpg" alt="" width="500" height="350" /></p>
  • <p> 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.</p>
  • <p> <img class="alignnone" title="Fuji Update" src="http://www.flight404.com/blog/images/fujiUpdate_02.jpg" alt="" width="500" height="350" /></p>
  • <p> I still have quite a long way to go. I plan on tacking a mesh terrain project next. I don&#8217;t know if I will do any of the beautiful but difficult terrain mesh optimizations like featured in this article by <a href="http://www.shamusyoung.com/twentysidedtale/?p=141">Shamus Young</a>. 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.</p>
  • <p> 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.</p>
  • </blockquote>

openframeworksでaddonを試す

  • <p> via <a href="http://hysysk.blogspot.com/2009/07/openframeworksaddon.html">openframeworksでaddonを試す@hysysk:blog</a></p><blockquote cite="http://hysysk.blogspot.com/2009/07/openframeworksaddon.html">FATで入ってるaddonはいいとして、他のaddonを使う時はどういう方法がいいのかなと思って試してみました。かなり愚直なやり方です。<br /><br /><a href="http://memo.tv/ofxmsaphysics">ofxMSAPhysics</a>を使ってみる。<br />processingの<a href="http://www.cs.princeton.edu/~traer/physics/">traer physics</a>(いつの間にかソースが公開されている!)に似たAPI。<br /><br /><span style="font-weight:bold;">1.ダウンロード</span><br />svnがわかる人は<br />svn checkout http://ofxmsaof.googlecode.com/svn/trunk/ ofxmsaof-read-only<br /><br />わからない人は<a href="http://github.com/of/ofx-msa/tree/master">ミラー</a>からダウンロードできます。<br />ofxPhysics以外にも色々入ってます。<br /><span style="font-weight!
  • : bold;"><br />2.プロジェクトを作る</span><br />apps/examples/emptyexamplesフォルダをコピーしてペースト。フォルダの名前をPhysicsTestとする。その中にaddonsというフォルダを作り、ダウンロードしたフォルダの中からofxMSAPhysicsとofxObjcPointerをコピーしてaddonsフォルダの中にペースト。srcフォルダ以外を消しておく。<br />ofxObjcPointerはメモリ管理に使っているらしい。<br /><br />xcodeprojファイルを開いて、Finderからaddonsフォルダをドラッグして「Groups & Files」にドロップ。日本語環境だと「グループとファイル」。僕は調子こいて英語にしています。<br /><br />ダイアログが出てくるので多分そのままOKすればいい。上の方にフォルダをコピーするかどうかチェックする項目があるけど、今回はプロジェクト内に既にコピーしてあるのでチェックは外しておく。ラジオボタンは「Recursively Create Groups for any added folders(追加したフォルダに再帰的にグループを作成する)」方で。src以外を消したのはここで変なことになぁ
  • 蕕覆い燭瓠
July 20, 2009

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 9, 2009

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 couple weeks are procedural landscape generation and population, and procedural plant generation. The landscape project started because of an installation the Barbarian Group is doing for a gallery in Seattle (nope, not the McLeod Residence this time). This project should be done sometime in October. I am going to be vague on the details because there is still plenty of time for the scope to change and knowing me and the way I like to work, it will change. Four months is a long time.

Fuji_01

There are some additional test renders up on my Flickr page. In short, you are looking at a terrain mesh based on actual GSPS data from NASA. Many thanks to Kyle McDonald for figuring out how to parse the very strange .hgt file format. His example code is available at OpenProcessing.org.

I have done terrain experiments before but never thought much about how to make them more lush by populating the mesh with plants and trees. Thanks to my new found appreciation for GLSL shaders, I was able to put a nice coating of wind-blown grass onto the terrain, as well as a few thousand trees and bushes.

The water is made of layers instead of a flat plane. This was mostly an aesthetic decision. I just like the way it looks, especially if the camera is lower to the ground as it will be in the final version.

It is interesting to pause here and consider how far we have come since the good ol days of the NextFest grass wall project. That project from 2006 stretched my coding ability as far as it would go. And all for what? A few hundred 2D grass blades that barely broke 30 frames per second. This new landscape has rolling hills of seemingly millions of blades of grass all bending in the wind with cloud shadows and minor dynamic lighting and easily hovers above the 60 fps threshold. Exciting! But thats pretty much all I can say about that until we get further along.

I recently got sidetracked because I wanted to find a substitute for the TurboSquid.com textures I was using for the trees and bushes. I remembered the branching application I wrote earlier this year and decided it would be reasonable easy to recode it to produce plant life.

I was partially right. It wasn’t hard to make the code churn out plants, but it was hard to make it create plants that didn’t look like CG plants from The Lawnmower Man. There was just way too much symmetry and predictability in the growth patterns. I decided to spend a few days making it more robust.

First up, trees. The image below was my attempt to make a believable tree (without branches). The basic process is to start with a node. Think of it as the seed for the tree. The seed is created with all the behavior characteristics for the entire tree. The seed creates child nodes which pass along the tree’s ‘genetic information’. This information consists of parameters like lengthDelta, lengthDeltaDelta, radiusDelta, radiusDeltaDelta, maxChildren, color, maxGenerations, etc. As a parent creates a child node, it sends this information but mutates it slightly. The nodes arrange themselves in space using magnetic repulsion. Any node can repulse other nodes as long as they are of an equal or higher generation. The node at the base of the trunk repels everything whereas the nodes at the branch tips repel only each other. If you code in some decreasing branch lengths and radii as you go from generation to generation, you will create a nice space-filling tree! with no branch overlaps. Sadly, these trees are complex enough to elude a reasonable frame-rate but perhaps with some limitations placed on the number of branches that can be created, and killing off the repulsion after the branches settle into place, they will be swaying in the Perlin noise breeze in no time.

Fuji_03

I then tried to place some leaves or flowers on the trees and accidentally changed the perceived scale quite a bit. It no longer seemed like a majestic oak. It turned into a bush, and then eventually, much smaller flowering weeds. I wasn’t put out by this change (bushes and weeds were going to need to be addressed eventually anyhow) so I went along with it and started making bushes and weeds.

Fuji_02

The weeds ended up catching my attention the most because I could see a great deal of potential to create amazing unique renders of realistic looking plants without needing to manufacture them on a more traditional 3D application.

Fuji_04

I was reminded on Flickr that I am treading into territory that has been explored by countless others before me, namely Prusinkiewicz and Jon McCormack. It is definitely an exciting distraction and I look forward to experimenting further with this methodology.

May 20, 2009

読書日記 ユメ見るiPhone

  • <p> via <a href="http://feedproxy.google.com/~r/jp/fladdict/~3/K7iSpBQXdVc/yumemiru-iphone.html">読書日記 ユメ見るiPhone@fladdict</a></p><blockquote cite="http://feedproxy.google.com/~r/jp/fladdict/~3/K7iSpBQXdVc/yumemiru-iphone.html"><p><a href="http://www.amazon.co.jp/gp/product/486267058X?ie=UTF8&#038;tag=fladdictnet07-22&#038;linkCode=as2&#038;camp=247&#038;creative=7399&#038;creativeASIN=486267058X"><img src="http://ec2.images-amazon.com/images/I/51R-7WC-rIL._SL500_AA240_.jpg"></a><img src="http://www.assoc-amazon.jp/e/ir?t=posemaniacs-22&#038;l=as2&#038;o=9&#038;a=486267058X" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></p>
  • <p> <a href="http://www.amazon.co.jp/gp/product/486267058X?ie=UTF8&#038;tag=fladdictnet07-22&#038;linkCode=as2&#038;camp=247&#038;creative=7399&#038;creativeASIN=486267058X">ユメみるiPhone―クリエイターのためのiPhone SDKプログラミング</a><img src="http://www.assoc-amazon.jp/e/ir?t=fladdictnet07-22&#038;l=as2&#038;o=9&#038;a=486267058X" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /><br />
  • <br/> </p>
  • <p> いつもお世話になってる、ワークスコーポレーションのO女史(.flaの編集だった方)から、徳井さんの「ユメみるiPhone」を献本いただいた。多謝です。<br />
  • <br/> </p>
  • <p> 徳井さんといえば、CBCで「<a href="http://www.cbc-net.com/dots/nao_tokui/">ソウゾウ的iPhoneアプリのすすめ</a>」等の連載をされている人で、MAX/MSPとかDJとかメディアアートとか系の方です。</p>
  • <p> そういうわけでサンプルも、OpenALで音をならしたり、加速度センサやマルチタッチだったり、OSCでデバイス通信してみたりと、メディアアート、インタラクティブよりの事例のみで構成されています。 </p>
  • <p> 世にあるiPhone本の大半は、UIKitコンポーネント紹介してお茶を濁してて「俺はテキストフィールドだしたいんじゃねぇ!!グリグリ動かしたいんだよ!!」と叫びたくなるものが多いのですが、この本はもうちょっとFlash使い達のやりたいところを集中的に紹介してていい感じ。アプリアプリしたダサいアプリじゃなくて、お洒落なアプリ作りたいっすな人にはお勧め。</p>
  • <p> なぜか僕も巻末対談で登場させていただいてるのですが(それで献本もらった)、他のメンバーがあのポケットギターの笠谷さんや、Ages5&#038;Up(デラウェア)の人だったりと、ビッグすぎてビビル。 気圧されないように空気読まないでガンガンしゃべってみましたが・・・</p>
  • <p> Flasherやprocessing野郎がiPhoneに手をだすならば、とっかかりとしてはかなりいい感じの本です。初心者はこれプラスiPhone SDK大全かiPhone CookBookと、ObjectiveCの荻原本のチーム編成がよいかと思われます。</p>
  • <p> <a href="http://www.amazon.co.jp/gp/product/4048676067?ie=UTF8&#038;tag=fladdictnet07-22&#038;linkCode=as2&#038;camp=247&#038;creative=7399&#038;creativeASIN=4048676067"><img src="http://ec2.images-amazon.com/images/I/41YEg%2Bvu8KL._SL500_AA240_.jpg"></a><img src="http://www.assoc-amazon.jp/e/ir?t=fladdictnet07-22&#038;l=as2&#038;o=9&#038;a=4048676067" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></p>
  • <p> <a href="http://www.amazon.co.jp/gp/product/4797346809?ie=UTF8&#038;tag=fladdictnet07-22&#038;linkCode=as2&#038;camp=247&#038;creative=7399&#038;creativeASIN=4797346809"><img src="http://ecx.images-amazon.com/images/I/41tit7rwa-L._BO2,204,203,200_PIsitb-sticker-arrow-click,TopRight,35,-76_AA240_SH20_OU09_.jpg"></a><img src="http://www.assoc-amazon.jp/e/ir?t=fladdictnet07-22&#038;l=as2&#038;o=9&#038;a=4797346809" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></p>
  • <div class="feedflare">
  • <a href="http://feeds2.feedburner.com/~ff/jp/fladdict?a=K7iSpBQXdVc:7nVnIWvWqw8:OAQBO0PjnPA"> <img src="http://feeds2.feedburner.com/~ff/jp/fladdict?d=OAQBO0PjnPA" border="0"></img></a> <a href="http://feeds2.feedburner.com/~ff/jp/fladdict?a=K7iSpBQXdVc:7nVnIWvWqw8:spdCosxkSQE"><img src="http://feeds2.feedburner.com/~ff/jp/fladdict?d=spdCosxkSQE" border="0"></img></a> <a href="http://feeds2.feedburner.com/~ff/jp/fladdict?a=K7iSpBQXdVc:7nVnIWvWqw8:2V2C0W9ye1I"><img src="http://feeds2.feedburner.com/~ff/jp/fladdict?i=K7iSpBQXdVc:7nVnIWvWqw8:2V2C0W9ye1I" border="0"></img></a>
  • </div> <img src="http://feeds2.feedburner.com/~r/jp/fladdict/~4/K7iSpBQXdVc" height="1" width="1"/></blockquote>
April 5, 2009

actionscript3でglitchする

via actionscript3でglitchする@hysysk:blog

glitchlena
参考にしたのはこのforum。
Processing 1.0 - glitch art

ヘッダになっているであろう位置をとばして適当な位置のデータを置き換える。
ヘッダの位置予想は適当。ヘッダがあれば、何でもできる。
バイナリのいじり方はflash oopを参考にした。

本当はhex editorみたいに全部展開してちゃんと狙ってglitchさせたいけど、イベント処理が重く分割させる必要がある。これもflash oopにイベントを分割してァ 疋薀乾鷆弊
February 17, 2009

E15:oGFx

via E15:oGFx@hysysk:blog

alpha版出た(Mac OS10.5のみ)。
http://ogfx.mitplw.com/
pythonベースで、processingとかnodeboxみたいな感じで書ける。
アニメーションを実行させながらコードを書き換えられるon the flyなスタイル。

今のところスクリプトの保存はwebに。
http://e15web.media.mit.edu/users/52
この仕組みいい。
見るためには登録しないといけないかも。

保存したらすぐスクリーンショットができてページが作られてる。
そういうところがどうなってるのか気になったり。

何かエラー出た後直してもちゃんと動かなかったり、deleteしたらポインタが変なとこに行ったりして不安定なところがある気がするけど、楽しい。新鮮。
ぁ △隼澆疂