<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>mat janson blanchet &#187; Projects</title>
	<atom:link href="http://jansensan.net/category/projects/feed" rel="self" type="application/rss+xml" />
	<link>http://jansensan.net</link>
	<description></description>
	<lastBuildDate>Fri, 18 May 2012 12:06:59 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>In development: the TUIOPlaybook</title>
		<link>http://jansensan.net/in-development-the-tuioplaybook</link>
		<comments>http://jansensan.net/in-development-the-tuioplaybook#comments</comments>
		<pubDate>Fri, 18 May 2012 12:05:28 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[Personal Works]]></category>
		<category><![CDATA[Projects]]></category>
		<category><![CDATA[Technologies]]></category>
		<category><![CDATA[AS3Signals]]></category>
		<category><![CDATA[FDT]]></category>
		<category><![CDATA[Playbook]]></category>
		<category><![CDATA[RobotLegs]]></category>
		<category><![CDATA[TUIO]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=829</guid>
		<description><![CDATA[As I said in the last post, I am currently building a small project to be published onto the BlackBerry Playbook. I am building it in FDT 5.5, using RobotLegs, AS3Signals and TUIO. Above is a short teaser of my work in progress.]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.youtube.com/watch?v=DMsRshbhszA"><img src="http://img.youtube.com/vi/DMsRshbhszA/2.jpg"></a></p>
<p><a href="http://www.youtube.com/watch?v=DMsRshbhszA">Click here</a> to view the video on YouTube.</p>

<p><br></p>
<p>As I said in the last post, I am currently building a small project to be published onto the BlackBerry Playbook. I am building it in FDT 5.5, using RobotLegs, AS3Signals and TUIO. Above is a short teaser of my work in progress.</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/in-development-the-tuioplaybook/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>News and plans for spring and summer 2012</title>
		<link>http://jansensan.net/news-ss2012</link>
		<comments>http://jansensan.net/news-ss2012#comments</comments>
		<pubDate>Wed, 02 May 2012 02:43:35 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Commercial Works]]></category>
		<category><![CDATA[Conferences]]></category>
		<category><![CDATA[Personal Works]]></category>
		<category><![CDATA[Projects]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=808</guid>
		<description><![CDATA[Summer is almost at our doors, on the calendar at least. It's been a while since I wrote, I have been busy: I've traveled, I've been coding, and I've been trying out a couple of different things. Let me bring you up to date. Flash Gaming Summit 2012 In February, GAMES@CODAME held a contest on [...]]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone" title="Sunny Cali" src="http://jansensan.net/images/blog/post0030-sunny-cali-2.jpg" alt="Sunny Cali" width="640" height="240" /></p>
<p>Summer is almost at our doors, on the calendar at least. It's been a while since I wrote, I have been busy: I've traveled, I've been coding, and I've been trying out a couple of different things. Let me bring you up to date.</p>
<p><strong>Flash Gaming Summit 2012</strong></p>
<p><img class="alignnone" title="Flash Gaming Summit 2012 Speakers" src="http://jansensan.net/images/blog/post0030-speakers.jpg" alt="Flash Gaming Summit 2012 Speakers" width="640" height="360" /></p>
<p>In February, <a href="https://twitter.com/GAMESatCODAME" target="_blank">GAMES@CODAME</a> held a <a href="https://plus.google.com/109609915073582817987/posts/QQxVsaJGuY8" target="_blank">contest</a> on their Google Plus page to win a ticket to the <a title="Flash Gaming Summit" href="http://www.flashgamingsummit.com/" target="_blank">Flash Gaming Summit 2012</a> in March in San Francisco. So after a <a href="https://twitter.com/#!/GAMESatCODAME/status/170677075169124353" target="_blank">tight race</a>, I ended up <a href="https://twitter.com/#!/jansensan/status/170874782018060288" target="_blank">winning the ticket</a>! As I said <a href="http://jansensan.net/leaving-sid-lee">before</a>, video games are something towards which I would like to move, and meeting game devs and hearing them speak of their craft could not have been a better blessing.</p>
<p>I managed to meet with animators, entrepreneurs, devs and all sorts of good people. Some talks were really good, while some others were basically just rants. I personally wished that some of them would have been more technical than business oriented. On that angle, Iain Lobb delivered.</p>
<p>Almost as a fanboy, I made sure that I would meet some public figures in the game devs business, so I chatted a bit with <a href="http://twitter.com/thibault_imbert" target="_blank">Thibault Imbert</a>, <a href="http://twitter.com/brunofonzi" target="_blank">Bruno Fonzi</a>, <a href="http://twitter.com/iainlobb" target="_blank">Iain Lobb</a>, and my compatriot <a href="http://twitter.com/untoldent" target="_blank">Ryan Creighton</a>.</p>
<p>Later in the day, <a href="http://www.kongregate.com/" target="_blank">Kongregate</a> held a party at their offices, where I met other cool devs. When I spoke to <a href="twitter.com/robnet" target="_blank">Rob Bateman</a>, who had earlier given a quite interesting speech in favor of open source, I had to find a way to brag about my Away3D tutorials. By the way Rob, I'm still interested in writing tutorials for Away3D!</p>
<p>The next day, I was also lucky enough to be invited to visit a game dev studio not far outside of San Francisco. It's quite refreshing to see a team of devs and artists really work together, I hadn't felt a relationship this tight when I was working in an advertising agency.</p>
<p><strong>Working with Float4</strong></p>
<p><img class="alignnone" title="Float4's Slideshow" src="http://jansensan.net/images/blog/post0030-slideshow.jpg" alt="Float4's Slideshow" width="640" height="360" /></p>
<p>As you might have understood from some of my tweets and posts, I have been working with <a href="http://float4.com/" target="_blank">Float4</a> in Montréal since January. They specialize in video mapping and interactive surfaces, both with HD resolution or higher. It's quite nice to be able to use high quality graphics rather than being restrained to the small dimensions of the web.</p>
<p>Float4 offers a software, RealMotion, that has many purposes, one of which is to display Flash content. So I mostly have been working in ActionScript 3 for their projects. As Stage3D came to be, we did some tests to see if it would be possible to use within the context of RealMotion. To explain shortly, RealMotion does not incorporate the Flash Player directly. An instance of the Flash Player is launched on a thread, and RealMotion reads the visual output created and displays it on a texture. With Stage3D, that became impossible, since the render is actually done on the GPU directly, and there is no other way to get the render but to try and intercept the visuals directly from the graphic card. When I passed by the Flash Gaming Summit, I asked Thibaut Imbert if he had an idea of how to do this, he referred to PIX, a GPU profiler, but it didn't turn out to be of use on a Windows machine. If you have any suggestion, it would be welcome!</p>
<p>Discovering how to handle multitouch was quite new to me, as I was not used to the possibility that many UI elements could be used at the same time on the same screen. Also, I have been writing for installations where neither a mouse nor a touch screen was used, but rather lasers. In this setup, lasers are scanning a surface in order to determine where the user or users touch.</p>
<p>It may seem like it would not affect how to code, but it's actually quite important! While on a desktop and on a mobile surface it's important to listen to the "up" event (mouse up, touch up), it's not quite logical to do so with lasers, since users would not expect to lift their hand to trigger an action. Therefore, a touch down event acts as a click, and triggers something right away.</p>
<p>In the case of a list–like the iPhone contact list–it's not logical to open the contact as soon as it's touched, since it may be required to scroll. That's why on these device, it's the up event that triggers an action. With lasers, I thought it would be best to introduce the logic of holding the position for a while to launch an action. A timer would start and once a certain amount of time is passed, the action is triggered.</p>
<p>RealMotion communicates with Flash via the <a href="http://www.tuio.org/" target="_blank">TUIO</a> protocol, and its AS3 library, <a href="http://bubblebird.at/tuioflash/tuio-as3-library/" target="_blank">TUIO AS3</a>. The library is open source and quite easy to integrate. Rather than using mouse events, the library comes with its own custom TUIO touch events. What is also quite nice is the guy who manages the library is quite open, listens to comments and adapts accordingly.</p>
<p>But how does one test multitouch during development? It does take time to deploy to the installation every time, and let's be honest, it's not always available to the developer. Luckily, it's possible to install an <a href="http://code.google.com/p/tuiopad/" target="_blank">iPhone app</a> and an <a href="http://code.google.com/p/tuiodroid/" target="_blank">Android app</a> that can turn your device into a multitouch controller for your project. Simply start up the app before you launch your AS3 project, and then they are connect via TCP.</p>
<p>As for projects, I have been working on an update and a localization of a <a href="http://www.flickr.com/photos/float4/sets/72157628191250141/" target="_blank">project for the Canadian government</a> that needed to be displayed in Davos. I hope to obtain some images and footage to add to my portfolio. I also have been working on a slideshow that showcases Float4's portfolio with different AS3 APIs (Vimeo, Flickr, Twitter). You can see a screenshot of that project above this section, I will soon add screenshots to my portfolio. I also have been working on a library that can communicate with RealMotion, so that Float4 can provide clients who want to develop their own content with an API.</p>
<p><strong>An iPhone app on its way</strong></p>
<p><img class="alignnone" title="QRC" src="http://jansensan.net/images/blog/post0030-qrc.jpg" alt="QRC" width="640" height="240" /></p>
<p>For some reason, I decided to go back to try and learn Objective-C. Since there is no better way to learn something than having an actual project, I will soon release my first iOS app! I finally understood how to link visuals to the code, and how to add and remove event handlers. Despite a lot of idiosyncrasies, XCode is a good IDE for the job. The code completion is marvellous, the interface is Apple-like (ie: fine tuned to the bone), but some features for quick coding and ease are missing. I may try and work more in that environment in the future.</p>
<p><strong>A new toy</strong></p>
<p><img class="alignnone" title="BlackBerry Playbook" src="http://jansensan.net/images/blog/post0030-playbook.jpg" alt="BlackBerry Playbook" width="640" height="360" /></p>
<p>During March, BlackBerry had a 50% off deal on their PlayBook tablet. I never really felt the need to own a tablet, and I thought the iPad was way too big and expensive. After attending the Flash Gaming Summit though, I thought that tablets could be an awesome target for games, and that there is no better way to understand how a device works than own and use one.</p>
<p>To my surprise, BlackBerry offers an awesome <a href="https://bdsc.webapps.blackberry.com/air/api" target="_blank">AIR SDK</a> to develop for the PlayBook with their own UI. Smart! I had some <a href="http://bugs.powerflasher.com/jira/browse/FDT-2692" target="_blank">issues</a> while trying to run it on FDT, but <a href="http://supportforums.blackberry.com/t5/Adobe-AIR-Development/FDT-officially-supported-by-the-BlackBerry-10-SDK/td-p/1695615" target="_blank">a recent post</a> on the BlackBerry forums brings some good news for the future.</p>
<p>I think that I may try to create a TUIO controller app for the PlayBook as my first attempt!</p>
<p><strong>Going back to hacking</strong></p>
<p><img class="alignnone" title="Circuit Bending Workshop" src="http://jansensan.net/images/blog/post0030-electronics.jpg" alt="Circuit Bending Workshop" width="640" height="160" /></p>
<p>In the spirit of exploring many things digital and analog, I decided to go back to hacking electronics, as I have done for <a href="http://jansensan.net/portfolio/?keywords=tangible" target="_blank">school projects</a> before.</p>
<p>First, I will attend a <a href="http://www.facebook.com/events/276359105786770/" target="_blank">circuit bending workshop</a> given at the <a href="http://www.easternbloc.ca/" target="_blank">Eastern Bloc</a> in Montréal, and see where that takes me. I hope I will play with my <a href="http://www.arduino.cc" target="_blank">Arduino</a> again. I've also been quite interested into looking into the <a href="http://www.raspberrypi.org/" target="_blank">Raspberry Pi</a>, a more than affordable open source computer.</p>
<p><strong>It may get cloudy</strong></p>
<p><img class="alignnone" title="Cloudy" src="http://jansensan.net/images/blog/post0030-cloudy-2.jpg" alt="Cloudy" width="640" height="240" /></p>
<p>Finally, I thought I should leave you with another tease. I've been doodling and thinking of this little game where a cloud has to water plants and make sure to avoid the sun to not evaporate. The full gameplay is not yet defined, and as you can see I am tackling more than one project at a time. I think this project could be a good excuse to look more into <a href="http://haxe.org/" target="_blank">haXe</a> and <a href="http://www.haxenme.org/" target="_blank">NME</a>.</p>
<p>What have you been up to?</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/news-ss2012/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Post Mortem: The ToDo List</title>
		<link>http://jansensan.net/post-mortem-the-todo-list</link>
		<comments>http://jansensan.net/post-mortem-the-todo-list#comments</comments>
		<pubDate>Thu, 28 Jul 2011 21:16:33 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Personal Works]]></category>
		<category><![CDATA[Post Mortem]]></category>
		<category><![CDATA[Projects]]></category>
		<category><![CDATA[Facebook]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=535</guid>
		<description><![CDATA[So here it is, the personal project I mentioned a while back: the ToDo List. Doing personal projects, without the constraints of client requests and deadlines is loads of fun, but also not always efficient. Let's have a look at the lessons I learned during this project. What is the ToDo List? The idea for [...]]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter" title="The ToDo List" src="http://the-todo-list.com/assets/images/todo_list_logo_gray.png" alt="The ToDo List" width="360" height="80" /></p>
<p>So here it is, the personal project I mentioned a while back: <a title="The ToDo List" href="http://the-todo-list.com/" target="_blank">the ToDo List</a>. Doing personal projects, without the constraints of client requests and deadlines is loads of fun, but also not always efficient. Let's have a look at the lessons I learned during this project.</p>
<p><strong>What is the ToDo List?</strong></p>
<p>The idea for this Facebook application came from a discussion with art director <a title="Max Chanan" href="http://www.maxchanan.com/" target="_blank">Max Chanan</a>. We were thinking that there are always people in your Facebook friends that are not exactly your friends, but more acquaintances. However, it may also happen that you added said acquaintances to your Facebook contacts solely in the hopes of getting with them. Let's face it, either we ourselves have spied upon friends of friends that we think are hot, or we know someone who has.</p>
<p>And then I built the ToDo List, which allows you to select friends that you would like to do–pun totally intended.</p>
<p><img class="aligncenter" title="The ToDo List" src="http://jansensan.net/images/blog/post0025_001.jpg" alt="The ToDo List" width="640" height="464" /></p>
<p>The application, which currently resides on a Facebook app page, allows users to select up to four of their friends. That list stays secret, it is not shared with anyone else.</p>
<p>Secrecy is of the utmost importance in this project. How creeped out would a girl be if suddenly she received notifications that some five boys put her on a list of girls they would like to do? I can bet that she would be very upset.</p>
<p>But then, how does it work?</p>
<p>Well, let's say:</p>
<ul>
<li>Boy A selects girls A, B and C</li>
<li>Girl A does not use the ToDo List</li>
<li>Girl B uses the app, but has not selected boy A</li>
<li>Girl C uses the app and has selected boy A</li>
</ul>
<p>In the case of girl A, nothing will happen. In the case of girl B, nothing will happen either, because she did not select boy A. As we can see however, boy A and girl C mutually chose each other, this is where the magic happens.</p>
<p>On every Thursday of the week, a check is made to see who has selected who. If a match is made, then both users received an email notification informing them that they have been chosen by one of their choices.</p>
<p><img class="aligncenter" title="Match email" src="http://jansensan.net/images/blog/post0025_003.jpg" alt="Match email" width="640" height="184" /></p>
<p>Why Thursday and not instantly? Well, first of all, I like to think of this app almost like a poker game. You bet that these people you have selected may have selected you back. This list is like your hand. If at the deadline, on Thursday, your hand is not a winning one, you can change your selection for next round, on the followig Thursday.</p>
<p>When I was discussing with <a title="Martin Gauthier on Twitter" href="http://twitter.com/martingauthier" target="_blank">Martin Gauthier</a> about this app, he thought of something brilliant: In this world where everyone wants instant gratification, it's nice to have a bit of wait and anticipation before you see if you win or lose.</p>
<p><strong>Choosing a technology</strong></p>
<p>Having built a couple of projects in Flash, I thought at first that I would build this one in Flash too. When I was working on the Swarovski's Reflect Yourself Facebook app, I learned a bit on how to communicate with the Facebook API in AS3. But as usual, Facebook changed their API and did not document it clearly. I was tangled in too many different versions of both the <a title="Facebook AS3 API" href="http://code.google.com/p/facebook-actionscript-api/" target="_blank">Facebook AS3 API</a>, Flash was not right for this project.</p>
<p>Basically, what one needs to communicate with Facebook is an authorization from the user to sift through a certain amount of information. Once the user has authorized your apps with a certain amount of rights, there is a token that is created, and this token has to be provided in the calls to the Facebook API.</p>
<p>Facebook has a PHP API, so I started looking into this. I tried and failed at doing simple calls, like retrieving friends, but I did manage to get the token.</p>
<p>By then, Facebook had developed the <a title="Facebook Graph API" href="http://developers.facebook.com/docs/reference/api/" target="_blank">Graph API</a>, making things a lot, wait, A LOT simpler. A call to the Graph API is basically just a URL that returns a <a title="JSON" href="http://www.json.org/" target="_blank">JSON</a> object.</p>
<p>From then, I thought of a simple workflow:</p>
<ol>
<li>Get the user to authorize the app</li>
<li>Use the Facebook PHP library to get a session and a token</li>
<li>Make all other calls to the Facebook API using jQuery to <a title="jQuery Documentation - get" href="http://api.jquery.com/jQuery.get/" target="_blank">get</a> the data</li>
</ol>
<p>The project then became fun to do! A healthy mix of contemporary web techs, no plugin necessary. It's pretty nice, especially since I needed scrollbars and buttons, so they can then use the native browser interface and feel like they fit in Facebook.</p>
<p>It also means this works on mobile, although that is just a happy accident. The project is not optimized one bit for mobile. More on that later.</p>
<p><strong>Discoveries</strong></p>
<p>So obviously, I did some technical discoveries, but also some strategy- and PR-related discoveries. It may seem obvious to a lot of us (I even have spoken to that effect <a title="Simple share functionality for multiple=">previously</a>), but word of mouth is not easy! It's almost impossible to make your project grow when you count only on the social networks like Facebook and Twitter. Without publicity, people don't go to your website.</p>
<p>Now, it would be unfair to say that I had no publicity whatsoever. Let's not get confused, it is a personal project, through and through, but I built it as I was still working at <a title="Sid Lee" href="http://www.sidlee.com/" target="_blank">Sid Lee</a>. As such, <a title="Jean-François Bouchard on Twitter" href="http://twitter.com/jfbouchard" target="_blank">Jean-François Bouchard</a>, president of the agency, offered me to talk about the project on the platforms to which he has access if I simply branded it as a "Sid Lee Collective" project. Sid Lee sometimes encourage their employees to work on personal projects. They may support it financially or by other means if they find said project interesting. In my case, I did not need any financial support, but I gladly accepted the simple branding since it allowed me some visibility.</p>
<p style="text-align: center; margin-bottom: 16px;"><img title="Sid Lee's Facebook post about the ToDo List" src="http://jansensan.net/images/blog/post0025_006.jpg" alt="Sid Lee's Facebook post about the ToDo List" width="344" height="602" /></p>
<p>So such a public support indeed provided me with a lot of visitors onto the project, which is awesome. From then on though, I should have found a way to continually bring new visitors, but I did not, and this is what the analytics show.</p>
<p style="text-align: center;"><img title="Three months on Google Analytics" src="http://jansensan.net/images/blog/post0025_005.jpg" alt="Three months on Google Analytics" width="640" height="145" /></p>
<p>Something surprised me: even with all those visitors, not a lot of people dared to use the app. Is it because they do not trust a Facebook app? Is it because the subject matter is too racy? I'm not sure I will know. I did end up in an interesting debate with <a title="Christelle Samson on Twitter" href="http://twitter.com/christ_elle" target="_blank">Christelle Samson</a> about how legitimate is this app for people who are in a relationship. My take stays that if people want to cheat on their "loved" one, tools are not to blame.</p>
<p>Another user asked me a good question: will the app post anything on his profile? As said earlier, secrecy is of the utmost importance with this app. However, when one starts to use a Facebook app, a post is necessarily placed on the user's wall saying that he started using that app. Last I checked, it was not something that the developer could set to not happen.</p>
<p>Overall, the app has relatively the same amount of users (some 300) and matches (some 30 matches every week) since the start. This leads me to believe that people are not really adventurous, most of them probably selected their girlfriends or boyfriend, and did not change their list since.</p>
<p><strong>Future iterations</strong></p>
<p>Even though there is no imperative to do so, I want to move the app out of its Facebook placeholder and onto its own domain, which I already own anyways. I think that design wise and user experience wise, this will be better. The functionalities will stay the same, but it will feel less as a page living under Facebook and more like a real web app.</p>
<p>However, moving the app onto the domain is not the most interesting project I have. I have recently started following Objective-C tutorials, and I think that this app could be quite interesting, if not more appealing, if there was an iOS app for it. So I started mocking up the information architecture. You can expect me to eventually post more info about this.</p>
<p><strong><img class="aligncenter" title="Notes for the ToDo List iPhone app" src="http://jansensan.net/images/blog/post0025_004.jpg" alt="Notes for the ToDo List iPhone app" width="640" height="480" /></strong></p>
<p><strong>Conclusion</strong></p>
<p>After three months, I see that this project needs more support if I want to make it live. The iOS app and the website are a good step in that direction I believe. It would be awesome if I could eventually sell this to some online dating company. For now, I still take this project as a lab to learn more techs.</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/post-mortem-the-todo-list/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Leaving Sid Lee</title>
		<link>http://jansensan.net/leaving-sid-lee</link>
		<comments>http://jansensan.net/leaving-sid-lee#comments</comments>
		<pubDate>Mon, 09 May 2011 08:36:12 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Commercial Works]]></category>
		<category><![CDATA[Opinion]]></category>
		<category><![CDATA[Personal Works]]></category>
		<category><![CDATA[Projects]]></category>
		<category><![CDATA[Sid Lee]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=533</guid>
		<description><![CDATA[So this is it. After some three years working with Sid Lee I have decided to move on to other challenges. I was hired by Sid Lee in Montréal in spring some three years ago as an interactive developer. A year and a half later, I was transferred to the Amsterdam workshop where I eventually [...]]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter" src="http://jansensan.net/images/blog/post0023_001.jpg" title="Mat ♥ Sid" alt="Mat ♥ Sid" width="640" height="112" /></p>
<p>So this is it. After some three years working with <a href="http://sidlee.com" target="_blank">Sid Lee</a> I have decided to move on to other challenges. I was hired by Sid Lee in Montréal in spring some three years ago as an interactive developer. A year and a half later, I was transferred to the Amsterdam workshop where I eventually became one of the technical leads. I was part of the team that would provide technical council, brainstorm during creation and either assist or develop during production, depending on the needs and resources.</p>
<p>I would be lying if I did not say that I learned a great deal there. From advertising principles to dealing with many fields (strategy, design, accounting, etc.), I now understand the full creative flow from client requests to agency concepts to customer's view.</p>
<p>Sid Lee also put a lot of confidence in me in giving me a lot of cool projects. I hadn't been long with them that I was part of the creative team to redo their whole portfolio! I worked on beautiful projects such as Cirque du Soleil's Criss Angel's Believe website, the adidas Women's Lookbook SS10. Actually, most of <a href="http://jansensan.net/portfolio" target="_blank">my portfolio</a> currently consists of work done with Sid Lee.</p>
<p>There is also quite an awesome culture at Sid Lee, one I have never seen before. Never before had I been invited to a VP's house for a BBQ, never before could I share a random drink with a partner and talk shit about anything. The people that work there are amazing and talented, so much so that there is no way you can brag about your feats, since everybody rocks.</p>
<p><strong>Not everything is edible in the garden</strong></p>
<p><img class="aligncenter" src="http://jansensan.net/images/blog/post0023_002.jpg" title="Sid Lee's Green Room" alt="Sid Lee's Green Room" width="640" height="200" /></p>
<p style="font-size:10px; text-align: right;">Photo by <a href="http://anttikupila.com/" target="_blank">Antti Kupila</a></p>
<p>Just as in any position, there are awesome moments and awful moments working for Sid Lee. Sometimes, communication or workflows are broken, expectations from many parties are excessive or off. I will not rip them here, for it will serve no purpose and I do not hold a grudge against anyone there.</p>
<p>There is one thing I did expect however. As I was hired because I have a passion for tangible computing and installation arts, I thought I would have the time/be given the opportunity to suggest paths or explore these axes.</p>
<p>I have come to understand that clients fear experimental technologies or ideas. In the end, technological feats, experiments or artful pieces are not what clients want, but rather they want to simply leverage technology to sell more of their product.</p>
<p>Which is totally normal for them, but not for me. I need to explore, I need to learn, I need to play with things, with visuals, with the tangible. Maintenance or back end is not what I am interested in doing. I need to create and build, I need to see the results of what I am building.</p>
<p><strong>Will the grass really be greener on the other side?</strong></p>
<p><img class="aligncenter" src="http://jansensan.net/images/blog/post0023_003.jpg" title="The SoundPlant" alt="The SoundPlant" width="640" height="320" /></p>
<p>So I want to move on, but move on to what? For one thing, I would really like to steer away from the web. As I said earlier, clients simply want to drive their sales. Clients do not want to sell the interactive part, they want the interaction to convert users into customers.</p>
<p>Game development would be, for me, the next logical step. It may be a romantic idea, but I believe that in this field, the interaction IS what you want to sell. This may motivate me to push my boundaries and work.</p>
<p>I would also like to go back and try to build more tangible pieces. I have dabbled in the past with sensors connected to Arduinos, Max/MSP, room-sized installations, lights, speakers, etc. Dirtying my hands while building something that is not just virtual may be a good move too.</p>
<p>If at all possible, living off <a href="http://soundcloud.com/jansensan" target="_blank">my music</a> or musical skills would be the best. It has nothing to do with the content of this blog really, but it is still part of me, and a possible future path.</p>
<p><strong>Toil the soil and plant seeds</strong></p>
<p>So, all these ideas, but what now? Well, I am heading back home to Montréal in June and I actually plan to take all of summer off, as a sabbatical. I will play with some techs, read and try gaming logics and ideas, go back to the drawing board—both litteraly and figuratively.</p>
<p>When I went to Flash on the Beach, as <a href="http://jansensan.net/flash-on-the-beach-2010-the-aftermath">I mentionned before</a>, <a href="http://sagmeister.com/" target="_blank">Stefan Sagmeister</a>'s talk, <a href="http://www.ted.com/talks/stefan_sagmeister_the_power_of_time_off.html" target="_blank">The Power of Free Time</a>, had a great impact on me.</p>
<p style="text-align: center;"><!--copy and paste--><object width="446" height="326"><param name="movie" value="http://video.ted.com/assets/player/swf/EmbedPlayer.swf"></param><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always"/><param name="wmode" value="transparent"></param><param name="bgColor" value="#ffffff"></param><param name="flashvars" value="vu=http://video.ted.com/talks/dynamic/StefanSagmeister_2009G-medium.flv&su=http://images.ted.com/images/ted/tedindex/embed-posters/StefanSagmeister-2009G.embed_thumbnail.jpg&vw=432&vh=240&ap=0&ti=649&lang=eng&introDuration=15330&adDuration=4000&postAdDuration=830&adKeys=talk=stefan_sagmeister_the_power_of_time_off;year=2009;theme=speaking_at_tedglobal2009;theme=art_unusual;theme=might_you_live_a_great_deal_longer;theme=what_makes_us_happy;theme=the_creative_spark;theme=unconventional_explanations;theme=not_business_as_usual;theme=tales_of_invention;event=Tales+of+Invention;tag=Design;tag=adventure;tag=art;tag=creativity;tag=happiness;tag=innovation;tag=work;&preAdTag=tconf.ted/embed;tile=1;sz=512x288;" /><embed src="http://video.ted.com/assets/player/swf/EmbedPlayer.swf" pluginspace="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" bgColor="#ffffff" width="446" height="326" allowFullScreen="true" allowScriptAccess="always" flashvars="vu=http://video.ted.com/talks/dynamic/StefanSagmeister_2009G-medium.flv&su=http://images.ted.com/images/ted/tedindex/embed-posters/StefanSagmeister-2009G.embed_thumbnail.jpg&vw=432&vh=240&ap=0&ti=649&lang=eng&introDuration=15330&adDuration=4000&postAdDuration=830&adKeys=talk=stefan_sagmeister_the_power_of_time_off;year=2009;theme=speaking_at_tedglobal2009;theme=art_unusual;theme=might_you_live_a_great_deal_longer;theme=what_makes_us_happy;theme=the_creative_spark;theme=unconventional_explanations;theme=not_business_as_usual;theme=tales_of_invention;event=Tales+of+Invention;tag=Design;tag=adventure;tag=art;tag=creativity;tag=happiness;tag=innovation;tag=work;"></embed></object></p>
<p>When I choose to get back to the world of the working, I will not return as a full time worker. I realize that now, I need time to balance work and creation. Akin to <a href="http://www.slate.com/id/2274736/" target="_blank">how many women do it in the Netherlands</a> by working either part time or not all, by choosing their personal life and emancipation before work.</p>
<p>I feel lucky that I stumbled upon that talk from Mike Monteiro, Design Director, and co-founder of <a href="http://www.muledesign.com/" target="_blank">Mule Design Studio</a>: <a href="http://vimeo.com/22053820" taget="_blank">Fuck You. Pay Me.</a></p>
<p style="text-align: center;"><object width="640" height="360"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=22053820&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=22053820&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="640" height="360"></embed></object></p>
<p>I understand he speaks in harsh words, but warnings like these may help me greatly when I decide to jump into the world of freelancing.</p>
<p>But will I freelance? If so, will it be in the web, in games, in installations? Would I go back to give tutorials on web technologies in colleges? Or maybe go down a more creative path? After all, it does not matter. <a href="http://twitter.com/iainlobb" target="_blank">Iain Lobb</a> retweeted <a href="http://twitter.com/mworch" target="_blank">Matthias Worch</a> recently, which totally comforted me in my choice of jumping into the unknown:</p>
<p><img class="aligncenter" title="Matthias Worch - Questioning your creative development?" src="http://jansensan.net/images/blog/post0023_004.jpg" alt="Matthias Worch - Questioning your creative development?" width="640" height="220" /></p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/leaving-sid-lee/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Flash on the Beach 2010 &#8211; The Aftermath</title>
		<link>http://jansensan.net/flash-on-the-beach-2010-the-aftermath</link>
		<comments>http://jansensan.net/flash-on-the-beach-2010-the-aftermath#comments</comments>
		<pubDate>Fri, 01 Oct 2010 11:00:01 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Conferences]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[Opinion]]></category>
		<category><![CDATA[Projects]]></category>
		<category><![CDATA[Technologies]]></category>
		<category><![CDATA[Workflow]]></category>
		<category><![CDATA[FDT]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Flash Builder]]></category>
		<category><![CDATA[Flash on the Beach]]></category>
		<category><![CDATA[IntelliJ IDEA]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=405</guid>
		<description><![CDATA[This week I was fortunate enough to attend Flash on the Beach in Brighton. The sessions there ranged from super technical code demonstrations to game development taxonomy, from project management to creative thought processes. Of the tech stuff Since my blog is mostly about technical stuff (i.e. code tips, tutorials), it goes without saying that [...]]]></description>
			<content:encoded><![CDATA[<p><img class="alignleft" style="margin-right: 16px;" title="Flash on the Beach entrance" src="http://sphotos.ak.fbcdn.net/hphotos-ak-snc4/hs265.snc4/39571_433008141668_575386668_5705128_130956_n.jpg" alt="Flash on the Beach entrance" width="320" height="428" />This week I was fortunate enough to attend <a title="Flash on the Beach" href="http://www.flashonthebeach.com/" target="_blank">Flash on the Beach</a> in <a title="Brighton" href="http://www.visitbrighton.com/" target="_blank">Brighton</a>. The sessions there ranged from super technical code demonstrations to game development taxonomy, from project management to creative thought processes.</p>
<p><strong>Of the tech stuff</strong></p>
<p>Since my blog is mostly about technical stuff (i.e. code tips, tutorials), it goes without saying that the technical side of the conference is quite important.</p>
<p>Speakers such as <a title="quasimondo.com" href="http://www.quasimondo.com/" target="_blank">Mario Klingemann</a>, <a title="automatastudios.com" href="http://automatastudios.com/" target="_blank">Branden Hall</a>, <a title="blog.joa-ebert.com" href="http://blog.joa-ebert.com/" target="_blank">Joa Ebert</a> and <a title="unitzeroone.com" href="http://www.unitzeroone.com/" target="_blank">Ralph Hauwert</a> presented quite interesting  technical talks about impressive mathematical and code creations and prowesses. I'm not gonna explain them here, you can read about it in details on their blog.</p>
<p>Evidently, Adobe had their representatives there. At the beginning of the conference, they boasted some updates on Flash Builder, but the more I look at it, the more it feels like they are simply trying to catch up with FDT.</p>
<p>As an attendee, I was lucky enough to receive a free version of <a title="FDT" href="http://www.fdt.powerflasher.com/" target="_blank">FDT Pure</a>. I will look into it in the coming weeks and most probably will talk about it in future posts.</p>
<p>IntelliJ also had their booth set up to promote their IDE, although I have to say i have not looked much into it.</p>
<p>Some speakers, like André Michelle, were making their code available. Being a musician myself, I will probably look into <a title="Tonfall" href="http://tinyurl.com/tonfall" target="_blank">his library</a> for sound manipulation and creation. Branden Hall presented a JS framework that uses the same logic as AS3's bitmaps to draw. He dubbed it Okapi, and I believe that this is the <a title="okapijs.org" href="http://www.okapijs.org/" target="_blank">blog-to-be</a> for it. He also presented the <a title="HYPE Framework" href="http://www.hypeframework.org/" target="_blank">HYPE framework</a>, which has a really interesting simplified approach to timing.</p>
<p>On Tuesday morning, there was a session called the Elevator Pitch, which is basically an hour made up of three minutes presentation of all sorts. Not all of these were interesting (most were not actually), but some caught my eye. I will definitely look into <a title="xJSFL.com" href="http://www.xjsfl.com/" target="_blank">xJSFL</a>, a jQuery-like syntax to write JSFL. There was also this concept of <a title="Doomsday Console" href="http://centralcontrol.doomsday.no/console/" target="_blank">a console to aid development</a>, just like game devs have. Well worth a look. But to all of those who try to create a new AS3 IDE with AIR, please let it go. That is not worth your efforts.</p>
<p>There were two people who touched quickly on tangible computing with microcontrollers and MIDI controllers. I believe that there should be a bigger space given to that world in conferences like this one, as the world of physical computing is huge and I believe way more creative than the interactive screen-based works.</p>
<p><strong>Of creativity</strong></p>
<p>One thing I was not quite prepared for was how blown away I was by the creativity of some people!</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="640" height="360" 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=15271355&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed type="application/x-shockwave-flash" width="640" height="360" src="http://vimeo.com/moogaloop.swf?clip_id=15271355&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=ffffff&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p><a href="http://vimeo.com/15271355">FOTB 2010 Titles</a> from <a href="http://vimeo.com/superfad">Süperfad</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
<p>Nando Costa and his team created the titles for this year's edition of Flash on the Beach. He also presented the impressive quality of his agency's work, Süperfad, which revolves a lot around motion design.</p>
<p><a title="Grant Skinner" href="http://gskinner.com/blog/" target="_blank">Grant Skinner</a> is one of the rare public figures that makes me proud to be Canadian. He presented some of his works obviously, but I really liked how he chose to harness moments of short attention span into efficient creative moments. I have been interested in physical computing for quite some time now, I find it fascinating that such a guy is having fun with those things with projects such as his multiplayer <a title="Grant Skinner's Androideroids" href="http://www.gskinner.com/blog/archives/2010/06/androideroids.html" target="_blank">Androideroids</a> and the <a title="Grant Skinner's Nexus One Gas Pedal" href="http://www.gskinner.com/blog/archives/2010/06/air_for_android.html" target="_blank">Nexus One Gas Pedal</a>.</p>
<p><a title="Robert Hodgin" href="http://www.flight404.com/blog/" target="_blank">Robert Hodgin</a>'s efforts are quite commendable, the results of his creations are impressively beautiful and mesmerizing, but I have to say I find myself puzzled as to what to think of his generative art–which by the way is used for the iTunes visualizer. People like <a title="Joshua Davis" href="http://www.joshuadavis.com/" target="_blank">Joshua Davis</a> and <a title="Jared Tarbell - levitated.net" href="http://levitated.net/" target="_blank">Jared Tarbell</a> turn these pieces into prints, maybe he does as well, but I guess all that coding creativity is not reaching me much.</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="640" height="385" 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://www.youtube.com/v/-0Xa4bHcJu8?fs=1&amp;hl=en_US" /><param name="allowfullscreen" value="true" /><embed type="application/x-shockwave-flash" width="640" height="385" src="http://www.youtube.com/v/-0Xa4bHcJu8?fs=1&amp;hl=en_US" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p>Cyriak presented a lot of his wacky animations and videos. That man's mind is impressively twisted! Funny to see that since a lot of his works were refused, he started working on personal projects, and then got noticed! That's a good lesson really.</p>
<p><img title="Stefan Sagmeister at Flash on the Beach" src="http://jansensan.net/images/blog/post0017_001.jpg" alt="Stefan Sagmeister at Flash on the Beach" width="640" height="320" /></p>
<p>One man really impressed me. I come from the indie rock and the media art world, so public figures in design and publicity are quite foreign to me. <a title="Stefan Sagmeister" href="http://www.sagmeister.com/" target="_blank">Stefan Sagmeister</a> is well known I found out. His thoughts, his approach to work and life are equally impressive. He balances defines balanced moments in one's life between work and sabbaticals, which he explains refuels creativity.</p>
<p><img class="alignnone" title="Jared Tarbell throwing his small wooden cubes to the crowd" src="http://jansensan.net/images/blog/post0017_002.jpg" alt="Jared Tarbell throwing his small wooden cubes to the crowd" width="640" height="320" /></p>
<p>The last session was Jared Tarbell. He explained how he turned his work into physical pieces, either prints or laser cuts. The work is nice, but I have to say the passion that this man conveys and puts into his work are far more impressive. Once you hear him talk about his environment and process, you can't help but feel all that passion emanating from the small pieces of wood and cardboard he created.</p>
<p><strong>Of the human side</strong></p>
<p>Some sessions were also about other things than code or creativity, but also about subjects like management, presentation and work environments. During the Elevator Pitch, <a title="Trine Falbe" href="http://www.trinefalbe.com/" target="_blank">Trine Falbe</a> gave tips on how to better one's presentations.</p>
<p><a title="Chris Pelsor" href="http://www.snogboggin.com/" target="_blank">Chris Pelsor</a> did a good presentation on how to properly manage teams. The simple question of "how often do you share a drink with a colleague?" is quite revealing. I have to admit that some things that I take for granted may indeed be improved upon in other work environments. Creating team spirit is always important.</p>
<p>Joshua Hirsh, of NYC's <a title="Big Spaceship" href="http://www.bigspaceship.com/" target="_blank">Big Spaceship</a> presented an experiment him and his agency conducted. As summers are usually a bit less busy, they decided to try and reserve fridays for internal and personal projects. It turned out it kinda worked and kinda didn't work, obviously due to all sorts of commercial and professional reasons. I have to say that organizing downtime is indeed not easy, but providing the opportunity for employees is important. Working at <a title="Sid Lee" href="http://sidlee.com" target="_blank">Sid Lee</a> give me that opportunity and allowed me during this summer to try and play with some technologies.</p>
<p>If there is one thing that this conference made me realize is that I am not a PR person at all, but then again I wasn't the only one.</p>
<p><img class="alignnone" title="Influxis Lounge at Flash on the Beach" src="http://sphotos.ak.fbcdn.net/hphotos-ak-snc4/hs245.snc4/39571_433008251668_575386668_5705147_1099088_n.jpg" alt="Influxis Lounge at Flash on the Beach" width="640" height="478" /></p>
<p>Many of us were hanging out in the lounge area, next to each other but looking at our mobile phones. I am in no way blaming people, I was doing the same, unfortunately. I guess that is a skill that I should develop. That said, I was quite happy to meet freelancers and technical directors from Paris, I will have to force myself to keep contact better.</p>
<p>On a side note, I was quite happy that I got to see my good friend <a title="James Paterson" href="http://www.presstube.com/" target="_blank">James Paterson</a>! He was giving a workshop on Sunday and was leaving on Monday, so I managed to catch a glimpse of him Monday morning.</p>
<p><strong>Of the future</strong></p>
<p>Now that this event is over, what to do with all this inspiration and motivation?</p>
<p>Well I for one will list all the projects I have started, personal or professional, and see what I want to do with them and where I want to lead them. I am not going to do this here in full extent, but you may interested to know that I have such things as a personal Facebook app project and a pixel-based fangame in the works.</p>
<p>This blog is by no means changing it's vocation. As stated before, I started writing this as guides and notes for when I started giving AS workshops in Montréal. I may commit to write more often about more technologies and creative uses for them though.</p>
<p>And who knows what else?</p>
<p>As for Flash on the Beach, there are some minor things I could see would make it better. The bar section where everybody meets could have benefited from a DJ, whether it's an actual one or simply a playlist, it would have greatly improved on the mood. As I understand there was a <a title="Spotify" href="http://www.spotify.com/" target="_blank">Spotify</a> collaborative playlist to which people contributed a lot, this could have played there.</p>
<p>I also believe that there could have been more cross pollination. It is indeed important that Flash on the Beach promotes the Flash ecosystem, that is a big part of its existence, but I believe that there should more and more presence of interactive works that come from other environments and languages. I would love to see some installations and touch screen in the lobby for people to enjoy what else the computer has to bring than just screen based works.</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/flash-on-the-beach-2010-the-aftermath/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Communication between AS3 and Max/MSP/Jitter</title>
		<link>http://jansensan.net/communication-between-as3-and-max-msp-jitter</link>
		<comments>http://jansensan.net/communication-between-as3-and-max-msp-jitter#comments</comments>
		<pubDate>Thu, 27 May 2010 15:37:08 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Projects]]></category>
		<category><![CDATA[Technologies]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Max/MSP/Jitter]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=298</guid>
		<description><![CDATA[A while back, I thought of adding a touch screen film onto my laptop's screen, so I could use Max/MSP/Jitter's incredible sound processing tools and interface more easily than keyboard and mouse in the context of an installation or a performance. It turns out that a couple of years later, screens are touchable more easily, [...]]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone" title="Communication between AS3 and Max/MSP/Jitter" src="http://jansensan.net/images/blog/post0014_001.jpg" alt="Communication between AS3 and Max/MSP/Jitter" width="640" height="128" /></p>
<p>A while back, I thought of adding a touch screen film onto my laptop's screen, so I could use <a title="Max" href="http://cycling74.com/products/maxmspjitter/" target="_blank">Max/MSP/Jitter</a>'s incredible sound processing tools and interface more easily than keyboard and mouse in the context of an installation or a performance. It turns out that a couple of years later, screens are touchable more easily, although I have yet to find a tablet that will be interesting enough for me to buy and want to use with Max.</p>
<p>Nevertheless, I had fiddled around with AS3 to communicate with Max. I had planned for a while to write a post about this, but I thought it was more important to present how to start and manage a project. What I will present here is how to communicate data between the two software, and since Max is a desktop installation, I will create a pure AS3 <a title="Adobe Air" href="http://www.adobe.com/products/air/" target="_blank">Air</a> project.</p>
<p>Just to give credit where credit is due, steps to create the Air project are mostly taken from <a title="Easily Create a Pure AS3 AIR Project in Flash Builder 4" href="http://swfhead.com/blog/?p=380" target="_blank">here</a>. Let's have at it now!</p>
<p><strong>Create an Air Project</strong></p>
<p style="text-align: center;"><img class="aligncenter" title="Create an Air Project (step 1)" src="http://jansensan.net/images/blog/post0014_002.jpg" alt="Create an Air Project (step 1)" width="640" height="709" /></p>
<p>Let's first create a Flex project in Flash Builder 4. Right-click in the package explorer window, select "New &gt; Flex Project". Make sure that you check the "Desktop (runs in Adobe Air)" option in the "Application type" subsection, you do not want to make a web project.</p>
<p style="text-align: center;"><img class="aligncenter" title="Create an Air Project (step 2)" src="http://jansensan.net/images/blog/post0014_003.jpg" alt="Create an Air Project (step 2)" width="640" height="818" /></p>
<p>In the next window, leave the "Output folder" field as is and click "Next". Then, in the "Main application" field, change the .MXML extension to .AS and click "Finish."</p>
<p>As a habit, I always have a initStage() function. In Air, you need to spawn an actual window, something we never do for the web. This is the perfect place to do so.</p>
<p>ActionScript 3.0:</p>
<blockquote>
<pre class="actionscript"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> initStage<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #808080; font-style: italic;">// first, spawn a window</span>
	<span style="color: #0066CC;">stage</span>.<span style="color: #006600;">nativeWindow</span>.<span style="color: #006600;">activate</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	<span style="color: #808080; font-style: italic;">// then set stage params</span>
	<span style="color: #0066CC;">stage</span>.<span style="color: #0066CC;">align</span> = StageAlign.<span style="color: #006600;">TOP_LEFT</span>;
	<span style="color: #0066CC;">stage</span>.<span style="color: #0066CC;">scaleMode</span> = StageScaleMode.<span style="color: #006600;">NO_SCALE</span>;
<span style="color: #66cc66;">&#125;</span></pre>
</blockquote>
<p>In order to communicate with Max, we need to create an <a title="XMLSocket - AS3 Documentation" href="http://www.adobe.com/livedocs/flash/9.0/ActionScriptLangRefV3/flash/net/XMLSocket.html" target="_blank">XMLSocket</a>.</p>
<p>ActionScript 3.0:</p>
<blockquote>
<pre class="actionscript"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> _socket:<span style="color: #0066CC;">XMLSocket</span>;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> _host:<span style="color: #0066CC;">String</span> = <span style="color: #ff0000;">&quot;127.0.0.1&quot;</span>;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> _port:uint = <span style="color: #cc66cc;">8080</span>;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> initSocket<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	_socket = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">XMLSocket</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	_socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>IOErrorEvent.<span style="color: #006600;">IO_ERROR</span>, xmlSocketEventsHandler<span style="color: #66cc66;">&#41;</span>;
	_socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #0066CC;">CONNECT</span>, xmlSocketEventsHandler<span style="color: #66cc66;">&#41;</span>;
	_socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #0066CC;">CLOSE</span>, xmlSocketEventsHandler<span style="color: #66cc66;">&#41;</span>;
	_socket.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>DataEvent.<span style="color: #0066CC;">DATA</span>, xmlSocketDataHandler<span style="color: #66cc66;">&#41;</span>;
	_socket.<span style="color: #0066CC;">connect</span><span style="color: #66cc66;">&#40;</span>_host, _port<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> xmlSocketEventsHandler<span style="color: #66cc66;">&#40;</span>event:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;<span style="color: #000099; font-weight: bold;">\n</span>&quot;</span>, <span style="color: #0066CC;">this</span>, <span style="color: #ff0000;">&quot;--- xmlSocketEventsHandler ---&quot;</span><span style="color: #66cc66;">&#41;</span>;
	<span style="color: #b1b100;">switch</span><span style="color: #66cc66;">&#40;</span>event.<span style="color: #0066CC;">type</span><span style="color: #66cc66;">&#41;</span>
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #b1b100;">case</span> <span style="color: #ff0000;">&quot;ioError&quot;</span>:
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;<span style="color: #000099; font-weight: bold;">\t</span>could not connect&quot;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">break</span>;
&nbsp;
		<span style="color: #b1b100;">case</span> <span style="color: #ff0000;">&quot;connect&quot;</span>:
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;<span style="color: #000099; font-weight: bold;">\t</span>socket connected&quot;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">break</span>;
&nbsp;
		<span style="color: #b1b100;">case</span> <span style="color: #ff0000;">&quot;close&quot;</span>:
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;<span style="color: #000099; font-weight: bold;">\t</span>socket closed&quot;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">break</span>;
&nbsp;
		<span style="color: #000000; font-weight: bold;">default</span>:
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;<span style="color: #000099; font-weight: bold;">\t</span>&quot;</span> + event.<span style="color: #0066CC;">type</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #b1b100;">break</span>;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre>
</blockquote>
<p>There are a couple of things to go through here. At the top of this code block, I instantiate the XMLSocket. I also create variables for the host and the port, which are both necessary to connect the XMLSocket.</p>
<p>Then, the initSocket() function takes care of initializing the XMLSocket, also adding some listeners to it and finally connecting it. For the connection, you may want to read about your platform (whether it's Windows, Mac OS or other) to see what is the host IP and what ports can be used locally. You may also read up a bit on the Flash Player security, in case you need a cross domain XML file, although since this project is desktop-based and not going through a browser, I did not need it.</p>
<p>The xmlSocketEventsHandler() simply traces what events the XMLSocket receives.</p>
<p><strong>Create a Max patch</strong></p>
<p>Max files are called patches. It goes back to patching cords, but I won't go too deep into the Max language, you may read all about it yourself on the Internet.</p>
<p>By default, Max does not communicate with Flash, but just like AS3, there are some "libraries" that can be added to Max, they are called externals. A couple of years back, the Flashserver external was easy to obtain from the <a title="Flashserver - Olaf Matthes" href="http://www.nullmedium.de/dev/flashserver/" target="_blank">author's website</a> or from the <a title="Flashserver - Max Object Database" href="http://www.maxobjects.com/?v=objects&amp;id_objet=2487&amp;requested=FLASH&amp;operateur=AND&amp;id_plateforme=0&amp;id_format=0" target="_blank">Max Objects Database</a>, but it is sadly not the case anymore. I still have it and it is bundled with the source files for this tutorial, I hope I am not infringing anyone's copyrights by making it available again.</p>
<p>Then let's create a new patch and add the Flashserver object. This post is unfortunately not about how to use Max, thus I will not explain how to use the software here. I may in some future post, but this is way out of scope for this post.</p>
<p style="text-align: center;"><img class="aligncenter" title="Max patch" src="http://jansensan.net/images/blog/post0014_004.jpg" alt="Max patch" width="451" height="578" /></p>
<p>Simply look at the help for the Flashserver object if you need to, but quickly, after the name is the argument for what port to connect to ("8080") , and the last argument ("256") is the amount of clients or Flash applications that can connect to this Max patch.</p>
<p><strong>Talking with Max</strong></p>
<p>When Flash needs to communicate with other languages and software, the other software usually has the role of a server, therefore it needs to be opened before the Flash/Air app. Thus, make sure you open the Max patch before attempting to communicate with Flash.</p>
<p>First, let's look at receiving what Max may send to Flash. Earlier, there was one event handler that I did not define, here it is:</p>
<p>ActionScript 3.0:</p>
<blockquote>
<pre class="actionscript"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> xmlSocketDataHandler<span style="color: #66cc66;">&#40;</span>event:DataEvent<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span>event.<span style="color: #0066CC;">data</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre>
</blockquote>
<p><strong><span style="font-weight: normal;">So the data is actually what Max sends to Flash. To send multiple values to Flash, you'll need to create a pack in Max and send it as a string and then parse it in Flash.</span></strong></p>
<p><strong><span style="font-weight: normal;">Let's look at the code to send data to Max:</span></strong></p>
<p>ActionScript 3.0:</p>
<blockquote>
<pre class="actionscript">_socket.<span style="color: #0066CC;">send</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;hello max;&quot;</span><span style="color: #66cc66;">&#41;</span>;</pre>
</blockquote>
<p><strong><span style="font-weight: normal;">It's as simple as that! Note that the data always has to end with a semicolon (";"). In the case where there are multiple values that need to be sent, separate them all with a semicolon, like so:</span></strong></p>
<p>ActionScript 3.0:</p>
<blockquote>
<pre class="actionscript">_socket.<span style="color: #0066CC;">send</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;hello max; from flash;&quot;</span><span style="color: #66cc66;">&#41;</span>;</pre>
</blockquote>
<p>On Max's side, simply use the unpack object to be able to parse the values into your patch.</p>
<p><strong>Source files</strong></p>
<p>As promised, <a href="http://jansensan.net/compressed/Tutorial_CommunicationWithMax.zip">here are the files</a> that I used to create this project. The Air project was created in Eclipse with the Flash Builder 4 plugin, and the Max patch with Max 5, with the Flashserver external installed.</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/communication-between-as3-and-max-msp-jitter/feed</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>adidas Originals publishes Women&#8217;s Lookbook</title>
		<link>http://jansensan.net/adidas-originals-womens-lookbook-ss10</link>
		<comments>http://jansensan.net/adidas-originals-womens-lookbook-ss10#comments</comments>
		<pubDate>Wed, 17 Mar 2010 12:19:55 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Commercial Works]]></category>
		<category><![CDATA[Localization]]></category>
		<category><![CDATA[Projects]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[adidas]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[FWA]]></category>
		<category><![CDATA[Sid Lee]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=167</guid>
		<description><![CDATA[After two arduous months of work—and during the hassle of me moving to Amsterdam nonetheless!—we finally managed complete the production of the adidas Originals Women's Lookbook SS10! Lots of thought went into the architecture of that project so it would be easy to debug. I chose a homebrew MVC pattern for the structure, which worked [...]]]></description>
			<content:encoded><![CDATA[<div style="text-align: center;">
<div><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="480" height="351" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="FlashVars" value="culture=us" /><param name="allowScriptAccess" value="always" /><param name="flashvars" value="culture=us" /><param name="src" value="http://www.adidas.com/campaigns/originals_ss10/content/microsites/womenslookbook/embed/AdidasWLB_Loader.swf" /><embed type="application/x-shockwave-flash" width="480" height="351" src="http://www.adidas.com/campaigns/originals_ss10/content/microsites/womenslookbook/embed/AdidasWLB_Loader.swf" allowscriptaccess="always" flashvars="culture=com"></embed></object></div>
</div>
<p>After two arduous months of work—and during the hassle of me moving to Amsterdam nonetheless!—<a title="Sid Lee" href="http://www.sidlee.com/" target="_blank">we</a> finally managed complete the production of the <a title="adidas Originals Women's Lookbook SS10" href="http://www.adidas.com/originals/womenslookbook" target="_blank">adidas Originals Women's Lookbook SS10</a>!</p>
<p>Lots of thought went into the architecture of that project so it would be easy to debug. I chose a homebrew <a title="MVC pattern" href="http://en.wikipedia.org/wiki/Model–view–controller" target="_blank">MVC pattern</a> for the structure, which worked well. Looking at <a title="My colleague, Antti Kupila" href="http://www.anttikupila.com/" target="_blank">my colleague</a> working with <a title="Robot Legs" href="http://www.robotlegs.org/" target="_blank">RobotLegs</a>, I believe this is what I'll look into next.</p>
<p>The localization worked like a charm with the <a title="Of localization and locale mapping" href="http://jansensan.net/locale-mapping" target="_blank">locale mapping logic I wrote about before</a>. The only issue I found is that since there were no specific fonts for non latin languages, there had to be a check to see what alphabet was used, to  make sure that the fonts were not embedded if said alphabet was non latin.</p>
<p>The video had to stream in this case since we needed to jump at any moment in time in the video. Also, we faced an inconvenience when <a title="BitmapData.draw() AS3 Documentation" href="http://help.adobe.com/en_US/AS3LCR/Flash_10.0/flash/display/BitmapData.html#draw()" target="_blank">trying to get a bitmap from a streaming video</a>, the <a title="Fixing BitmapData.draw() Security Sandbox Violation" href="http://www.thebluepipe.com/Developer/tutorials/as3/Crossdomain-Video-Snapshot-Fixing-BitmapData-draw-Security-Sandbox-Violation.html" target="_blank">solutions were on the server side</a>.</p>
<p>Integrating the whole project into an existing parent SWF was also a challenge, since the class definitions would be kept in the appdom memory and causing issues when loading the site a second time. The solution to this was to apply an application domain when loading the microsite (<a title="Being a Successful Development Team in Flash with Application Domains" href="http://codeendeavor.com/archives/468" target="_blank">link 1</a>, <a title="Application Domain and External SWF Loading" href="http://annafilina.com/blog/application-domain-and-external-swf-loading/" target="_blank">link 2</a>).</p>
<p>As I was looking for solutions, I found that <a title="maashaack - ActionScript 3 framework, tools, libraries and utilities" href="http://code.google.com/p/maashaack/wiki/Main" target="_blank">wiki</a> that is discussing about things like thinking in AS3, metadata, singletons, application domains and all sorts of interesting subjects.</p>
<p>All in all, that project was a good challenge, one I had been looking forward to for a while now.</p>
<p>The embeddable version seen in this post actually has been produced by <a title="Département" href="http://www.departement.ca/" target="_blank">Département</a> in Montréal.</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/adidas-originals-womens-lookbook-ss10/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Loading assets dynamically (part 1: a primer)</title>
		<link>http://jansensan.net/loading-assets-dynamically-part-1</link>
		<comments>http://jansensan.net/loading-assets-dynamically-part-1#comments</comments>
		<pubDate>Wed, 23 Sep 2009 18:15:27 +0000</pubDate>
		<dc:creator>mat janson blanchet</dc:creator>
				<category><![CDATA[Projects]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[Workflow]]></category>
		<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[Flash]]></category>

		<guid isPermaLink="false">http://jansensan.net/?p=22</guid>
		<description><![CDATA[Over the years, we have seen multiple ways to import our visuals and sounds into our projects. Some of these ways would have our assets included into the SWF, which meant the published file could end up quite big. Some other ways would have us load everything dynamically, which could be practical for some assets, [...]]]></description>
			<content:encoded><![CDATA[<p>Over the years, we have seen multiple ways to import our visuals and sounds into our projects. Some of these ways would have our assets included into the SWF, which meant the published file could end up quite big. Some other ways would have us load everything dynamically, which could be practical for some assets, but not necessarily flexible enough for all situations. Through all these options, how can we have our assets related to our ActionScript classes? Let's see and compare what is feasible and what is ideal.</p>
<p>When I first got into Flash in 1999-2000, I only knew one way to import my assets into Flash: File &gt; Import &gt; Import to Stage/Import to Library. It's actually quite practical, since you can place your elements as you would in Photoshop or Illustrator and create all sorts of MovieClips easily. And it's actually still the best way to create banners and quick projects.</p>
<p>In order to call the <a href="http://help.adobe.com/ru_RU/AS2LCR/Flash_10.0/help.html?content=00001283.html#368157" target="_blank">attachMovieClip</a> function (remember this was with AS2), an identifier name was given when the "Export for ActionScript" box was checked. After a while, I learned that I could relate ActionScript classes to that specific MovieClip in the library, so I would end up also a class name like com.clientname.ui.SomeClass, a habit I kept until recently, even in AS3.</p>
<p>This presented some inconvenients, mainly beefing up the size of the file. Also, creating variable names in the class that had the same names as in the MovieClip associated to the said class would cause some namespace issues in AS3.</p>
<p>With Flex Builder, now Flash Builder, you can embed image files in your code and make them act as classes (<a href="http://www.bit-101.com/blog/?p=853" target="_blank">example 1</a>, <a href="http://actionscriptexamples.com/2008/10/26/embedding-images-into-a-flash-document-using-the-embed-metadata/" target="_blank">example 2</a>). Quite useful, but again, it just makes your file size bigger. Having a preloader that would stop the timeline until all is loaded, or having two separate SWFs with one that loads the other, both those two options seemed a bit unclean and inefficient, especially if you eventually want to hand the project to someone else.</p>
<p>There is also the option of loading everything at runtime. And I mean everything, all images, sounds, etc. It's a step towards making the file lighter, but sometimes you do need to edit your assets à la Photoshop, have multiple MovieClips, and basically using the Flash IDE at this point would help. Sure you could recreate everything in code, place all your elements, TextFields, MovieClips and the likes in code, but sometimes you may want to use components too, and I've faced moments where I could create components dynamically. And doing all that just in code is time consuming, and let's face it, this industry is based on efficiency and speed of delivery.</p>
<p>Enter <a href="http://livedocs.adobe.com/flex/gumbo/html/WS2db454920e96a9e51e63e3d11c0bf69084-7fd3.html">SWC</a> files. These files are either a compiled library of code–just like <a href="http://code.google.com/p/papervision3d/">Papervision</a> or <a href="http://www.fisixengine.com/" target="_blank">Fisix Engine</a> do–or a compiled FLA file that includes a library of assets built in the Flash IDE. There are different ways to use these files and when possible, it is even possible to load them dynamically.</p>
<p>In the next tutorials, I will show how to use and create these files and how to import and use fonts and CSS. All these things may be basic, but I think it is worth it to summarize all the different ways I have learned about on the web and while working in producton teams.</p>
]]></content:encoded>
			<wfw:commentRss>http://jansensan.net/loading-assets-dynamically-part-1/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

