River Avon, Bristol.

River Avon, Bristol.

Super high tides and large amounts of rain this week. It’s the highest I have ever seen the river here in Bristol.

Advertisements

UWE Bower Ashton Degree Show 2012

I recently attended the University West of England Bower Ashton Campus Degree Show 2012 in Bristol. I was very impressed with the quality and output of much of the work on show. The campus specialises in creative arts including film, digital, graphics, animation, illustration and fashion. I exhibited my own work here as a 2000 graduate which led to my first proper job in the industry. It’s a great place to pick up new talent and get inspired. Get down there if you haven’t already, it’s closing soon:-

http://info.uwe.ac.uk/events/event.aspx?id=12938

Here are some of my favourite pieces on show:-

Illustration by Joe Todd Stanton – joetoddstanton.com

Making a Website Run Full-Screen on an iPad

Common knowledge really but thought I would post this in case it helps anyone else…..

If you want to run a website fullscreen in Safari on an iPad:-

  1. Add this line into the <head> –  <meta name=”apple-mobile-web-app-capable” content=”yes”/>
  2. From Safari, save the site onto the home screen as a web app

haXe IDE Choices for Mac OS X

In my short time spent working with haXeNME and Jeash I have used a few code IDEs. Initially, I upgraded my FDT to version 5 which is touted as having good haXe support…. not so. The haXe support in FDT5 is very poor at present. I am sure it will get better and come into line with what is usually an awesome product (and one I have used happily for years now).

Image

The next IDE I tried was Sublime Text 2 (see image above). There is a Beta release you can try out for free. The haXe support is pretty good and there are lots of nice touches to the IDE. In particular I loved the scrolling panel on the right. I now miss this whenever I am using another IDE. It has some code completion and you can compile in the IDE itself if you want to.

Image

However, in the last week or two I have settled on the new haXe plugin for IntelliJ IDEA (see image above). This was actually my Actionscript IDE of choice and so I have been excitedly waiting for the haXe plugin support to arrive. It is now on version 0.2.1 and the latest release features the following:-

  • Type resolving improvements
  • Documentation support
  • New color settings
  • Jump to declaration of local, std symbol or class
  • Reference and Class completion

The Jetbrains guys make great IDEs – checkout Webstorm for Javascript coding – and the haXe plugin is definitely a step in the right direction for IDEA. So for me, this is my haXe IDE of choice…..

Whitespace and haxe.xml.Fast

I have been excitedly delving into the world of haXe, NME and Jeash over the last month or so. One item that just caught me out was this:-

Don’t have any whitespace either side of your CDATA tags in XML. It will mess up the Fast parsing (at least for the html5 target). If I find a workaround I’ll post it up here….

Bad:-

<title>
<![CDATA[New ideas]]>
</title>

Good:-

<title><![CDATA[New ideas]]></title>

My FITC Amsterdam 2012

Bike in Amsterdam

FITC in the beautiful city of Amsterdam



FITC Amsterdam

I recently attended my first FITC event. FITC is focused primarily on high-end digital creativity. The conference took place in the wonderful city of Amsterdam over the end of February 2012. It was an intimate affair for a conference, with probably around 400 attendees. There was a workshop day on Sunday followed by two full days of presentations over three or four strands. There was a well-engineered mix of technical and creative talks by some key industry figures as well as some interesting sneak-peeks and major announcements. I am going to highlight some of the most interesting and important aspects of the conference (but in no way am I trying to cover everything as there was just too much to go over, and you would probably get bored 🙂 ).

The Sunday Workshop

The Building Flash Games with Starling workshop

I attended the Building Flash Games with Starling workshop hosted by Adobe Developer/Game Evangelist @LeeBrimelow. We spent a day building a 2D game from scratch using the new Starling Framework. Starling leverages the new GPU acceleration possible in Stage 3D but presents it in an almost identical way to Flash’s normal display list. This makes it easy for Flash developers to create incredibly performant 2D games simply by importing from the starling library instead of the flash library. There are obviously more steps to writing truly performant games but essentially you can achieve an awful lot for very little and we built a simple physics game called Grenades.

Screenshot of the flash game Grenades

Grenades by @leebrimelow

To create Grenades we used the impressive and more-intuitive-than-Box2D framework Nape. We also covered spritesheets and physics models using the awesome apps TexturePacker and PhysicsEditor. Grenades is very similar to the omni-present Angrybirds and Lee Brimelow did a great job of slowly layering on the code until we had a couple of levels of the game functioning with scoring, sound and even a (Flash IDE-based) level-editor.

