Blog

I’ve been thinking of sharpening my C++ skills for sometimes now, so a while ago I picked up OpenFrameworks.

I made a simple physics engine, just a hint of linear algebra and a few creative iterations, you can have these.

Anyway have a peek at my code.

Resources

2D physics engine tutorial
Math and stuff
Physics stuff

The surge of mobile/desktop optimization has been overwhelmingly demanding lately, but maintaining a consistent performance, weight, and look across all browsers/devices is excruciating painful, especially on mobile.

The one who got really close is Jongmin Kim’s website, which this demo had been inspired from.

So driven by curiosity I made yet another Hipster Gallery employing the latest technology and techniques such as CSS3, Canvas, WebGL, and miscellaneous.

It hasn’t been rigorously tested so expect incompatibility issues here and there, but it works pretty well on Chrome and Apple’s devices.

And have a peek at my code and feel free to use it but please don’t remove my name.

Resources

http://requirejs.org/
http://ricostacruz.com/jquery.transit/
http://backbonejs.org/
http://underscorejs.org/
http://html5boilerplate.com/
https://github.com/fschaefer/Stately.js/
https://github.com/millermedeiros/requirejs-plugins
http://learnboost.github.io/stylus/
https://github.com/GoodBoyDigital/pixi.js
https://github.com/bebensiganteng/jQuery-Keyframes
http://www.greensock.com/get-started-js/
http://www.createjs.com/#!/PreloadJS
http://gruntjs.com/

Versions

0.1 (2013/04/17)
– First version

0.2 (2013/04/18)
– Fixed some css issues
– Removed hover for mobile
– Fixed CSS transform javascript
– Fixed a few implementations on FF
– Added version list

Tested on

Desktop
Chrome 26.0, Firefox 20.0, Safari Version 6.0

Mobile/Tablets
iPad Retina iOS 6.3 Safari + Chrome
iPhone > 4, > iOS 6 Safari + Chrome

This is my first Leap Motion experiment! thank you Leap Motion for delivering this wonderful device to me.

The art was heavily influenced by the talented Robert Hodgin, although it’s nowhere as good as his work.

Leap Motion Experiment #1 from Rahmat Hidayat on Vimeo.

Leap Motion Experiment #2 from Rahmat Hidayat on Vimeo.

For experiment #2 I’ll update the World Matrix as soon as I can.

The frequency sometimes haphazardly fluctuates which can break the interaction but that can be compensated by a simple noise reduction algorithm, also I suspect that they’ll be improving the software on every update.

But overall considering the price and the size, its performance is superb, the latency almost non-existent and is even faster than Kinect.

I’m going to use Cinder for the next experiment, perhaps with C++ performance can be enhanced.

If you want to try it on your own you can download it here, this is my first experiment so expect loads of bug. 🙂

Resources

Leap Motion SDK
Three.js
Leap JS

It’s a bit late but Happy New Year everyone! I’ve made a short montage as new year greeting video.

Please excuse the quality, since I’ve never made any video before.

Ignore the glitches such as camera shakes (invest in those camera stabiliser folks!), inconsistent color tones, and the story veered off after awhile. 🙂

I’ve borrowed the music from Lullatone – Leaves Falling, hopefully there won’t be any copyright issues :p

I’d like to thank Felix Turner for allowing me to steal.. euh.. copy.. I mean adapt his art. 🙂

I’ve learned a lot about WebGL and Three.js from him.

Check it out here.

My first experiment with WebGL, using Three.js and Tweenlite.

After almost 5 years of turbulent life in Dubai, I have finally moved to Japan, the land of the rising Sun as I wished 7 months ago.

Everything is just wonderful in Japan, its majestic nature imbued by the immaculate culture creates a very poetic life in every breath.

I am now working at Katamari and AID-DCC, below is a sneak preview of how ebullient the people are.

Synopsis, the story tells about how an ex-employee makes an inconspicuous cameo throught out the company’s outing, each appearance has a difficulty level and if it’s goes unnoticed it will be rewarded.

And this is their video introduction.

The Starling Clock

Was built on Adobe Air 2.6 platform, click here (Flash warning) to view the site.

HTML5 - Photography Logo

Latest experiment on HTML5, click here to view the site.

I have to say the satisfaction you get from building JS/HTML site is when you preview it on tablets or smart phones, it just works!

HTML5 - Photography Thumbnails View

HTML5 - Photography Portrait View

For anybody who wants to learn JS/HTML I recommend you to delve into these materials;

Resources

http://diveintohtml5.info/
http://jquery.com/
http://html5boilerplate.com/
http://trac.puremvc.org/PureMVC_JS/
http://www.jslint.com/

Pretty straight forward and you can use fancy fonts as well, in the example I’ve used GE SS Two Medium font.

/**
* ...
* @author Rahmat Hidayat
*/
import fl.text.TLFTextField;
import flashx.textLayout.formats.TextLayoutFormat;
import flashx.textLayout.elements.TextFlow;
import flash.text.TextFormat;
import flash.text.AntiAliasType;
import flash.text.FontStyle;
import flash.text.Font;
import flash.text.engine.FontLookup;
import flashx.textLayout.edit.ISelectionManager;
import flashx.textLayout.edit.EditManager;
import flashx.textLayout.edit.SelectionState;
import flashx.textLayout.formats.Direction;

var tField:TLFTextField = new TLFTextField();
var applyFont:Font = new Arabic();

/**
* Things that matter
*/
tField.text = "أغنية لشعبولا عن مقتل معمر القذافي";
tField.direction = Direction.RTL;
tField.width = 300;
tField.x = (stage.stageWidth - tField.width)/2;
tField.y = 100;
tField.wordWrap = true;

tField.embedFonts = true;

addChild(tField)

var tFormat:TextLayoutFormat = new TextLayoutFormat();
tFormat.fontFamily = applyFont.fontName;
tFormat.color	= 0xffffff;
tFormat.fontLookup = FontLookup.EMBEDDED_CFF;
tFormat.fontSize	= 30;

/**
*  Just blindly copy and paste the below
*/

tField.textFlow.invalidateAllFormats();
tField.textFlow.hostFormat = tFormat;

var prevManager:ISelectionManager = tField.textFlow.interactionManager;
var editManager:EditManager = new EditManager();
var sel:SelectionState = new SelectionState(tField.textFlow, 0, tField.text.length);
tField.textFlow.interactionManager = editManager;
editManager.applyLeafFormat(tFormat, sel);
tField.textFlow.interactionManager = prevManager;

tField.textFlow.flowComposer.updateAllControllers();

Japan had been the most peculiar yet fascinating society I’ve ever encountered is not about the Geishas, Kimonos, or Samurais but to its people, to most cultures individualism thrives and is encouraged as a way to behave within a society which often detrimental if had not been supported by a spiritual embodiment.

The Gion Festival (祇園祭)

But in Japan the opposite happens, society is intertwined by a synergy of harmony, honor, and respect. This kind of thinking had happened back in Indonesia during Sukarno’s era, but somehow it has evolved to a shameless and corrupted mentality which has shaped the core mannerism of Indonesia.

IMG_5287.jpg

The preconception that a society would advance in a platonic relationship had never been conceived in this ignorant and self-centered generation, but the model works. Although this is just based on a week of evaluation and nothing is perfect but still it’s beautiful in comparison with other cultures and I wish I could be a part of it.

Yoyogi Hachimangu Shrine