redesign + new content

jmettes · May 11, 2014 · 30618b2 · 30618b2
1 parent ab4c8b0
commit 30618b2
Show file tree

Hide file tree

Showing 15 changed files with 216 additions and 114 deletions.
diff --git a/_layouts/layout.html b/_layouts/layout.html
@@ -2,18 +2,30 @@
 <html lang="en">
 <head>
 <meta charset="UTF-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Jonathan Mettes</title>
 <link title="Jonathan Mettes - Atom" type="application/atom+xml" rel="alternate" href="/atom.xml" />
 <link type="text/css" rel="stylesheet" href="/css/style.css" />
 <link rel="shortcut icon" href="/favicon.ico" />
 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
+<link href='http://fonts.googleapis.com/css?family=Lato:300,400|Raleway:100' rel='stylesheet' type='text/css'>
 {% unless page.url == '/index.html' %}
 <meta name="robots" content="noindex">
 {% endunless %}
 <!--[if IE]><script src="/js/html5.js"></script><![endif]-->
+<!--[if lt IE 9]>
+  <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
+<![endif]-->
 </head>
 <body>
-{% include sidebar.html %}
+<div id="header">
+<a href="/"><img src="images/drawn-circle-trn.png" id="logo" /></a>
+<h1><a href="mailto:[email protected]">Jonathan Mettes</a></h1>
+<p id="first">I'm a software dev and a muso</p>
+<p id="second">Here's a collection of things I make and do</p>
+<p id="third">More: <a href="mailto:[email protected]">email</a> | <a href="http://soundcloud.com/jmettes">soundcloud</a> |
+ <a href="http://youtube.com/user/jonathanmettes/videos">youtube</a> | <a href="https://github.com/jmettes">github</a></p>
+</div>
 <div id="articles">
 {{ content }}
 <div id="paginate">

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -2,14 +2,26 @@
 <html lang="en">
 <head>
 <meta charset="UTF-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>{{ page.title }} - Jonathan Mettes</title>
 <link title="Jonathan Mettes - Atom" type="application/atom+xml" rel="alternate" href="/atom.xml" />
 <link type="text/css" rel="stylesheet" href="/css/style.css" />
+<link href='http://fonts.googleapis.com/css?family=Lato:300,400|Raleway:100' rel='stylesheet' type='text/css'>
 <link rel="shortcut icon" href="/favicon.ico" />
 <!--[if IE]><script src="/js/html5.js"></script><![endif]-->
+<!--[if lt IE 9]>
+  <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
+<![endif]-->
 </head>
 <body>
-{% include sidebar.html %}
+<div id="header">
+<a href="/"><img src="../images/drawn-circle-trn.png" id="logo" /></a>
+<h1><a href="mailto:[email protected]">Jonathan Mettes</a></h1>
+<p id="first">I'm a software dev and a muso</p>
+<p id="second">Here's a collection of things I make and do</p>
+<p id="third">More: <a href="mailto:[email protected]">email</a> | <a href="http://soundcloud.com/jmettes">soundcloud</a> |
+ <a href="http://youtube.com/user/jonathanmettes/videos">youtube</a> | <a href="https://github.com/jmettes">github</a></p>
+</div>
 <div id="articles">
 <article>
 <h2><a href="{{ page.url }}" title="{{ page.title }}">{{ page.title }}</a></h2>

diff --git a/_posts/2012-09-10-homemade-slide-guitar.md b/_posts/2012-09-10-homemade-slide-guitar.md
@@ -3,36 +3,38 @@ layout: post
 title: Homemade slide guitar
 ---
 