HTML HTML HTML HTML HTML (that’s 5 HTMLs)

FITC, I believe, used to stand for “Flash in the Can” but has now been changed to “Future, Innovation, Technology, Creativity”. And this change was also mirrored in the content of the conference. In the industry there has been a huge shift in focus and excitent away from Flash to HTML5. At FITC there were only a handful of actual Flash specific talks and by the end of day one it was easy to have had the HTML5 logo burned into your retinas. So this was an HTML5-heavy affair and with good reason. For a conference that has a large percentage of (ex?)-Flash devs and designers, the issue that a lot of us are facing is how do we continue to build on what we do in the current and continually changing digital landscape? HTML5 has been heralded as the next big thing for some time now and many of the talks covered the reality of this new technology. Clients are asking for content to work on multiple platforms, behave performantly and not cost much or any more. However, the reality of achieving these things is a far more complicated picture.

Games for Kids: Flash vs HTML5

Jon Howard, @swingpants, is the Web Development Team Leader for CBBC & CBeebies and is the lead for BBC Children’s Games strategy team. He kicked off Monday’s presentations with an enlightening talk on his own journey to provide performant highly-interactive content for multi-platforms. His work thus far has included many, many impressive high-end Flash games. But with mobile and tablet-device usage percentages growing by the day this delivery method is going to have to change. Working for the BBC, it is his mission to reach the biggest audience possible and in catering for the lowest common denominator he has had to make some tough decisions about what he can realistically achieve. He wanted to get as deep an understanding as possible during his research so he decided to not use any frameworks or libraries and just start coding in HTM5 and Javascript to make a simple platform game. The kind of game you might typically find in the CBBC website.

His initial path, for the graphics side of things, took him to investigate SVG as an alternative to Flash’s vector graphics strength but found performance was massively lacking. So…. he went on to look at Canvas which is getting more and more powerful at the moment. However, he found that Android devices were incredibly slow at rendering Canvas. This left him with using DOM elements to render the game world and eventually, through a process of line by line code optimisation, he was able to get something passable working across his four different test devices.

Other issues he ran into included Android’s inability to use multi-touch gestures in-game. The terrible reality of sound implementation across browsers. Often a single sound is only possible, even worse, on iOS a sound must be triggered by a button. It’s so bad in fact that in @jessefreeman‘s latest book, ‘An Intro to HTML5 Game Dev’, he surmises that with current browsers it’s probably best not to even include sound at all…… no sound in games? Not good. Webcam access is only currently supported by Opera. Video requires multiple codecs and fallback strategies. Jon also found that performance for specific browsers is, on different devices in areas such as SVG, Canvas and CSS transitions, completely inconsistent and changes in random unexpected directions with almost every release. In particular, this is a problem with auto-updating browsers like Chrome….. it will suddenly update behind the scenes and your work will be broken or will have ground to a halt.

Basically, it’s still very rough out there. Things are getting better across the board, but very slowly. His conclusion was that HTML5 is not yet worth pursuing to make cross-browser multi-platform high-level web games. He speculated that this may be the case for some time to come as browsers implement their own take on features, in their own time, with very loose ‘standards’. He wondered if cloud-based streaming solutions like Onlive might actually be the answer….

The Adobe Keynote

