{"id":338,"date":"2013-12-30T16:09:48","date_gmt":"2013-12-30T16:09:48","guid":{"rendered":"https:\/\/www.sebastianlenton.com\/?p=338"},"modified":"2014-01-06T11:29:06","modified_gmt":"2014-01-06T11:29:06","slug":"byob-birmingham-2013-art-projectors-box2d","status":"publish","type":"post","link":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/","title":{"rendered":"BYOB Birmingham 2013: Art, Projectors & Box2D"},"content":{"rendered":"

On Friday November 29th I found myself exhibiting an artwork at Vivid Projects as part of their Bring Your Own Beamer (BYOB)<\/a> exhibition. BYOB is a global series of exhibitions which see artists using projectors to display their work, with Birmingham’s event organised by notable local artists Antonio Roberts<\/a> and Pete Ashton<\/a>.<\/p>\n

The night was a great success, with a diverse range of pieces being exhibited by more than twenty artists. My piece was a physics-y controllable visualiser, using Box2DJS as its foundation.<\/p>\n

<\/p>\n

Box2D?<\/h2>\n

Whether you’ve heard of it or not, you’ve probably already experienced the Box2D physics engine first-hand – developed by Erin Catto, the engine is best known for powering\u00a0the physics behind the Angry Birds series<\/a> of games. It provides a framework with which developers can easily create 2D physics simulations, without having to deal with much in the way of complex maths.\u00a0I’d been eyeing it for a while anyway, so this seemed like the perfect time to give it a try.<\/p>\n\"Still\n

My initial idea involved using a JavaScript implementation of Box2D to make some simple, browser-based multiplayer games, in which you can draw in custom shapes which map to real-world environmental features. For example: if there was a window in the centre of the wall being projected onto, then this could be mapped into becoming a pit in which cars racing around it could fall down.<\/p>\n

However, due to time constraints\u00a0I ended up with a visualiser of sorts, within which a flow of small shapes can be manipulated and directed by drawing in – or removing – larger shapes, with various parameters being controllable via keyboard\u00a0(colour, feedback, shape spawn rate and so on). You can download the code and try it yourself via GitHub<\/a>, or check out a live demo<\/a> here if you like (please note, I’ve only tested the demo in Chrome for Mac at this point).<\/p>\n

Development<\/h2>\n

Considering my lack of prior experience with Box2D, development wasn’t too bad. One thing I found confusing at first was that there’s various different JavaScript\u00a0Box2D ports, but certain tutorials won’t work fully with certain versions as they’re all slightly different to each other. If following a Box2DJS tutorial then make sure to use the same version the author is using, or you might run into problems.<\/p>\n

By far the most useful learning resource for me was Jeremy Hubble’s Box2DJS<\/a> page, which provides code as well as an example working in situ. There’s also a pretty comprehensive tutorial<\/a> series by Seth Ladd, as well as a series by iforce2d<\/a> which is worth reading (code examples in C++).<\/p>\n

Release<\/h2>\n

The reaction to the final piece was excellent, and it worked brilliantly on the night with no crashes or glitches. We controlled it live throughout the event, adjusting the settings to create a piece which changed and evolved all night long. A few people even had a go on the night, braving the not exactly user-friendly controls to play with it themselves.\u00a0You can see a few Vine videos of it in action here<\/a>, here<\/a> and here<\/a>, although it looked a bit more interesting in person!<\/p>\n","protected":false},"excerpt":{"rendered":"

On Friday November 29th I found myself exhibiting an artwork at Vivid Projects as part of their Bring Your Own Beamer (BYOB) exhibition. BYOB is a global series of exhibitions which see artists using projectors to display their work, with Birmingham’s event organised by notable local artists Antonio Roberts and Pete Ashton. The night was… Read more »<\/a><\/p>\n","protected":false},"author":2,"featured_media":352,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"yoast_head":"\nBYOB Birmingham 2013: Art, Projectors & Box2D - Sebastian Lenton<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"BYOB Birmingham 2013: Art, Projectors & Box2D - Sebastian Lenton\" \/>\n<meta property=\"og:description\" content=\"On Friday November 29th I found myself exhibiting an artwork at Vivid Projects as part of their Bring Your Own Beamer (BYOB) exhibition. BYOB is a global series of exhibitions which see artists using projectors to display their work, with Birmingham’s event organised by notable local artists Antonio Roberts and Pete Ashton. The night was... Read more »\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/\" \/>\n<meta property=\"og:site_name\" content=\"Sebastian Lenton\" \/>\n<meta property=\"article:published_time\" content=\"2013-12-30T16:09:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2014-01-06T11:29:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2-1100x825.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1100\" \/>\n\t<meta property=\"og:image:height\" content=\"825\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Seb Lenton\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@sebastianlenton\" \/>\n<meta name=\"twitter:site\" content=\"@sebastianlenton\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Seb Lenton\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/\",\"url\":\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/\",\"name\":\"BYOB Birmingham 2013: Art, Projectors & Box2D - Sebastian Lenton\",\"isPartOf\":{\"@id\":\"https:\/\/www.sebastianlenton.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2.jpg\",\"datePublished\":\"2013-12-30T16:09:48+00:00\",\"dateModified\":\"2014-01-06T11:29:06+00:00\",\"author\":{\"@id\":\"https:\/\/www.sebastianlenton.com\/#\/schema\/person\/07ad65c2a7050417b92f404e980c3be1\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/#primaryimage\",\"url\":\"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2.jpg\",\"contentUrl\":\"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2.jpg\",\"width\":3264,\"height\":2448},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.sebastianlenton.com\/#website\",\"url\":\"https:\/\/www.sebastianlenton.com\/\",\"name\":\"Sebastian Lenton\",\"description\":\"Freelance web development & design, Birmingham UK\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.sebastianlenton.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.sebastianlenton.com\/#\/schema\/person\/07ad65c2a7050417b92f404e980c3be1\",\"name\":\"Seb Lenton\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"BYOB Birmingham 2013: Art, Projectors & Box2D - Sebastian Lenton","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/","og_locale":"en_GB","og_type":"article","og_title":"BYOB Birmingham 2013: Art, Projectors & Box2D - Sebastian Lenton","og_description":"On Friday November 29th I found myself exhibiting an artwork at Vivid Projects as part of their Bring Your Own Beamer (BYOB) exhibition. BYOB is a global series of exhibitions which see artists using projectors to display their work, with Birmingham’s event organised by notable local artists Antonio Roberts and Pete Ashton. The night was... Read more »","og_url":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/","og_site_name":"Sebastian Lenton","article_published_time":"2013-12-30T16:09:48+00:00","article_modified_time":"2014-01-06T11:29:06+00:00","og_image":[{"width":1100,"height":825,"url":"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2-1100x825.jpg","type":"image\/jpeg"}],"author":"Seb Lenton","twitter_card":"summary_large_image","twitter_creator":"@sebastianlenton","twitter_site":"@sebastianlenton","twitter_misc":{"Written by":"Seb Lenton","Estimated reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/","url":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/","name":"BYOB Birmingham 2013: Art, Projectors & Box2D - Sebastian Lenton","isPartOf":{"@id":"https:\/\/www.sebastianlenton.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/#primaryimage"},"image":{"@id":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/#primaryimage"},"thumbnailUrl":"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2.jpg","datePublished":"2013-12-30T16:09:48+00:00","dateModified":"2014-01-06T11:29:06+00:00","author":{"@id":"https:\/\/www.sebastianlenton.com\/#\/schema\/person\/07ad65c2a7050417b92f404e980c3be1"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.sebastianlenton.com\/2013\/12\/byob-birmingham-2013-art-projectors-box2d\/#primaryimage","url":"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2.jpg","contentUrl":"https:\/\/www.sebastianlenton.com\/wp-content\/uploads\/2013\/12\/BYOBmainImage2.jpg","width":3264,"height":2448},{"@type":"WebSite","@id":"https:\/\/www.sebastianlenton.com\/#website","url":"https:\/\/www.sebastianlenton.com\/","name":"Sebastian Lenton","description":"Freelance web development & design, Birmingham UK","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.sebastianlenton.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/www.sebastianlenton.com\/#\/schema\/person\/07ad65c2a7050417b92f404e980c3be1","name":"Seb Lenton"}]}},"_links":{"self":[{"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/posts\/338"}],"collection":[{"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/comments?post=338"}],"version-history":[{"count":0,"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/posts\/338\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/media\/352"}],"wp:attachment":[{"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/media?parent=338"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/categories?post=338"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sebastianlenton.com\/wp-json\/wp\/v2\/tags?post=338"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}