-![Finished slide guitar](https://lh6.googleusercontent.com/-EB8GpYHnvGU/ULL4MXEzhCI/AAAAAAAAApA/Ze1DJmkmwB4/s500/homemade-slide.jpg)
+<p class="image"><img alt="Finished slide guitar" src="https://lh5.googleusercontent.com/-wtbXO7uxY7Y/U2756elAGZI/AAAAAAAAA9Q/ABiOGGNx_gM/w850/8218994705_f40ed1a59c_b.jpg" /></p>
 
 I made my own slide guitar! It's basically just a plank of wood with a bunch of components, some angle brackets and machine heads - really easy. I detail the build below.
 
-![Headstock with drill holes](http://farm9.staticflickr.com/8208/8219700856_4ebd6a4b7d.jpg)
+<p class="image"><img alt="Headstock with drill holes" src="https://lh5.googleusercontent.com/-5-y4xfWIn9c/U27598m6fzI/AAAAAAAAA8Y/qI5Aq4piNPo/w850/8219700856_4ebd6a4b7d_b.jpg" /></p>
 
 I cut up the plank for the headstock so the machine heads have room to pop out (in hindsight, I should've just used a narrower plank). Then I drilled some holes to stick the machine heads though.
 
-![](http://farm9.staticflickr.com/8202/8218624145_97f04de52b.jpg)
+<p class="image"><img src="https://lh6.googleusercontent.com/-N3lWqfrBfRg/U275v4ewycI/AAAAAAAAA74/14tGqb1TszU/w850/8218624145_97f04de52b_b.jpg" /></p>
 
 I bored/chiseled some holes to embed the machine heads in. Not the best craftsmanship. :-)
 
-![](http://farm9.staticflickr.com/8061/8218625867_ec55b6141c.jpg)
+<p class="image"><img src="https://lh3.googleusercontent.com/-dwvD1eJ81xQ/U275x64al8I/AAAAAAAAA8A/AQEJMxLM2W0/w850/8218625867_ec55b6141c_b.jpg" /></p>
 
-![](http://farm9.staticflickr.com/8483/8218635857_3eca101dce.jpg)
+<p class="image"><img src="https://lh4.googleusercontent.com/-67tsuofFof8/U2757SwO_JI/AAAAAAAAA8I/Ss9tTOe1FSk/w850/8218635857_3eca101dce_b.jpg" /></p>
 
-![](http://farm9.staticflickr.com/8058/8219711958_0e447fc160.jpg)
+<p class="image"><img src="https://lh5.googleusercontent.com/-3ug861xoYk4/U276D4uY5II/AAAAAAAAA8g/7Hr_OCmKAVA/w850/8219711958_0e447fc160_b.jpg" /></p>
 
 I used a piece of an angle bracket for the nut and I filed in some grooves for the strings.
 
-![](http://farm9.staticflickr.com/8068/8219713538_85926ae875.jpg)
+<p class="image"><img src="https://lh3.googleusercontent.com/-zvU8ThuEmPo/U276FT76USI/AAAAAAAAA8o/Hcara6aw1MI/w850/8219713538_85926ae875_b.jpg" /></p>
 
 I did the same for the bridge and drilled in some screws to wrap the strings around.
 
-![](http://farm9.staticflickr.com/8209/8218630463_a3102eccb2.jpg)
+<p class="image"><img src="https://lh6.googleusercontent.com/-FO-zQFU6Lew/U2754JlLNyI/AAAAAAAAA8Q/JNLzBBZyj4U/w850/8218630463_a3102eccb2_b.jpg" /></p>
 
 Bored/chiseled some more holes for the pickups and components.
 
-![](http://farm9.staticflickr.com/8348/8218629107_1ebbc34402.jpg)
+<p class="image"><img src="https://lh4.googleusercontent.com/-Z-hXtWbbQ3E/U2751uFd65I/AAAAAAAAA8w/u5sChJ4ZSSk/w850/8218629107_1ebbc34402_b.jpg" /></p>
 
-![](http://farm9.staticflickr.com/8485/8218622801_eb661659a9.jpg)
+<p class="image"><img src="https://lh6.googleusercontent.com/-tdkzQ4lOsqY/U275trbQa6I/AAAAAAAAA84/TJ5rePy5vPQ/w850/8218622801_eb661659a9_b.jpg" /></p>
 
 Made a nice looking scratchplate to hold everything in place.
+
+![](https://lh5.googleusercontent.com/-bv6fPB5cV8A/U276GRAGvGI/AAAAAAAAA7k/kekQXCpgpNE/w500/8219717760_efa9fc97ed_b.jpg)
diff --git a/_posts/2012-10-18-blender-3d-model.md b/_posts/2012-10-18-blender-3d-model.md
@@ -3,19 +3,32 @@ layout: post
 title: Blender 3D model
 ---
 
-![Rendered 3D model](https://lh3.googleusercontent.com/-x3FDcuX7a7U/ULGv3iSP_CI/AAAAAAAAAnk/ax2a580WXcU/s500/render.png)
+<p class="image"><img alt="Rendered 3D model" src="https://lh6.googleusercontent.com/-iYM7BWBhOsQ/U27s0pEi5CI/AAAAAAAAA4E/7Fhnp-IhN0A/w1850/render-orig.png" /></p>
 
 My first attempt at 3D modelling, made using [Blender](http://www.blender.org).
 
-![Making the model in Blender](https://lh3.googleusercontent.com/-6srDGeAWn-c/UH-WYlUdA4I/AAAAAAAAAcY/qY0Akj7Hkz4/s500/screenshot-small.png)
+<p class="image"><img alt="Reference" src="https://lh4.googleusercontent.com/-T2ymW7QwsYY/U27soQEBfTI/AAAAAAAAA38/5YLJKrQvuWo/w850/reference-done.png" /></p>
+
+The original reference sketch I drew. I used the front and side views as a proportion guide to build the model.
+
+
+<p class="image"><img alt="Making the model in Blender" src="https://lh5.googleusercontent.com/-Xcqebpd_HEs/U27uHPatGvI/AAAAAAAAA4Q/GuqahcIfYUU/w850/screenshot1.png" /></p>
 
 Screenshot of the beginning stages of the build. This [great tutorial on tutsplus](http://cg.tutsplus.com/tutorials/blender/character-modeling-in-blender-basix/) helped me learn how to do it.
 
-<iframe frameborder="0" height="480" width="500" src="http://skfb.ly/li2eba?autostart=0&amp;transparent=0&amp;autospin=1&amp;controls=1&amp;watermark=0"><a href="https://sketchfab.com/show/rqnFNDwRip8cyzxtvCn2N8nB3R4">View model at Sketchfab</a></iframe>
+<p class="image"><img alt="Making the model in Blender" src="https://lh3.googleusercontent.com/-dIuXSJMfKrM/U27uIy5gblI/AAAAAAAAA4c/Wn_ZmVBCfWQ/w850/screenshot2.png" /></p>
 
-An interactive view of the early low-poly version my model (without any smoothing & [edge splitting](http://wiki.blender.org/index.php/Doc:2.4/Manual/Modifiers/Generate/Edge_Split), or amazing [ambient occlusion](http://www.youtube.com/watch?v=BsVXdXvk11w)).
+<p class="image"><img alt="Making the model in Blender" src="https://lh5.googleusercontent.com/-XmcuuSMWob0/U27uI-tOMqI/AAAAAAAAA4g/D37Ac3VF0n4/w850/screenshot3.png" /></p>
 
+<p class="image"><img alt="Making the model in Blender" src="https://lh4.googleusercontent.com/-MYtOtRC1QR0/U27uKUpS7bI/AAAAAAAAA4o/o_eHi6UfyOA/w850/screenshot4.png" /></p>
 
-![Reference](https://lh5.googleusercontent.com/-Y95PwG1uEms/UH-Z77sKYTI/AAAAAAAAAeU/iq7R6TPt4u0/s500/reference.png)
+<p class="image"><img alt="Making the model in Blender" src="https://lh3.googleusercontent.com/-ufTMgaMmltw/U27uLsMMGaI/AAAAAAAAA4w/H996hvNJw5Q/w850/screenshot5.png" /></p>
+
+<p class="image"><img alt="Making the model in Blender" src="https://lh5.googleusercontent.com/-zTDnanAB9Kk/U27uMaF8R3I/AAAAAAAAA44/iN0Um_zFS0g/w850/screenshot6.png" /></p>
+
+<p class="image"><img alt="Making the model in Blender" src="https://lh4.googleusercontent.com/-AZ0_j-19I3o/U27uOMlaWfI/AAAAAAAAA5A/IYwnsv1jB_c/w850/screenshot7.png" /></p>
+
+<iframe frameborder="0" height="480" width="500" src="http://skfb.ly/li2eba?autostart=0&amp;transparent=0&amp;autospin=1&amp;controls=1&amp;watermark=0"><a href="https://sketchfab.com/show/rqnFNDwRip8cyzxtvCn2N8nB3R4">View model at Sketchfab</a></iframe>
+
+An interactive view of the early low-poly version my model (without any smoothing & [edge splitting](http://wiki.blender.org/index.php/Doc:2.4/Manual/Modifiers/Generate/Edge_Split), or amazing [ambient occlusion](http://www.youtube.com/watch?v=BsVXdXvk11w)).
 
-The original reference sketch I drew. I used the front and side views as a proportion guide to build the model.
diff --git a/_posts/2012-11-23-diy-tissue-box-amp.md b/_posts/2012-11-23-diy-tissue-box-amp.md
@@ -3,18 +3,18 @@ layout: post
 title: DIY tissue box guitar amp
 ---
 
-![tissue box amp](http://farm9.staticflickr.com/8200/8202154712_dfff97bab7.jpg)
+<p class="image"><img alt="tissue box amp" src="https://lh4.googleusercontent.com/-6Pwhv_PmRQk/U273aSq_PuI/AAAAAAAAA6E/DksbesaOTTM/w850/8202154712_dfff97bab7_b.jpg" /></p>
 
 I made a great little battery-powered practice amp thanks to the ubiquitous "Little Gem" project by [runoffgroove.com](http://www.runoffgroove.com/littlegem.html).
 
 ![Little Gem schematic](https://lh3.googleusercontent.com/-X8sUApMtOhM/UNEB4o8zwOI/AAAAAAAAArY/oQHvUsvDA2U/w500/amp-diagram.png)
 
 The schematic I used for building the amp. The main component of interest is the [LM386](http://en.wikipedia.org/wiki/LM386) op-amp chip to be inserted in socket - a popular choice for battery powered amps.
 
-<iframe src="http://player.vimeo.com/video/53911083?badge=0&amp;title=0&amp;byline=0&amp;portrait=0" allowfullscreen="allowfullscreen" frameborder="0" height="281" width="500"><a href='https://vimeo.com/53911083'>Watch DIY tissue box amp jam on vimeo</a></iframe>
+<p class="video"><iframe src="http://player.vimeo.com/video/53911083?badge=0&amp;title=0&amp;byline=0&amp;portrait=0" allowfullscreen="allowfullscreen" frameborder="0" height="281" width="500"><a href='https://vimeo.com/53911083'>Watch DIY tissue box amp jam on vimeo</a></iframe></p>
 
 My first time filming/editing (I used Premiere Pro)! The video highlights the build process of the amp - keep an eye out for a demo of it at the end. :-)
 
-![My recording setup](http://farm9.staticflickr.com/8067/8201093129_36e783c3d7.jpg)
+<p class="image"><img alt="My recording setup" src="https://lh5.googleusercontent.com/-r3Fdh_wOtw0/U273aAXrYYI/AAAAAAAAA6A/LVYNkl5d3Hg/w850/8201093129_36e783c3d7_b.jpg" /></p>
 
 My recording setup: one camera on a tripod, two tablets with chairs/boxes as make-shift stands, a mic, a laptop running [Audacity](http://audacity.sourceforge.net/) and a bunch of desk lamps.
diff --git a/_posts/2013-02-20-slide-guitar-workshop.md b/_posts/2013-02-20-slide-guitar-workshop.md
@@ -3,15 +3,15 @@ layout: post
 title: Slide guitar workshop at LCA 2013
 ---
 
-![Passing out the slide guitar planks](https://lh3.googleusercontent.com/-4XwXHvaRprs/USRQN6R7FxI/AAAAAAAAAuA/7_MlsCHOzP4/w500/lca-workshop.jpg)
+<p class="image"><img alt="Passing out the slide guitar planks" src="https://lh5.googleusercontent.com/-JVLLH0p2c9I/U27z8AMTK9I/AAAAAAAAA5s/eLMRNBzTFuk/w850/8428219491_aaa66a0f0f_b.jpg" /></p>
 
 At the [2013 Linux Conference Australia](http://linux.conf.au), I gave [mini-conf](http://www.annodex.org/events/lca2013_mmm/pmwiki.php/Main/Timetable) workshop on building simple musical instruments out of everyday parts. I gave each of the participants a plank of wood and a bunch of cheap parts, and by the end of the workshop, I had them all rocking out on their own homebrew slide guitars!
 
-![Giving demo of slide guitar](https://lh4.googleusercontent.com/-t0l4xJMoV0o/USRQN2JgGHI/AAAAAAAAAt4/7C9p3imCZ7E/w500/lca-workshop2.jpg)
+<p class="image"><img alt="Giving demo of slide guitar" src="https://lh3.googleusercontent.com/-O4OwYhkxQIY/U27z8TtrvgI/AAAAAAAAA50/AFhDVJQzMxE/w850/8429310932_066ba14389_b.jpg" /></p>
 
 Here's a video of the build process and a bit of a demo:
 
-<iframe src="http://player.vimeo.com/video/59792793?badge=0&amp;title=0&amp;byline=0&amp;portrait=0" allowfullscreen="allowfullscreen" frameborder="0" height="281" width="500"><a href='https://vimeo.com/59792793'>Watch Building a one-string slide guitar on vimeo</a></iframe>
+<p class="video"><iframe src="http://player.vimeo.com/video/59792793?badge=0&amp;title=0&amp;byline=0&amp;portrait=0" allowfullscreen="allowfullscreen" frameborder="0" height="281" width="500"><a href='https://vimeo.com/59792793'>Watch Building a one-string slide guitar on vimeo</a></iframe></p>
 
 ![Slide guitar diagram](https://lh5.googleusercontent.com/-VGlZNPKY33A/USRTX6PaI-I/AAAAAAAAAuc/0g8ikBvfc6c/w500/slide-diagram.png)
 

diff --git a/_posts/2013-12-13-hackathon-act.md b/_posts/2013-12-13-hackathon-act.md
@@ -3,16 +3,16 @@ layout: post
 title: Award winning app at HACT '13
 ---
 
-![Passing out the slide guitar planks](https://lh5.googleusercontent.com/-K_leSuSbpMU/UqpVn58ZKSI/AAAAAAAAA0I/JWpquM5w-Ak/w500/hackathon.jpg)
+<p class="image"><img alt="Passing out the slide guitar planks" src="https://lh5.googleusercontent.com/-K_leSuSbpMU/UqpVn58ZKSI/AAAAAAAAA0I/JWpquM5w-Ak/w850/hackathon.jpg" /></p>
 
 At [Hackathon ACT '13](http://hact.org), I teamed up with four other coders, designers and entrepreneurs to prototype an app from scratch in a weekend.
 
-![Awarded for best innovation for government](https://lh3.googleusercontent.com/-xvI_xwfOXM4/UqpRMeXIu6I/AAAAAAAAAz4/r6yVX0APgBw/w500/hact-award.jpg)
+<p class="image"><img alt="Awarded for best innovation for government" src="https://lh3.googleusercontent.com/-xvI_xwfOXM4/UqpRMeXIu6I/AAAAAAAAAz4/r6yVX0APgBw/w850/hact-award.jpg" /></p>
 
 Our aim was to make queuing quicker, and replacing paperwork for corporate and government service desks. Our app won an award for Best Innovation for Government.
 
-![FormaQ web app](https://lh3.googleusercontent.com/-hGSm4L0f6QA/UqpOZXr7faI/AAAAAAAAAzk/667oW0m3kD8/w500/formaq.png)
+<p class="image"><img alt="FormaQ web app" src="https://lh3.googleusercontent.com/-hGSm4L0f6QA/UqpOZXr7faI/AAAAAAAAAzk/667oW0m3kD8/w850/formaq.png" /></p>
 
 The project involved making an iPhone app for customers to fill in forms while queuing. As well as a web app for handling the filled out forms.
 
-![FormaQ iPhone app](https://lh4.googleusercontent.com/-P_C-ttm14TU/Uqppz26cDUI/AAAAAAAAA1I/DG2vzpC9LlQ/w150/formaq-iphone-app.png)
+<p class="thumb"><img alt="FormaQ iPhone app" src="https://lh4.googleusercontent.com/-P_C-ttm14TU/Uqppz26cDUI/AAAAAAAAA1I/DG2vzpC9LlQ/w150/formaq-iphone-app.png" /></p>
diff --git a/_posts/2014-01-15-im-gone-song.md b/_posts/2014-01-15-im-gone-song.md
@@ -0,0 +1,6 @@
+---
+layout: post
+title: I'm gone - song
+---
+
+<iframe width="100%" height="150" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/123274467&amp;auto_play=false&amp;hide_related=false&amp;visual=false&amp;show_artwork=false&amp;show_playcount=false&amp;sharing=false"></iframe>
diff --git a/_posts/2014-01-21-bluetooth-proximity-project.md b/_posts/2014-01-21-bluetooth-proximity-project.md
@@ -3,16 +3,16 @@ layout: post
 title: Bluetooth proximity project
 ---
 
-<iframe src="//www.youtube.com/embed/H4rzc52UtUw?controls=0&amp;showinfo=0" allowfullscreen="allowfullscreen" frameborder="0" height="255" width="500"><a href='http://www.youtube.com/watch?v=H4rzc52UtUw'>Watch Bluetooth proximity project on YouTube</a></iframe>
+<p class="video"><iframe src="//www.youtube.com/embed/H4rzc52UtUw?controls=2&amp;showinfo=0" allowfullscreen="allowfullscreen" frameborder="0" height="255" width="500"><a href='http://www.youtube.com/watch?v=H4rzc52UtUw'>Watch Bluetooth proximity project on YouTube</a></iframe></p>
 
-I'm working on a project using Bluetooth to build location aware apps. The new [Bluetooth 4.0 standard](http://www.extremetech.com/computing/110759-the-future-of-advertising-omnipresent-bluetooth-4-0) is a lot more power efficient, and more importantly, allows for unpaired data advertising. This means any number of bluetooth devices could communicate to phones without first having to go through the tedious manual process of pairing.
+I'm working on a project using Bluetooth to build location aware apps. The new [Bluetooth 4.0 standard](http://www.extremetech.com/computing/110759-the-future-of-advertising-omnipresent-bluetooth-4-0) is a lot more power efficient, and more importantly, allows for unpaired data advertising. This means any number of Bluetooth devices could communicate to phones without first having to go through the tedious manual process of pairing.
 
-![nRF24L01+ and ATMega368 on a breadboard](https://lh4.googleusercontent.com/-kxvLSbtNcT4/Ut3HLgwoqoI/AAAAAAAAA2A/px2FfvrzEpo/w500/bluetooth-transmitter.jpg)
+<p class="image"><img alt="nRF24L01+ and ATMega368 on a breadboard" src="https://lh4.googleusercontent.com/-kxvLSbtNcT4/Ut3HLgwoqoI/AAAAAAAAA2A/px2FfvrzEpo/w850/bluetooth-transmitter.jpg" /></p>
 
-I built a simple bluetooth transmitter using an [nRF24L01+](http://www.nordicsemi.com/eng/Products/2.4GHz-RF/nRF24L01P) RF transciever, and is powered by an [ATMega328P-PU](http://www.atmel.com/devices/atmega328p.aspx) chip and a battery pack.
+I built a simple bluetooth transmitter using an [nRF24L01+](http://www.nordicsemi.com/eng/Products/2.4GHz-RF/nRF24L01P) RF transciever, and is powered by an [ATMega328P-PU](http://www.atmel.com/devices/atmega328p.aspx) microcontroller and a battery pack.
 
-![nRF24L01+ and ATMega328P-PU](https://lh4.googleusercontent.com/-b_Jivkkrc3U/Ut3HLEXuBjI/AAAAAAAAA18/mA-E-bAPtyk/w500/nrf24l01-atmega328.jpg)
+<p class="image"><img alt="nRF24L01+ and ATMega328P-PU" src="https://lh4.googleusercontent.com/-b_Jivkkrc3U/Ut3HLEXuBjI/AAAAAAAAA18/mA-E-bAPtyk/w850/nrf24l01-atmega328.jpg" /></p>
 
 I wrote a simple proof-of-concept program in Objective C, which listens for the Bluetooth transmitters and displays which is closest. It works by comparing the signal strength ([RSSI value](http://en.wikipedia.org/wiki/Received_signal_strength_indication)) of each device.
 
-![Bluetooth XCode app](https://lh6.googleusercontent.com/-XydKa00Kk8U/Ut3ZWBUYPEI/AAAAAAAAA2c/xi4mz1vpIZ4/w500/bluetooth-screenshot.png)
+<p class="image"><img alt="Bluetooth XCode app" src="https://lh6.googleusercontent.com/-XydKa00Kk8U/Ut3ZWBUYPEI/AAAAAAAAA2c/xi4mz1vpIZ4/w850/bluetooth-screenshot.png" /></p>
diff --git a/_posts/2014-02-30-game-jam-2014.md b/_posts/2014-02-30-game-jam-2014.md
@@ -0,0 +1,13 @@
+---
+layout: post
+title: GameJam 2014
+---
+
+
+<p class="image"><img src="https://lh3.googleusercontent.com/-8sN00ogMT6w/U284vdFiXKI/AAAAAAAAA-U/PwSNM3ybjvs/w855/IMG_6895.jpg" /></p>
+
+This year I participated in [Global Game Jam 2014](http://globalgamejam.org/2014/games/escape-library) together with some friends.
+
+<p class="image"><img src="https://lh4.googleusercontent.com/-D3EdBPcpgXs/U2847Zp-EjI/AAAAAAAAA-s/Wypu4w6zBts/w855/capture_3.png" /></p>
+
+In 48 hours, along with the GameJam theme _"We don't see things as they are, we see them as we are"_, we created a simple side-scroller game using the [LÖVE](http://love2d.org) Lua game framework, as well as all the sounds and graphical game assets.
diff --git a/_posts/2014-03-27-watercolour-painting.md b/_posts/2014-03-27-watercolour-painting.md
@@ -0,0 +1,8 @@
+---
+layout: post
+title: Watercolour Painting
+---
+
+<p class="image"><img src="https://lh5.googleusercontent.com/-n_q-07cHRy4/U29GxNbJabI/AAAAAAAAA_4/uB3ARqyn3zQ/w855/IMG_6766.JPG" /></p>
+
+My first attempt at using watercolour paint.