It was an exciting keynote from Adobe. They have re-focused their direction for the Flash Platform towards high-end gaming and video. Flash’s name is mud right now and could be forever so there is an element of too little too late to a lot of this but what they were showing was truly impressive.

  • AIR 3.2 finally has Stage3D hardware accelerated 2D and 3D running on mobile. They demoed a number of games running on mobile devices with truly impressive performance. Many thousands of sprites running at 60fps. There was a look at the incredibly performant framework Genome2D. Here are a few of the AIR demoes to check out – http://www.flashstreamworks.com/2012/02/28/five-air-3-2-stage3d-mobile-demos-that-will-knock-your-socks-off/
  • Multithreading is almost here.
  • New mouse capabilities are ready, including mouse-lock and full right-click control.
  • There were some excellent Air Native Extensions allowing you to leverage device specific functionality not available in the AIR runtimes.
  • They demoed the latest version of Unreal Engine running in Flash (through Alchemy). It is actually running better than on some modern day consoles. It was very impressive to see how far Flash has come. Many large game publishers are now starting to produce console-quality web content with the new Flask player capabilities. It was noted that although these super-high-end features are not necessarily relevant to a lot of people’s day-to-day work, the power and performance will trickle down to be leveraged in more common situations.
  • Monocle is a Flash profiler that was announced a few months ago. It is going to run on top of release-version flash content and allow you to analyse each individual frame of a flash movie, you can click in and out of functions, manipulate the timeline to view any state of your application and pinpoint exactly where memory or performance issues may be occurring. It even works with Stage3D.
  • Hellcat is Adobe’s name for a future edition of Flash Pro. It’s 64-bit rewrite allows for some impressive performance and realtime rendering in the IDE, also a 2 second load time. All this is great…. but I would rather just have an IDE that isn’t riddled with bugs and frequently crashes.
  • Adobe Edge has now reached preview 4. It’s becoming an interesting tool for more basic end-to-end HTML5 visual solutions with limited interactivity. I’m not sure what kind of code is being generated under the hood but some of the latest examples were impressive.
  • The most exciting announcement for me was the inclusion of part of Grant Skinner’s amazing CreateJS framework as an extension in Flash Pro CS6. This feature will allow designers to output complex vector-based canvas animations direct from the Flash IDE as .js classes. I am going to write a separate blog post imminently with much more information specifically on CreateJS.

The view from the Influxis Voodoo lounge

Conclusion

For me personally, to make a snapshot of the technical mood of the conference, I would say this….. The digital landscape is changing fast, the dominant years of Flash have passed and we need to figure out how to do what we have done so easily in Flash in different technologies and on different platforms. The hype would lead you to believe that HTML5 will be able to solve everything but the reality is very complex and there are problems with performance, compatability and standards at almost every turn. Allowing one company to spearhead a web technology is dangerous in terms of ownership and control but it does allow for significant progress. Compare this to the slow-moving and differing implementations of standards by the multiple boards, committee and companies responsible for the current set of browsers and it’s easy to long for what seemed like a simpler past. However, that would be to ignore the excitement and challenge of developing in this new realm.

In terms of solutions, people are not sure what the right direction to take will be yet. There often isn’t a single clear choice but there are many breathtaking new frameworks, languages and technologies coming into play. I have been looking very seriously into haXe NME recently and it’s exciting and full of potential. I want to also look much more seriously at CreateJS as it reaches version 1.0. There is also other impressive tech such as Sencha, Phonegap and Spaceport, to name a few. In terms of performance, there is no denying the incredible ground being covered at the moment. Almost every week brings an improvement to the rendering and performance of mobile devices’ browsers. Soon, this won’t be the issue that it is now and this will give developer’s more choice and freedom. These are, without doubt, exciting times to do what we do.

I left out a great deal from this conference…. Grant Skinner’s awesome ‘HTML5 in the Trenches’ talk (which I’ll cover in my upcoming CreateJS blog), some excellent talks, presentations and free beer in the Influxis Voodoo lounge, the incredible atmosphere and friendly nature of the participants, Seb Lee-Delisle’s presentation ‘CreativeJS: Visual fun with Javascript’, as well as his ‘Conversation with Mr. doob’, an excellent opening party at the Sugar Factory, and basically, being in the beautiful city of Amsterdam. For anyone looking to go to a brilliantly inspiring, educational and valuable conference for digital creatives, this is right up there with the best of them. It’s like a musical festival for geeks! I will definitely try to come back again.

My First Year at Spike Design

I am a freelance Interactive Developer. I have been freelancing since 2007. Like many other freelancers, I started doing this from the comfort of my own home. “That must be amazing!”, friends would often say, “You don’t have to go to work/see your boss/get up etc.”. And, in part, there are some amazing things about working from home…. BUT after over a year, moving from your bed to your desk and back again, not seeing other human beings, having no work/home divide and being able to spend all day in your pants, well, these things start to eat away at your soul.

I decided enough was enough and I found a desk to rent in another company’s small office in the Tobacco Factory in Southville, Bristol. There were a couple of other freelancers there and a few employees. It was a great move and I enjoyed the change immensely. However, after a year I felt that I needed to move on to pastures new, meet more people and find further opportunities. I first discovered Spike Design when it was hosting a Bristol Jelly co-working event that I attended.

(From the website) Spike Design is a creative business incubation unit based in Spike Island, the largest of its kind in the South West. With low-cost desk space, excellent facilities and tailored support, this unique space offers the environment and opportunity for young companies to grow.

Image

