Warning: Declaration of Jetpack_IXR_Client::query() should be compatible with IXR_Client::query(...$args) in /home/clients/7267bc096562fcdb78c0ab60d3ac51fb/web/blog/wp-content/plugins/jetpack/class.jetpack-ixr-client.php on line 91
{"id":428,"date":"2014-12-17T00:00:07","date_gmt":"2014-12-17T00:00:07","guid":{"rendered":"http:\/\/barradeau.com\/blog\/?p=428"},"modified":"2015-01-09T23:55:45","modified_gmt":"2015-01-09T23:55:45","slug":"harriet","status":"publish","type":"post","link":"http:\/\/barradeau.com\/blog\/?p=428","title":{"rendered":"Harriet"},"content":{"rendered":"

“Harriet” is the name of a project I did for the Christmas Experiments 2014<\/a>.<\/p>\n

if you don’t have WebGL,\u00a0you can still\u00a0watch this video:<\/p>\n

<\/iframe><\/p>\nif you do have WebGL, <a href=\"http:\/\/barradeau.com\/harriet\/\" target=\"_blank\">you can try it out here<\/a>.<\/p>\nthere’s a github repo here : <a href=\"https:\/\/github.com\/nicoptere\/harriet\" target=\"_blank\">Harriet’s Github Repo<\/a>. (\u00a0some ugly\u00a0things there… )<\/p>\nthe initial idea was to\u00a0create a generative toy ; a gift for christmas if you will.<\/p>\nI thought of using <a href=\"https:\/\/github.com\/lo-th\/Oimo.js\/\" target=\"_blank\">Oimo.js<\/a>, pile up a set of boxes and balls, then assemble them to represent a plane, a puppet or any old school looking toy. I\u00a0tried using physics last year & didn’t want to spend too much time\u00a0getting things to work. \u00a0instead I wanted to focus on\u00a0making a good-looking generative object &\u00a0realized that mechanic objects were (much) easier to model procedurally.<\/p>\nI sketched some early plane designs which soon reminded me of \u00a0T<a href=\"http:\/\/www.imdb.com\/title\/tt0059797\/?ref_=ttmd_md_nm\" target=\"_blank\">hose Magnificent Men in Their Flying Machines.<\/a><\/p>\nhonestly\u00a0–\u00a0what could go wrong with\u00a0gentlemen like these:<\/p>\n<a href=\"http:\/\/www.imdb.com\/title\/tt0059797\/?ref_=ttmd_md_nm\" target=\"_blank\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-461 size-full\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_0.jpg\" alt=\"tmitfm_0\" width=\"736\" height=\"903\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_0.jpg 736w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_0-244x300.jpg 244w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_0-700x858.jpg 700w\" sizes=\"(max-width: 736px) 100vw, 736px\" \/><\/a> <a href=\"http:\/\/www.imdb.com\/title\/tt0059797\/?ref_=ttmd_md_nm\" target=\"_blank\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-462 size-full\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_1.jpg\" alt=\"tmitfm_1\" width=\"1075\" height=\"860\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_1.jpg 1075w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_1-300x240.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_1-1024x819.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_1-700x560.jpg 700w\" sizes=\"(max-width: 1075px) 100vw, 1075px\" \/><\/a> <a href=\"http:\/\/www.imdb.com\/title\/tt0059797\/?ref_=ttmd_md_nm\" target=\"_blank\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-463 size-full\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_2.jpg\" alt=\"tmitfm_2\" width=\"1056\" height=\"860\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_2.jpg 1056w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_2-300x244.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_2-1024x833.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_2-700x570.jpg 700w\" sizes=\"(max-width: 1056px) 100vw, 1056px\" \/><\/a> <a href=\"http:\/\/www.imdb.com\/title\/tt0059797\/?ref_=ttmd_md_nm\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-464 size-full\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_3.jpg\" alt=\"tmitfm_3\" width=\"697\" height=\"860\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_3.jpg 697w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tmitfm_3-243x300.jpg 243w\" sizes=\"(max-width: 697px) 100vw, 697px\" \/><\/a><\/p>\n( images from <a href=\"http:\/\/www.imdb.com\/title\/tt0059797\/?ref_=ttmd_md_nm\" target=\"_blank\">IMDB<\/a> )<\/p>\nthe ONLY<\/strong> <\/em>word that comes to mind is\u00a0PANACHE<\/strong>!<\/strong><\/em><\/p>\nI always loved the early aircraft designs, from Da Vinci\u2019s\u00a0\u201cornithopter\u201d to the first actual airplanes. for instance this plane is featured in the movie<\/p>\n<img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-455\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/BristolBoxkite_01.jpg\" alt=\"BristolBoxkite_01\" width=\"1200\" height=\"900\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/BristolBoxkite_01.jpg 1200w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/BristolBoxkite_01-300x225.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/BristolBoxkite_01-1024x768.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/BristolBoxkite_01-700x525.jpg 700w\" sizes=\"(max-width: 1200px) 100vw, 1200px\" \/><\/p>\nI find it\u00a0beautiful.<\/p>\nby the way,\u00a0these guys are surely\u00a0amongst\u00a0the\u00a0most daring persons\u00a0I\u2019ve ever seen:<\/p>\n<iframe class='youtube-player' type='text\/html' width='700' height='394' src='https:\/\/www.youtube.com\/embed\/iMhdksPFhCM?version=3&rel=1&fs=1&autohide=2&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent' allowfullscreen='true' style='border:0;'><\/iframe><\/span><\/p>\nthey\u00a0believed it would work,\u00a0the designs are just extraordinary & quite fit for a generative exercise. the algorithm could go as follows:<\/p>\n<ul>\n<li>step 1 do whatever you want<\/li>\n<li>step 2\u00a0Fly it<\/li>\n<\/ul>\nI used my commute time (roughly an hour a day) to sketch very simple plane modules and think of how they could work together.<\/p>\nhere’s an early 2D proof of concept<\/p>\n<iframe loading=\"lazy\" src=\"\/\/player.vimeo.com\/video\/114525899?byline=0&portrait=0\" width=\"720\" height=\"405\" frameborder=\"0\" webkitallowfullscreen mozallowfullscreen allowfullscreen><\/iframe><\/p>\niterating\u00a0it to 3D was\u00a0quite straight forward<\/p>\n<iframe loading=\"lazy\" src=\"\/\/player.vimeo.com\/video\/114525900?byline=0&portrait=0\" width=\"720\" height=\"405\" frameborder=\"0\" webkitallowfullscreen mozallowfullscreen allowfullscreen><\/iframe><\/p>\nfor the wings, I had something like that in mind<\/p>\n<iframe loading=\"lazy\" src=\"\/\/player.vimeo.com\/video\/114526899?byline=0&portrait=0\" width=\"720\" height=\"405\" frameborder=\"0\" webkitallowfullscreen mozallowfullscreen allowfullscreen><\/iframe><\/p>\nat that time, I wanted to call the XP “the Santa Hunt” or something manly, like having The Magnificent men try & catch\u00a0Santa Claus.<\/p>\nthen I stumbled upon this\u00a0<a href=\"https:\/\/twitter.com\/GreatestCapital\/status\/535936257600528385\" target=\"_blank\">https:\/\/twitter.com\/GreatestCapital\/status\/535936257600528385<\/a><\/p>\n<img decoding=\"async\" loading=\"lazy\" class=\"aligncenter\" src=\"https:\/\/pbs.twimg.com\/media\/B3AHL6UIMAMQfZa.jpg:large\" alt=\"\" width=\"400\" height=\"549\" \/><\/p>\noften women are being forgotten in the history of sciences\u00a0(if not simply evicted).\u00a0so I searched for some early Woman Aviator and found Harriet.<\/span><\/p>\n<a href=\"http:\/\/en.wikipedia.org\/wiki\/Harriet_Quimby\" target=\"_blank\">Harriet Quimby<\/a>, the first woman pilot of the U.S.\u00a0also a journalist, a novelist\u00a0&\u00a0a model for a brand of\u00a0grape soda.\u00a0<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/Harriet_Quimby_2.jpg\" data-rel=\"lightbox-image-0\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-430 size-large\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/Harriet_Quimby_2-1024x678.jpg\" alt=\"Harriet_Quimby_2\" width=\"700\" height=\"463\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/Harriet_Quimby_2-1024x678.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/Harriet_Quimby_2-300x198.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/Harriet_Quimby_2-700x464.jpg 700w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/Harriet_Quimby_2.jpg 1920w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/a>born in Arcadia, Michigan ( Arcas, king of Arcadia gave his name to the\u00a0Ursa Minor constellation ), she was the first woman to cross the english channel, she died during a race and her remains were moved to the Kensico cemetery in Valhalla (the warriors’ heaven in the norse Mythology), NYC.<\/p>\nthis is a tribute to her & all the aviator women all over the world.<\/p>\nthen I started porting my old 3d Flash tools ( path, extrusion, lathe, loft etc. ) not because THREE doesn’t have them out of the box but because I knew what the output would be.<\/p>\nafter 2 days reworking the tools, I got this rather satisfying result.<\/p>\n<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tools.jpg\" data-rel=\"lightbox-image-1\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-439\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tools.jpg\" alt=\"tools\" width=\"1251\" height=\"951\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tools.jpg 1251w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tools-300x228.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tools-1024x778.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/tools-700x532.jpg 700w\" sizes=\"(max-width: 1251px) 100vw, 1251px\" \/><\/a><\/p>\nall the shiny materials come from <a href=\"http:\/\/www.clicktorelease.com\/blog\/creating-spherical-environment-mapping-shader\" target=\"_blank\">an article<\/a> by Jaume Sachez Elias ( <a href=\"https:\/\/twitter.com\/thespite\" target=\"_blank\">@thespite<\/a> ) which describes\u00a0a technique to emulate smooth environment\u00a0reflections.\u00a0it works very well &\u00a0I used it almost everywhere. \nI tweaked the shader to add grain when the normal is not facing the camera. <\/p>\nso I had a generative plane & all I needed was a world to explore, I browsed the sketchup user contributed gallery and cherry picked some famous buildings\/landmarks:<\/p>\ngiza sphinx<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=15d917790ca243aa59aed5538305c915\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=15d917790ca243aa59aed5538305c915<\/a><\/p>\ntaj mahal<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=7e5ab22821d331964a9a85aeae80cb94\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=7e5ab22821d331964a9a85aeae80cb94<\/a><\/p>\nstonehenge<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=ed0978da11789022db69a66f47df39c\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=ed0978da11789022db69a66f47df39c<\/a><\/p>\ncolosseum<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=1c056259336d676cf69f18f886bbb404\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=1c056259336d676cf69f18f886bbb404<\/a><\/p>\nstatue of liberty<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=3a04f7e3525c4bcb975c67c9be385344\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=3a04f7e3525c4bcb975c67c9be385344<\/a><\/p>\nchichen itza<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=ec2b87c815b573656c199f3f761967d8\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=ec2b87c815b573656c199f3f761967d8<\/a><\/p>\nsydney opera house<\/p>\n<a href=\"https:\/\/3dwarehouse.sketchup.com\/model.html?id=7f02bc859ad98ba6d22877473727b293\">https:\/\/3dwarehouse.sketchup.com\/model.html?id=7f02bc859ad98ba6d22877473727b293<\/a><\/p>\nthose are (rather) light weight architectural models, I took some time to clean\u00a0&\u00a0scale them up, collected their Longitudes latitudes & off I went.<\/p>\nwell… \nafter a couple of funny mistakes of course :) \n<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_0.jpg\" data-rel=\"lightbox-image-2\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-440\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_0.jpg\" alt=\"earth_0\" width=\"1152\" height=\"1080\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_0.jpg 1152w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_0-300x281.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_0-1024x960.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_0-700x656.jpg 700w\" sizes=\"(max-width: 1152px) 100vw, 1152px\" \/><\/a> <a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_1.jpg\" data-rel=\"lightbox-image-3\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-441\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_1.jpg\" alt=\"earth_1\" width=\"1152\" height=\"1080\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_1.jpg 1152w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_1-300x281.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_1-1024x960.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_1-700x656.jpg 700w\" sizes=\"(max-width: 1152px) 100vw, 1152px\" \/><\/a> <a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_2.jpg\" data-rel=\"lightbox-image-4\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-442\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_2.jpg\" alt=\"earth_2\" width=\"1152\" height=\"1080\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_2.jpg 1152w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_2-300x281.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_2-1024x960.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_2-700x656.jpg 700w\" sizes=\"(max-width: 1152px) 100vw, 1152px\" \/><\/a><\/p>\n(tried the water shader\u00a0&\u00a0abandoned due to a severe lack of time… looked good though…)<\/p>\n<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_3.jpg\" data-rel=\"lightbox-image-5\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-443\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_3.jpg\" alt=\"earth_3\" width=\"1152\" height=\"1080\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_3.jpg 1152w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_3-300x281.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_3-1024x960.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/earth_3-700x656.jpg 700w\" sizes=\"(max-width: 1152px) 100vw, 1152px\" \/><\/a>this is what the earth ended\u00a0up looking like (pink thread is the Spline connecting all landmarks, the white block is a path following thing ).<\/p>\nby the way, if you need a camera to follow a path on sphere\u00a0with the camera’s normal pointing outwards,\u00a0this might\u00a0come in handy:<\/p>\n<pre class=\"lang:js decode:true \" title=\"locate an object along a path at the surface of a sphere\">function locateObject( curve, t, object, earth_radius )\r\n{\r\n\r\n\t\/\/current point\r\n\tvar cp = curve.getPointAt( t );\r\n\r\n\t\/\/lookahead point\r\n\tvar np = curve.getPointAt( ( t +.01 ) % 1 );\r\n\r\n\tvar nrm = cp.clone().normalize();\r\n\tvar dir = np.clone().normalize().sub( nrm ).normalize();\r\n\r\n\tobject.position.copy( cp.multiplyScalar( earth_radius || 1 ) );\r\n\tobject.matrix.lookAt( cp, dir.add( cp ), nrm );\r\n\tobject.rotation.setFromRotationMatrix( object.matrix, object.rotation.order );\r\n\r\n\t\/\/then you can add some extra rotation\r\n\t\/\/object.rotateX( RAD );\r\n\t\/\/...\r\n\r\n}<\/pre>\nthis way the camera can travel the world and keep the ground at the bottom of the screen ^^<\/p>\nfor the environment, I wanted a “creamy iridescent sunrise” ; something that happens early in the morning when you go skiing. I found some sunrise picture, blurred it to death and extracted some of its colors. then I created a grid mesh in illustrator so that it wraps nicely when converted to a cubic environment.<\/p>\n<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/gradients.jpg\" data-rel=\"lightbox-image-6\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-444\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/gradients.jpg\" alt=\"gradients\" width=\"1052\" height=\"788\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/gradients.jpg 1052w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/gradients-300x224.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/gradients-1024x767.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/gradients-700x524.jpg 700w\" sizes=\"(max-width: 1052px) 100vw, 1052px\" \/><\/a><\/p>\nI handled the “2\u00a0by\u00a01 pic to 6 cubic\u00a0tiles” step with 3DS MAX\u00a0as shown\u00a0below (the easiest way to create a cube map imho)<\/p>\n<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/environment_max.jpg\" data-rel=\"lightbox-image-7\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-445\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/environment_max.jpg\" alt=\"environment_max\" width=\"1311\" height=\"954\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/environment_max.jpg 1311w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/environment_max-300x218.jpg 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/environment_max-1024x745.jpg 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/environment_max-700x509.jpg 700w\" sizes=\"(max-width: 1311px) 100vw, 1311px\" \/><\/a><\/p>\nthen I re assembled the 6 cube maps in Photoshop.<\/p>\nthe font is called <a href=\"http:\/\/www.dafont.com\/fr\/rivanna.font?text=Harriet+is+Awesome\" target=\"_blank\">Rivanna<\/a>, I found it on Dafont as well as some decorative elements that I rasterized in Illustrator. they have this Art Nouveau<\/em> touch, that fits the times when Harriet lived.<\/p>\nthe <a href=\"http:\/\/www.freesound.org\/people\/Timbre\/sounds\/168733\/\" target=\"_blank\">soundtrack comes from Freesound<\/a>, I was after something 1900’s, brittle & outdated.<\/p>\nfinally, for the intro I also wanted something like this:<img decoding=\"async\" loading=\"lazy\" class=\"alignnone\" src=\"http:\/\/www.medailledebapteme.fr\/media\/catalog\/product\/cache\/1\/image\/9df78eab33525d08d6e5fb8d27136e95\/m\/e\/medaille-becker-ange-raphael-en-nacre_BCK322002N.jpg\" alt=\"\" width=\"496\" height=\"496\" \/><\/p>\nif you\u00a0don’t know what “kitsch” means, now is the time to check.<\/p>\nthere are very interesting reflections in there though, I wanted to give a ghostly<\/em> look & feel to the portrait which – if I’m still not completely convinced – kind of works.<\/p>\nwhen you face the medallion, you\u00a0see something and when turning around, you’ll see the picture better. that was\u00a0good enough for an intro.<\/p>\nthe thing is still very buggy, I don’t think I’ll fix it (ever).<\/p>\n<a href=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final.png\" data-rel=\"lightbox-image-8\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-446\" src=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final.png\" alt=\"final\" width=\"1920\" height=\"1080\" srcset=\"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final.png 1920w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final-300x168.png 300w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final-1024x576.png 1024w, http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final-700x393.png 700w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" \/><\/a><\/p>\nI\u00a0should\u00a0post a more detailed entry later on but for now,\u00a0enjoy!<\/p>\n","protected":false},"excerpt":{"rendered":"“Harriet” is the name of a project I did for the Christmas Experiments 2014. if you don’t have WebGL,\u00a0you can still\u00a0watch this video: if you do have WebGL, you can try it out here. there’s a github repo here : Harriet’s Github Repo. (\u00a0some ugly\u00a0things there… ) the initial idea was to\u00a0create a generative toy … <a class=\"more-link\" href=\"http:\/\/barradeau.com\/blog\/?p=428\">[Read more…]<\/a><\/span><\/p>\n","protected":false},"author":1,"featured_media":446,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"sharing_disabled":false,"spay_email":"","jetpack_publicize_message":""},"categories":[3],"tags":[],"jetpack_featured_media_url":"http:\/\/barradeau.com\/blog\/wp-content\/uploads\/2014\/12\/final.png","jetpack_publicize_connections":[],"jetpack_shortlink":"https:\/\/wp.me\/s4oXhx-harriet","_links":{"self":[{"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/428"}],"collection":[{"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=428"}],"version-history":[{"count":33,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/428\/revisions"}],"predecessor-version":[{"id":480,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/428\/revisions\/480"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=\/wp\/v2\/media\/446"}],"wp:attachment":[{"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=428"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=428"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/barradeau.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=428"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}