When I first moved to Spike Design in November 2010 it was quite a different place to what it is now. An agency had just folded and they had dominated the space. There was a huge vacuum where the 30+ employees had been and I happened to join at the same time as a few other individuals. Some of us decided to locate ourselves in this empty area. I think there were ten or fifteen freelancers in the whole of Spike Design at this point. Spike Island is an old tea-packing warehouse, Spike Design is just one corner of one floor of this massive building, we definitely did not make the place feel very busy. However, over the last twelve months our community has blossomed and grown and we now number nearly forty individuals. Tenants are very diverse in nature, from plant importers, product designers and editors, to photographers, script-writers, marketers and illustrators. There seems to be a slight lean towards digital with numerous designers, developers and a couple of small agencies all working in this field.

My favourite things about Spike:-

  • A Sense of Community. Although I don’t actually work with most of the people I am around every day I feel like we are part of something. I have made some good friends here, we hang out outside and inside of work, have lunch together and help each other out.
  • Business Cross-Pollination. Spike Design is, after all, a business incubation centre and I have seen the dream alive and kicking: photographers taking pictures of the product designer’s products whose websites are then built by the web developers. Editors helping with wording, marketers helping with other tenants messaging. It seems to be happening more and more in the time I have been there and it is a great example of the benefits of a place like this.
  • Scalability. The size of the space and the way the desk system works allows for easy scalability. If your business is growing and you need another desk, it’s very simple to get this extra space for a minimal fee and a month-to-month commitment. Then, if you decide you need more or you need to shrink again, it’s simple and financially painless to do so. This is a great help if you are a small business.

 

Image

  • The Cafe. Spike Cafe serves coffee, pastries, cake, drinks and well-made meals. There are different specials every day and there are benches outside for when the weather is good.
  • Friday Breakfast Club. Every second Friday we get together for coffee and pastries in our glass meeting room. It’s a great way to meet new tenants and other people you don’t happen to see during your usual day-to-day activities.

Image

  • Table Tennis. There is a table tennis table and lots of people to play of all abilities. We occasionally have a tournament in which the elusive Golden Bat is passed on from mantle to mantle. For me, table tennis is probably my favourite sport and also the ultimate work break, so this is a huge pull.

 

  • The Exhibition Space. Every two or three months a new exhibition takes place in the expansive Spike Island Galleries. As Spike Design tenants we receive a tour of the latest exhibition by the curator of the gallery. It’s a great way to gain some insight into the current works in the space.

 
So….. there you have it. It’s been a poignant year for me and I wanted to try and document this influential part of it. I hope it sheds some light on what goes on here at Spike Design and encourages you, should you be looking, to join a great co-working space in Bristol.

 

Excellent Article by Jesse Warden

I just read an awesome blog post by prominent interactive developer Jesse Warden. It covers an awful lot of interesting subject matter and busts some myths that are often heralded as truths within our industry. It’s a refreshing read that offers some clarity and insight into the world of interactive software development and it’s inherent career progression possibilities. I find myself and many other developer friends discussing these subjects at length, particularly in light of the splintering platforms of the current digital landscape, and I really enjoyed Jesse’s intelligent take on them all. Thank you Mr. Warden 🙂 Here it is:-

http://jessewarden.com/2011/10/five-lies-they-tell-you-in-software.html

FDT 4 – How to auto-generate Getters and Setters

Again, this is common knowledge but I thought I would post it for convenience and the hope that it will help someone else out in the future.

To generate a getter and/or a setter create a variable in the declaration section of your class. Make sure to prefix it with an underscore _ and also make it private. Simply put the cursor in the variable and press Cmd-1 (on a Mac). FDT will then generate the statements for you. For instance, in the below statement, if I put the cursor on the _alertText_str variable here:-

private var _alertText_str:String;

And press Cmd-1, FDT will generate:-

public function get alertText_str() : String {
return _alertText_str;
}
public function set alertText_str(alertText_str : String) : void {
_alertText_str = alertText_str;
}

Thanks to @dougal07 for showing me this.

FDT 4 – How to auto-generate a trace() command

I only just discovered this incredibly useful shortcut in FDT. I imagine that knowing this will buy me an extra week or two of life time as I don’t have to type out trace() anymore!

Simply put the cursor over the object you want to trace and press Cmd-0 (on a Mac). FDT will then generate the trace statement for you. For instance, in the below statement, if I put the cursor on the width property of the _questionBoxStyle object and press Cmd-0, the following will happen:-

_questionBoxStyle.width = _questionBoxWidth;
trace('_questionBoxStyle.width: ' + (_questionBoxStyle.width));