<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss 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/" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0">

<channel>
	<title>Ubelly</title>
	
	<link>http://www.ubelly.com</link>
	<description />
	<lastBuildDate>Wed, 22 May 2013 08:23:59 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.4.2</generator>
		<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/ubelly" /><feedburner:info uri="ubelly" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><item>
		<title>Content before Chrome and on-demand UI</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/O5ky4RdIavE/</link>
		<comments>http://www.ubelly.com/2013/05/content-before-chrome-and-on-demand-ui/#comments</comments>
		<pubDate>Mon, 20 May 2013 13:45:28 +0000</pubDate>
		<dc:creator>Spooner</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[Windows8]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18454</guid>
		<description><![CDATA[<div><img width="312" height="234" src="http://www.ubelly.com/wp-content/uploads/2013/05/featimg.jpg" class="attachment-type-photo wp-post-image" alt="featimg" title="featimg" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/featimg-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="featimg" title="featimg" style="float:left; margin:0 15px 15px 0;" />&#8216;Take advantage of the screen real estate&#8217;. That&#8217;s a common saying that was bandied around when working on the web  <a href="http://www.ubelly.com/2013/05/content-before-chrome-and-on-demand-ui/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="234" src="http://www.ubelly.com/wp-content/uploads/2013/05/featimg.jpg" class="attachment-type-photo wp-post-image" alt="featimg" title="featimg" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/featimg-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="featimg" title="featimg" style="float:left; margin:0 15px 15px 0;" /><p>&#8216;Take advantage of the screen real estate&#8217;. That&#8217;s a common saying that was bandied around when working on the web in the early days. As screen resolutions increased we (collective we &#8211; designers, developers &#8211; the makers of the internet) chose not to celebrate that space and allow the content to breathe, instead we looked to see what we could add that would give us extra &#8216;stuff&#8217; and more buttons and separator lines and tiled backgrounds even animated GIFs and information and screens became busier, busier, busier. &#8220;Look, we have a 100&#215;100 pixel space. Add a button to do something, drop a weather widget in. Fill the space!&#8221;. It was a cacophony of visual noise and at the time, we thought it was great. I was there.</p>
<p>That mentality of filling space with confusion I partly blame on science fiction. I&#8217;ve often said in public that technologists look to science fiction for inspiration. Who wouldn&#8217;t want to have all the buttons and flashing lights that Uhura had in the original Star Trek? Those sets were designed to look complicated &#8211; after all, this being the future would surely mean that we would have invented many new technologies and devices and each of those would require at least one button, one light and an accompanying beep. That&#8217;s what made those visions of the future so exciting &#8211; the level of complexity and the thought that we&#8217;d need to be super clever and aware in order to operate these gigantic space engines. Did anyone think that we might also make sweeping advances in UI design so that it could all actually be controlled by a joystick with one button? Maybe, but I doubt that version of Star Trek would have been given the funding from the TV studios, this looks much more exciting:</p>
<p><img class="alignnone size-full wp-image-18457" title="Uhura and the Starship Enterprise" src="http://www.ubelly.com/wp-content/uploads/2013/05/Uhura.jpg" alt="Uhura and the Starship Enterprise" width="644" height="483" /></p>
<p>When I look at games like World of Warcraft, the menus and the stats that you see are bonkers. The first time I played that game it was confusing, more then confusing, it was incomprehensible. Check this:</p>
<p><img class="alignnone size-full wp-image-18462" title="World of Warcraft Interface" src="http://www.ubelly.com/wp-content/uploads/2013/05/World-of-Warcraft-1.jpg" alt="World of Warcraft Interface" width="644" height="403" /></p>
<p>When I started playing, I wondered how I could ever be able to understand what any of that meant. But after a short amount of time, with a little investment, it became second nature and although there are options to turn parts of that UI off, I didn&#8217;t. It would have meant that my game play would be slower and I wouldn&#8217;t be as quick to respond. Part of being a player, a good player, was being able to read that interface. If this WoW talk is all gobbledygook to you then at least take a moment to enjoy Leroy Jenkins, one of my favourite examples of video that justifies the whole of the internet (WARNING: colourful language alert):</p>
<p><iframe src="http://www.youtube.com/embed/LkCNJRfSZBU" frameborder="0" width="644" height="483"></iframe></p>
<p>We have complicated UI on desktop programs &#8211; but they need to be complicated because they&#8217;re doing complicated things. For instance, Visual Studio &#8211; there&#8217;s even more detail required there than in WoW and complicated applications like that are not going to go away, here&#8217;s my current Visual Studio screen:</p>
<p><img class="alignnone size-full wp-image-18461" title="Screenshot from Visual Studio" src="http://www.ubelly.com/wp-content/uploads/2013/05/vs-screeny.jpg" alt="Screenshot from Visual Studio" width="644" height="382" /></p>
<p>With Windows 8 we now have a new style of application &#8211; Windows Store applications. These applications seek to remove as much of the UI from the screen as possible &#8211; the concept behind this being that if there&#8217;s no UI on the screen then the user&#8217;s focus is on the content. Here&#8217;s a screenshot of a photo of mine in the Photo application:</p>
<p><img class="alignnone size-full wp-image-18460" title="Photo App in Windows 8" src="http://www.ubelly.com/wp-content/uploads/2013/05/photo-in-win8-photo-app.jpg" alt="Photo App in Windows 8" width="644" height="403" /></p>
<p>There&#8217;s no UI on the screen &#8211; there doesn&#8217;t need to be and it means that the content gets my full visual focus. The content then becomes the UI, the inherent nature of that particular piece of content within the context of that application means I know if I touch and swipe I can then cycle through the other photos on my machine. We don&#8217;t need a button to indicate that that is the method of interaction, we&#8217;ve removed the chrome. However, if wanted to do something more than swipe through my photos, our approach is to employ on-demand UI.</p>
<h2>On-demand UI</h2>
<p>With Windows 8, if the content on the screen isn&#8217;t, or can&#8217;t be the interaction then we look to the edge. To the right for the Charms Bar for searching, sharing and settings, and if I want to find commands to interact with the screen, I swipe from the top or the bottom to pull up a control that we refer to as the Application Bar. Here&#8217;s the same photo after I&#8217;ve swiped in from the top:</p>
<p><img class="aligncenter size-full wp-image-18459" title="Photo App in Windows 8 with App Bar" src="http://www.ubelly.com/wp-content/uploads/2013/05/photo-in-win8-photo-app-with-appbar.jpg" alt="Photo App in Windows 8 with App Bar" width="644" height="403" /></p>
<p>You can see that I now have a back button on the top right (which takes me to a folder view of my images) or on the bottom application bar I can now perform some editing functions but I call on those functions only when I need them.</p>
<p>With the Modern UI, I celebrate the content and embrace the space available in the application. In the photo example above, that application is all about me enjoying my photos and not having to be distracted by buttons around the photos that could distract me from the task at hand. The Photos app is a very visual example, but how about an audible example, with Xbox Music. When I have that open, I&#8217;m enjoying the music that I&#8217;m listening to, I can glance at the screen and see exactly what track is playing without figuring out the UI first.</p>
<p><img class="aligncenter size-full wp-image-18458" title="Xbox Music app on Windows 8" src="http://www.ubelly.com/wp-content/uploads/2013/05/jp-xbox-music.jpg" alt="Xbox Music app on Windows 8" width="644" height="363" /></p>
<p>I can see what song is playing, where abouts in that track I am and if i&#8217;m not interacting with the app then I enjoy the additional imagery that&#8217;s pulled in from the cloud and that augments the experience. It&#8217;s like when the radio in my car would not just say &#8216;Radio 2&#8242; but would say Radio 2, Chris Evans, and even tell me the name of the track. A small bit of information that doesn&#8217;t distract from the experience, but adds to the experience.</p>
<p>The same is true of Windows Store apps. That&#8217;s the beauty of the Modern UI. It&#8217;s all about the content. I don&#8217;t need to know the biography of the artist, I don&#8217;t need to know who the bass player is but at the time when I do, then by using the edges of the screen I can use the on-demand ui get to that information. That&#8217;s the key. 95% of the time it&#8217;s just visual noise, but if I need it I can get it.</p>
<h2>Reduce distractions</h2>
<p>If I&#8217;m reading a book, all I want to see is the words that the writer has written. I like the Kindle for this, there&#8217;s not even a clock on it &#8211; I&#8217;m sure there was a conscious decision made by the designers at Amazon at some point when it would have been so easy to incorporate a clock into the top corner of the screen. Maybe that&#8217;s their homage to the authenticity of a book. Maybe, they recognised that when you&#8217;re reading it&#8217;s about the story. It&#8217;s a feature that I find both annoying but also amazingly satisfying about reading on my Kindle. Any additional info that&#8217;s placed on the screen is only a distraction. &#8216;How long have I been reading?&#8217; &#8216;How long do I have before I should go to bed?&#8217; That&#8217;s why I love my Kindle, because it makes me just read and read and not care about the time and I&#8217;ll read till the early hours of the morning because the story is brilliant and there&#8217;s not a clock to remind me that it&#8217;s only 5 hours till daybreak. I don&#8217;t care. I want to know how Ender will finish his game.</p>
<h2>Ho Designers</h2>
<p>The same is true of Windows Store applications. When you decide what it is that your app is meant to be doing, don&#8217;t worry about the extra space that is available that you could fill with info, let the the user enjoy the content of the app, let the user revel in the content that you&#8217;ve worked so hard on and when they need to interact with your content, they know to look to the edge to find that interaction. Celebrate space.</p>
<p>This can be a difficult concept to grasp, especially when you&#8217;re coming from a different platform, be that a traditional Windows desktop applications or an application on another platform. But once you get it, you realise that it allows your user to enjoy and immerse themselves in the product they&#8217;re investigating, the article they&#8217;re reading, the image they&#8217;re viewing.</p>
<p>I spent some time with a chap at one of our workshops who had the most incredibly complicated desktop application. He had been tasked by his boss to turn it into a touch screen app. After reviewing the functionality, it was clear that this was never going to happen, however, when we talked through how his desktop app was used, it became clear that 10% of the time it required the complicated desktop application experience, 90% of the time it could be a touch screen app. So his desktop app did not and never will disappear, but it became apparent that there could be a touch app used 90% of the time to keep the day to day running of the app in place. That made me really happy. For 2 reasons.</p>
<ol>
<li>Desktop apps will never disappear &#8211; some apps will always have a level of complexity that cannot be translated to a touch screen be that because of the complexity of the app itself or maybe the requirement for precise input of a lot of data (our fingers are not very precise when matched aginst a mouse) eg, Visual Studio, Visio or Photoshop</li>
<li>There are aspects of these programs that can become touch enabled and separated out to this new style of application, and as such become more accessible to a wider audience on a number of different devices</li>
</ol>
<p>The lesson we learn there is &#8211; user context &#8211; recognise when your app is going to be used and customise for those user scenarios. Don&#8217;t try and convert an app to a tablet because that&#8217;s what you carry around in your pocket. Customise for touch, where touch is appropriate.</p>
<h2>Celebrate the content</h2>
<p>Allow the user to immerse themselves and only when they need to interact should they have to bring up the commands that allow them to do so. The application bar is your friend. For Windows 8 users it quickly becomes second nature. You digest the content on the screen and at the point where you need to change it, share it, move it, interact with it, you look to that first pixel and the on-demand UI gracefully glides in.</p>
<p>We are creatures of habit and we don&#8217;t like change. However, we are also brilliant at recognising and adapting to more efficient and beautiful ways of working.</p>
<p>Find out more: <a href="http://design.windows.com/">http://design.windows.com/</a>.</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/O5ky4RdIavE" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/content-before-chrome-and-on-demand-ui/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/content-before-chrome-and-on-demand-ui/</feedburner:origLink></item>
		<item>
		<title>What to wear – Critters edition</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/egVCLKxsXX0/</link>
		<comments>http://www.ubelly.com/2013/05/what-to-wear-critters-edition/#comments</comments>
		<pubDate>Wed, 15 May 2013 10:00:06 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[Event]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18409</guid>
		<description><![CDATA[<div><img width="460" height="297" src="http://www.ubelly.com/wp-content/uploads/2013/05/prince-charles.jpg" class="attachment-type-photo wp-post-image" alt="prince charles" title="prince charles" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/prince-charles-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="prince charles" title="prince charles" style="float:left; margin:0 15px 15px 0;" />It&#8217;s time for the most important post we&#8217;ll publish around this year&#8217;s Critters. The awards? A mere sideshow. The incredible  <a href="http://www.ubelly.com/2013/05/what-to-wear-critters-edition/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="460" height="297" src="http://www.ubelly.com/wp-content/uploads/2013/05/prince-charles.jpg" class="attachment-type-photo wp-post-image" alt="prince charles" title="prince charles" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/prince-charles-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="prince charles" title="prince charles" style="float:left; margin:0 15px 15px 0;" /><p>It&#8217;s time for the most important post we&#8217;ll publish around this year&#8217;s Critters. The awards? A mere sideshow. The incredible entertainment? An afterthought. Now we know (and based on Twitter we really do know) that you&#8217;ve all been most perplexed by what to wear. Well, help is at hand, we&#8217;ve put together a guide to ‘what to wear for The Critters’  which means you&#8217;ll avoid any fashion faux pas on the night.</p>
<h3>Dress Code &#8211; Black Tie</h3>
<p><img src="http://blogs.telegraph.co.uk/culture/files/2013/01/royal-william-char_1884295b.jpg" alt="" /></p>
<p>For those of you who are committing 100% to the theme, we applaud you. All of the Ubelly team will be rocking the full on Black Tie look and we&#8217;ve been drawing inspiration from this <a href="http://www.gq-magazine.co.uk/style/articles/2012-08/30/black-tie-guide-suit-shirt-how-to">handy guide</a>. That means dress shirt, tuxedo, bow tie and (polished) black shoes. A handkerchief tucked into your jacket pocket is optional, but highly recommended.</p>
<h3>Also acceptable: Hollywood Black Tie or to 99.9% of the population &#8211; a suit and black tie.</h3>
<p>The playing it cool alternative to full on black-tie, just pair your favourite shirt with a black tie and a matching jacket and trousers and you&#8217;ll be flying.</p>
<p><img src="http://im01.galawallpapers.net/photo/77900/Leonardo_DiCaprio_04.jpg" alt="" width="600" height="480" /></p>
<p>And if you need any more persuading as to why you should suit up:</p>
<p><iframe src="http://www.youtube.com/embed/CiweaZQ8g5U" frameborder="0" width="560" height="315"></iframe></p>
<div><strong> <span style="font-size: 1em;">The alternative: A Penguin Onesie and a bow tie.</span></strong></div>
<p><a href="http://www.ubelly.com/2013/05/what-to-wear-critters-edition/penguin-onesie/" rel="attachment wp-att-18414"><img class="size-medium wp-image-18414 alignleft" title="penguin onesie" src="http://www.ubelly.com/wp-content/uploads/2013/05/penguin-onesie-129x300.jpg" alt="" width="129" height="300" /></a>We know for some of you suiting up is a deal breaker, so we&#8217;re willing to compromise. Penguins look an awful lot like they&#8217;re wearing a suit already, so if you come wearing a Penguin Onesie and some form of bow tie we&#8217;ll accept that as embracing the spirit of the dress code.</p>
<p><strong>And for the ladies</strong> &#8211; We&#8217;re confident you don&#8217;t need our help to look amazing, but if you need  a starting point, we&#8217;d recommend your favourite cocktail dress and your best dancing shoes.</p>
<p>Of course if you want to don Onesies as well, we won&#8217;t hold it against you.</p>
<p><strong>As for what not to wear.</strong> Well, if you could make sure your clothes are clean and you&#8217;re not wearing Pyjamas that would be a start. Basically if you&#8217;d wear it while lounging around your bedroom hungover on a weekend, it&#8217;s probably not going to be suitable for wearing to The Critters (Penguin Onesies excepted)</p>
<p>Still not got your ticket?  Don&#8217;t miss out, <a href="http://ubelly.com/thecritters">grab one today!</a></p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/egVCLKxsXX0" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/what-to-wear-critters-edition/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/what-to-wear-critters-edition/</feedburner:origLink></item>
		<item>
		<title>Supporting, educating and designing at Industry Conf</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/zaQwI7zPcpo/</link>
		<comments>http://www.ubelly.com/2013/05/supporting-educating-and-designing-at-industry-conf/#comments</comments>
		<pubDate>Wed, 15 May 2013 09:13:43 +0000</pubDate>
		<dc:creator>Luke</dc:creator>
				<category><![CDATA[Event]]></category>
		<category><![CDATA[conference]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[gavin elliot]]></category>
		<category><![CDATA[industryconf]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18425</guid>
		<description><![CDATA[<div><img width="640" height="480" src="http://www.ubelly.com/wp-content/uploads/2013/05/industrybadge.jpg" class="attachment-type-photo wp-post-image" alt="industrybadge" title="industrybadge" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/industrybadge-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="industrybadge" title="industrybadge" style="float:left; margin:0 15px 15px 0;" />A few weeks ago we headed north for Gavin Elliot&#8216;s inaugural Industry Conference. Gavin was one of the forces behind  <a href="http://www.ubelly.com/2013/05/supporting-educating-and-designing-at-industry-conf/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="640" height="480" src="http://www.ubelly.com/wp-content/uploads/2013/05/industrybadge.jpg" class="attachment-type-photo wp-post-image" alt="industrybadge" title="industrybadge" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/industrybadge-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="industrybadge" title="industrybadge" style="float:left; margin:0 15px 15px 0;" /><p>A few weeks ago we headed north for <a title="Gavin on Twitter" href="http://twitter.com/gavinelliot">Gavin Elliot</a>&#8216;s inaugural <a href="http://industryconf.com/">Industry Conference</a>. Gavin was one of the forces behind Newcastle&#8217;s other web conference <a title="DIBI 2012 – creativity, words of wisdom and kinect" href="http://www.ubelly.com/2012/04/dibi-2012-creativity-words-of-wisdom-and-kinect/">DIBI</a>, which we&#8217;ve been to the last few years and loved, and Industry Conf is the product of his time after Codeworks. Taking place in the rather astonishing Turbine Hall, where Newcastle&#8217;s tram system used to be run from, Industry Conf saw 8 speakers from the UK and abroad share their views on the web design and development industry, via product design, cross cultural UX, education and, probably the strangest, insurance. The entire day was a great mix of speakers, and we&#8217;ve highlighted a few of our favourites from the day. I also managed to sketchnote a couple of the talks, which you can find at the bottom of the post.</p>
<h3>Rachel Andrew and Perch</h3>
<p>To begin the day, <a title="Rachel on Twitter" href="http://twitter.com/RachelAndrew">Rachel Andrew</a>, co-founder of the tiny CMS <a title="How and why to avoid mixing your mark-up and serverside code" href="http://www.ubelly.com/2012/11/how-and-why-to-avoid-mixing-your-mark-up-and-serverside-code/">Perch</a>, took a non-design and non-development route to her talk by focussing on customer support. However, what came out of her talk was a great insight into how to build a successful product, how to use customer feedback and a few lessons and tips for anyone thinking of going into the realm of product. One aspect that Rachel talked a lot about was how much customer feedback affects Perch&#8217;s features and roadmap. She made the comment that &#8220;In business, you get what you want by giving people what you want.&#8221; However, she also went on to talk about how even though the more you talk to your customers, the clearer your roadmap gets, that you always need to protect the core use case of your product. If you only build in features that benefit the vocal minority, you&#8217;ll usually end up alienating and losing your majority.</p>
<p>There were two really interesting insights into how Drew and Rachel are trying to design support out of Perch. First, building in useful user feedback and writing solid documentation is one of the key ways of designing support out of your product. However, there will always be support requests. One of the ways that they&#8217;re looking at effective ways to scale is via their <a title="Perch Registered Developers" href="http://grabaperch.com/developers">Registered Developers programme</a>. Basically, they can advertise the skills of their passionate, skilled users to help the rest of their users when building or designing a Perch site. It&#8217;s a really good example of using your community to make your product better.</p>
<h3><strong>Christopher Murphy and Education</strong></h3>
<p><a title="Christopher on Twitter" href="http://twitter.com/fehler">Christopher Murphy</a> is one half of <a title="The Standardistas" href="http://webstandardistas.com/">The Standardistas</a>, the tweed-clad duo from Belfast, who as well as putting out various internet musings and writing great books on web design, also double as educators at University of Ulster. It was on this subject that Christopher was focussing on at Industry, and how we can make education in the web industry better. There were three key things that I took away from his talk: the benefits of a master/apprentice system, the skills we teach versus the skills we should teach, and the importance of paying it forward.</p>
<p>For the most part, the current way of learning in the web industry is either a solo-journey, where the student teaches themselves from a variety of different materials, or as a more traditional one-to-many teaching style, usually through conferences, workshops or courses. However, looking at the master/apprentice model, there are some obvious benefits. Not only is dedicated time given from someone who already knows their craft inside out, but there is also an exchange of skills and values going on between master and apprentice that shapes both parties.</p>
<p>Another interesting point Christopher touches on is that current ways of teaching design focusses on skills, techniques, craftsmanship and business. However, he suggests that we need to look at more fundamental aspects, including self belief, confidence, manners and politeness. He believes that focussing on these core values can help shape a designer much better than just tooling them with the practical aspects of the job.</p>
<p>Finally, Christopher echoed what I&#8217;ve been hearing a lot at conferences in the past few years, which is around the concept of paying it forward. Similar to Seb&#8217;s call to &#8216;<a title="DIBI 2012 – creativity, words of wisdom and kinect" href="http://www.ubelly.com/2012/04/dibi-2012-creativity-words-of-wisdom-and-kinect/">Play, Create, Share</a>&#8216;, Christopher makes the point that the industry can only get better when we share and teach, whether it be through writing, speaking or just building and talking about it. I completely agree with the sentiment, and think it&#8217;s really important that there are people who are looking at what they can do to help shape our industry.</p>
<h3>Josh Brewer and Twitter</h3>
<p>One of the definite highlights of the day was seeing <a title="Josh on Twitter" href="http://twitter.com/jbrewer">Josh Brewer</a>, one of the design leads for Twitter, talk through the problems and process of redesigning Twitter. Firstly, it was refreshing to see a company being transparent about their design processes, especially a company as public and big as Twitter. This kind of insight is a great tool to teach others about key aspects of product design, and sharing your failures as well as your successes helps others learn the to dos and not to dos.</p>
<p>Josh took us through the original concepts they had for &#8216;new new Twitter&#8217;, including a key concept of content pivots, where you can easily swipe between your base feed, a photo feed, and a content feed. However, according to Josh, it was a classic example of design not talking to engineering early enough to discuss technical limitations for the platform that meant that a lot of the design features couldn&#8217;t be incorporated for this release. Another interesting insight was that a lot of the design features that get incorporated aren&#8217;t the result of endless meetings, brainstorms, testing sessions etc, but the insight of a single designer, who then prototypes their idea and convinces the rest of the team that it&#8217;s worth putting in. It reminds me of Jay Fanelli&#8217;s article for <a href="http://the-pastry-box-project.net/jay-fanelli/2013-january-11/">The Pastry Box Project</a>, and how we should be mindful of the fact that when we complain publicly (and snarkily) about something in a service we use, there&#8217;s a good chance the single person who&#8217;s idea it is is potentially listening.</p>
<h3><strong>Wrapping up</strong></h3>
<p>This is just a snapshot of the day, and doesn&#8217;t quite sum up how inspiring the whole day actually was. From <a title="Ashley on Twitter" href="http://twitter.com/iamashley">Ashley Baxter</a>&#8216;s debut talk about how she took over her dad&#8217;s insurance company at 18, and is now taking it down the software/service route, to the brilliant <a title="Noah on Twitter" href="http://twitter.com/motherfuton">Noah Stokes</a> talking about his journey as a designer, and the lessons he&#8217;s learnt along the way, it was a great day, without one flawed speaker. Special mention also goes to <a title="Jeremy on Twitter" href="http://twitter.com/adactio">Jeremy Keith</a>, who jumped in only a few days before to cover John Allsopp&#8217;s session. As always, Jeremy delivered a session with wit, flair and general awesomeness that few others match. Aside from the talks, it&#8217;s always lovely to visit Newcastle and talk to the folks who are building such an awesome web scene for the North East. A huge thanks to Gavin for having us at Industry.</p>
<p>As promised, here are the two sketchnotes I managed to pull together on the day:</p>
<div style="text-align: center;"><a href="http://www.ubelly.com/wp-content/uploads/2013/05/industrysketches-1.jpg"><img style="border: 7px solid #efefef; margin-right: 10px;" title="Industry Sketchnotes - Rachel Andrew" src="http://www.ubelly.com/wp-content/uploads/2013/05/industrysketches-1-300x293.jpg" alt="" height="300" /> </a><a href="http://www.ubelly.com/wp-content/uploads/2013/05/industrysketches-2.jpg"><img style="border: 7px solid #efefef;" title="Industry Sketchnotes - Christopher Murphy" src="http://www.ubelly.com/wp-content/uploads/2013/05/industrysketches-2-209x300.jpg" alt="" width="209" height="300" /></a></div>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/zaQwI7zPcpo" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/supporting-educating-and-designing-at-industry-conf/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/supporting-educating-and-designing-at-industry-conf/</feedburner:origLink></item>
		<item>
		<title>Intelligent machines – how far will we take it?</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/JzmpyQFdLZ8/</link>
		<comments>http://www.ubelly.com/2013/05/intelligent-machines-how-far-will-we-take-it/#comments</comments>
		<pubDate>Mon, 13 May 2013 13:15:01 +0000</pubDate>
		<dc:creator>paulfo</dc:creator>
				<category><![CDATA[Geek Love]]></category>
		<category><![CDATA[Hexapod]]></category>
		<category><![CDATA[robot development]]></category>
		<category><![CDATA[robotics]]></category>
		<category><![CDATA[robots]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18395</guid>
		<description><![CDATA[<div><img width="312" height="234" src="http://www.ubelly.com/wp-content/uploads/2013/05/MSR-H01_Wake_Red_Pan_ISO_s_featured.jpg" class="attachment-type-photo wp-post-image" alt="MSR-H01_Wake_Red_Pan_ISO_s_featured" title="MSR-H01_Wake_Red_Pan_ISO_s_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/MSR-H01_Wake_Red_Pan_ISO_s_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="MSR-H01_Wake_Red_Pan_ISO_s_featured" title="MSR-H01_Wake_Red_Pan_ISO_s_featured" style="float:left; margin:0 15px 15px 0;" />Matt Denton’s job is a job we wished we could all do! Matt builds solutions for movie special effects but  <a href="http://www.ubelly.com/2013/05/intelligent-machines-how-far-will-we-take-it/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="234" src="http://www.ubelly.com/wp-content/uploads/2013/05/MSR-H01_Wake_Red_Pan_ISO_s_featured.jpg" class="attachment-type-photo wp-post-image" alt="MSR-H01_Wake_Red_Pan_ISO_s_featured" title="MSR-H01_Wake_Red_Pan_ISO_s_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/MSR-H01_Wake_Red_Pan_ISO_s_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="MSR-H01_Wake_Red_Pan_ISO_s_featured" title="MSR-H01_Wake_Red_Pan_ISO_s_featured" style="float:left; margin:0 15px 15px 0;" /><p><img style="margin: 0px 10px 0px 0px; border: 0px currentcolor; float: left; display: inline; background-image: none;" src="http://m.c.lnkd.licdn.com/media/p/3/000/0e6/3f0/28b3380.jpg" alt="" width="150" height="150" align="left" border="0" /></p>
<p><a href="http://www.linkedin.com/profile/view?id=100256017&amp;authType=NAME_SEARCH&amp;authToken=ZAyp&amp;locale=en_US&amp;srchid=f5445296-116a-4e87-b761-4cd4860bcb9a-0&amp;srchindex=1&amp;srchtotal=1&amp;goback=%2Efps_PBCK_matt+denton+micromagic+systems_*1_*1_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link">Matt Denton</a>’s job is a job we wished we could all do! Matt builds solutions for movie special effects but not just software CGI, Matt builds animatronics too.</p>
<p>With an education in electronics and an apprenticeship with Marconi, Matt dropped out of University when he got the opportunity to join a small special effects company. Finding his niche adding the electronics to models made by the company, Matt soon established his own network of movie contacts and created Micro Magic Systems (<a href="http://www.MicroMagicSystems.com">http://www.MicroMagicSystems.com</a>) in 1999, ‘to supply animatronic, robotic and puppet control systems and services to the film and television industry’.</p>
<p>Matt now offers a number of solutions, both hardware and software, which ‘have played pivotal roles in award-wining productions’, including the Harry Potter series and music videos (Massive Attack) to commercials (Lloyds TSB).</p>
<p>Matt uses a wide range of operating systems to implement his solutions with C. From DOS based systems that ‘just keep running’, to Windows CE embedded, Linux and PIC microprocessors. As most of Matt’s electronics work usually results in custom built circuit boards, he works below the hobbyist module world of Arduino and Raspberry Pi.</p>
<p>He also has a nomadic approach to projects. To keep costs low, Micro Magic Systems doesn’t have a permanent workshop. As projects can be located anywhere in the world, Matt assembles a workshop and a team dynamically, with the skills, tools and location required per project. He does have a trailer based fabrication workshop which includes a high quality CNC device, that can be hired out to movie locations as required.</p>
<p>I first linked up with Matt when my own interest in robotics led me to his Hexapod implementation – which is available in kit form (<a href="http://www.hexapodrobot.com/store/">http://www.hexapodrobot.com/store/</a>). The Hexapod is beautifully made, and can be driven using Matt’s custom HexEngine servo control board &#8211; allowing higher level direction control of the hexapod with simple movement commands such as forward and turn instructions from a control machine. The smooth, life like movement of the hexapod has landed it several movie roles where it is usually dressed in an appropriately creepy crawly disguise.</p>
<p style="text-align: center;"><a href="http://www.ubelly.com/?attachment_id=18397" rel="attachment wp-att-18397"><img class="size-full wp-image-18397 aligncenter" title="MSR-H01_Wake_Red_Pan_ISO_s" src="http://www.ubelly.com/wp-content/uploads/2013/05/MSR-H01_Wake_Red_Pan_ISO_s.jpg" alt="" width="640" height="480" /></a></p>
<p>I recently had the opportunity to catch up with Matt on his latest creation; the biggest, all-terrain operational hexapod robot in the world, called the Mantis (<a href="http://www.MantisRobot.com">http://www.MantisRobot.com</a>). Conceived in 2007, the Mantis has taken several years to make its first debut at the 2012 Bestival UK.</p>
<p>Mantis is colossal, weighing in at nearly 2 tonnes, with a 5 metre diameter in a neutral standing position. Each leg weighs 130kg, and there is a sizable 2.2ltr Perkins diesel engine on the back to drive the hydraulic system. The Mantis hydraulics’ require 165 bar @ 150 litres per minute maximum to move the legs.</p>
<p>This is a big machine, with a suitably impressive computer control system. The key driving system is a Linux PC running a port of Matt’s HexEngine (developed from his small hexapod solution). This communicates to the drive and feedback systems via a CAN bus to two operator control units, the engine control unit (dsPIC), a hydraulic control unit and 6 actuator PID control and feedback units (dsPIC). This is all presented back to the driver under the control of a Grayhill touch panel PC running Windows CE. In addition, there are more feedback sensors and a lighting system.</p>
<p><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="OI2" src="http://www.ubelly.com/wp-content/uploads/2013/05/OI2_thumb.png" alt="OI2" width="446" height="309" border="0" /></p>
<p>The Mantis can currently move at a sedate 1mph, although software simulation shows 4.5mph is possible. When you have six, 130kg legs moving under hydraulic control a cautious approach is best. There is still plenty of fine tuning to do which can improve the Mantis performance.</p>
<p>An initial design goal was to have each leg weigh less than 100kg. However, this wasn’t achievable with the hydraulic RAMs available and affordable at the time. Each leg is made from steel; the team now believe that with greater understanding of the stresses and a better structural analysis, the legs could now be made in aluminium. They have also discovered better hydraulic RAMs with built in encoders. Although these were initially thought to expensive, the team found adding external encoders to standard RAMs proved time consuming and added weight to each leg.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/OI3.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="OI3" src="http://www.ubelly.com/wp-content/uploads/2013/05/OI3_thumb.png" alt="OI3" width="441" height="305" border="0" /></a></p>
<p>Hydraulics of this size was a new area for Matt and his team. Lots of initial trade-offs were made in initial design and purchasing decisions, taking advantage of easily available parts rather than researching more technically challenging solutions. Now with the benefit of the build experience, some of these decisions would be done differently.</p>
<p>The Mantis project has generated an interesting range of opportunities for Matt beyond the normal movie effects; the most notable from a manufacturer of underwater mining machines, who see the potential in the hexapod design to secure a stronger hold on the sea floor. The Mantis is now available for private hire, custom commissions, events and sponsorship.</p>
<p style="text-align: center;"><a href="http://www.ubelly.com/wp-content/uploads/2013/05/OI1.png"><img class="aligncenter" style="border: 0px;" title="OI1" src="http://www.ubelly.com/wp-content/uploads/2013/05/OI1_thumb.png" alt="OI1" width="455" height="315" border="0" /></a></p>
<p>Matt has a fairly unique job, but there is commonality with our roles as software programmers, and as such we can learn from Matt. Matt has the self-belief to take on new tasks which require learning new skills and new technologies; his prepared to explore the edge of the envelope, the untested and the all new idea. And his has that designer’s eye to deliver a quality of implementation which makes all his creations extra special.</p>
<p><a href="http://research.microsoft.com/en-us/projects/gadgeteer/default.aspx">Find out more about .NET Gadgeteer</a></p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/JzmpyQFdLZ8" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/intelligent-machines-how-far-will-we-take-it/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/intelligent-machines-how-far-will-we-take-it/</feedburner:origLink></item>
		<item>
		<title>NFC and Voice Activation in Domino’s Windows Phone 8 app</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/H7E9c4wm69A/</link>
		<comments>http://www.ubelly.com/2013/05/nfc-and-voice-activation-in-dominos-windows-phone-8-app/#comments</comments>
		<pubDate>Mon, 13 May 2013 11:30:37 +0000</pubDate>
		<dc:creator>Sara Allison</dc:creator>
				<category><![CDATA[Mobile]]></category>
		<category><![CDATA[nfc]]></category>
		<category><![CDATA[voice activation]]></category>
		<category><![CDATA[Windows Phone 8]]></category>
		<category><![CDATA[windows phone 8 development]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18335</guid>
		<description><![CDATA[<div><img width="312" height="173" src="http://www.ubelly.com/wp-content/uploads/2013/05/Dominos_featured.png" class="attachment-type-photo wp-post-image" alt="Dominos_featured" title="Dominos_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/Dominos_featured-100x100.png" class="attachment-thumbnail wp-post-image" alt="Dominos_featured" title="Dominos_featured" style="float:left; margin:0 15px 15px 0;" />You’re tired, hungry and can’t be bothered to cook. What if you could pick up your phone and ask it  <a href="http://www.ubelly.com/2013/05/nfc-and-voice-activation-in-dominos-windows-phone-8-app/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="173" src="http://www.ubelly.com/wp-content/uploads/2013/05/Dominos_featured.png" class="attachment-type-photo wp-post-image" alt="Dominos_featured" title="Dominos_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/Dominos_featured-100x100.png" class="attachment-thumbnail wp-post-image" alt="Dominos_featured" title="Dominos_featured" style="float:left; margin:0 15px 15px 0;" /><p>You’re tired, hungry and can’t be bothered to cook. What if you could pick up your phone and ask it to order you your favourite pizza for delivery without you even having to make a call? Sounds good? Here’s the full story from the team at <a href="http://www.futureplatforms.com/">Future Platforms</a> who built the <a href="http://www.windowsphone.com/en-gb/store/app/domino-pizza/cf0a19e6-f246-497a-a0a4-b48aa957aa5e">Domino’s Pizza app for Windows Phone</a>…</p>
<p>“In 2012 Domino’s Pizza added Windows Phone to its range of m-commerce platforms available to their customers, with a Windows Phone 7 app we built for them. The app’s successful development was so popular with Domino’s that it became a prototype for the company’s mobile work going forward.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image004.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="clip_image004" src="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image004_thumb.png" alt="clip_image004" width="264" height="430" border="0" /></a></p>
<p>So in January 2013 we began work on a <a href="http://www.microsoft.com/click/services/Redirect2.ashx?CR_CC=200206182&amp;CR_EAC=300090994">Windows Phone 8</a> version for them, looking to make the most of the platform’s advantages. We wanted to not only create a ‘Domino’s store in your pocket’, or even an e-commerce store in your pocket, but to take advantage of the new <a href="http://msdn.microsoft.com/en-us/library/windowsphone/develop/jj206940(v=vs.105).aspx">Windows Phone functionality available on WP8</a>. For example, the menu is rendered within the <a href="http://msdn.microsoft.com/en-us/library/windowsphone/develop/ff941109(v=vs.105).aspx">Windows Phone panoramic interface</a>, <a href="http://msdn.microsoft.com/en-US/library/windowsphone/develop/hh202948(v=vs.105).aspx">live tile</a> notifications notify users of the latest meal deals on offer in their nearest store, <a href="http://msdn.microsoft.com/en-us/library/windowsphone/develop/jj207060(v=vs.105).aspx">NFC tags</a> are activated and <a href="http://msdn.microsoft.com/en-us/library/windowsphone/develop/jj206958(v=vs.105).aspx">voice recognition technology</a>can activate the app with commands such as ‘Domino’s, feed me’ or ‘Domino’s, I’m hungry’.</p>
<p>“I just sat there staring at the tracker until I heard a knock…I STILL LOVE IT” Jetfire</p>
<p>“The easiest and best way I’ve ever ordered pizza.  Thanks Domino’s I’m no longer hungry.” Christopher</p>
<p>“Great app! Couldn’t ask for anything better.  Absolutely the best way for ordering Domino’s” Marco</p>
<p>“Awesome, works flawlessly. I use it all the time now when ordering a home delivery. Great app, a must have for all Dominos Pizza Windows Phone fans.” Phillip</p>
<p>“Excellent, slick UI makes the whole process simple and user friendly.” Aidan</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image006.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="clip_image006" src="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image006_thumb.png" alt="clip_image006" width="270" height="444" border="0" /></a></p>
<p><a href="http://www.linkedin.com/pub/alex-vitty/0/870/549">Alex Vitty</a>, Head of UX, explained the process for designing the user journey; “We tried to keep the design as simple as possible in order for the products to take centre stage. We incorporated the Windows Phone 8 modern UI principles and overlaid the new Domino’s branding. We started the process by mapping out the key journeys from the website and simplified them as much as possible. We combined the journey for order a menu pizza with customizing a pizza which made the whole pizza ordering process much more intuitive.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image010.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="clip_image010" src="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image010_thumb.png" alt="clip_image010" width="247" height="412" border="0" /></a></p>
<p>Once Domino’s had decided to use the NFC and voice activation features we had to define how they would provide most benefit to the users. We reviewed the user journey to establish where they would provide shortcuts to the already streamlined process. This took quite a few iterations before we came to a solution which is both beneficial to the user and shows off the features.</p>
<p>Developers <a href="http://www.linkedin.com/profile/view?id=168114807&amp;authType=NAME_SEARCH&amp;authToken=Y8jk&amp;locale=en_US&amp;srchid=7cf5d557-f61a-4867-b301-266a6f048de3-0&amp;srchindex=1&amp;srchtotal=1&amp;goback=%2Efps_PBCK_Kader+Kawsar_*1_*1_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link">Kader Kawsar</a> and Martin Chandler have a wide range of web development skills, but used C# and Java converted to JavaScript using GWT to run on <a href="https://github.com/KirinJS/Kirin">Kirin</a>: “The app incorporates some innovative Windows Phone functionality such as voice activation and NFC, which required a bit more work. We wanted every feature to add to the app’s usability, rather than just be a gimmick, so we worked a lot on making sure the VA commands do exactly what users want.</p>
<p>The main development tools used were Visual Studio 2012 and Eclipse. VS2012 provides the development tools for coding and designing the interface as well as the tools for unit testing your code. Eclipse provided the development environment for the Java components and JavaScript components of the application. GIT was used as the source control platform for the application code along with GIT Extensions on Windows as a UI to the GIT repository. We used JIRA to manage the sprints and story cards for the application and provide the general burn down etc. for the development.</p>
<p>We built the Domino’s WP8 app using <a href="https://github.com/KirinJS/Kirin">Kirin</a>, which is all about ingenious and efficient cross-platform development for us. Kirin gives us the option to migrate and develop the mobile app functionality onto another platform very easily. This means that Domino’s can move quickly and resourcefully onto emerging mobile platforms in the future, keeping their customers happy and their name synonymous with digital innovation. On this app Kirin made our lives easier because its back end business logic is built generically for cross-platform support.</p>
<p>Windows phone emulator was mainly used for testing during development. The emulator was very good in simulating the features being developed and was very responsive and fast. Real phones were used for key features such as NFC and Voice Activation as well as being used by the test team. Developing with Windows Phone is a totally different experience than, for example, trying to build Java ME apps on the Windows Mobile device in the past, which to be honest was not pleasant. The Windows Phone development environment has a much better IDE and method of development. Setting started with developing the Windows phone apps is very easy with freely available tutorials, samples and tools. However, learning of the concept of Model-View-ViewModel (MVVM) pattern is required for better understanding of the Windows phone development. The MVVM is not a very difficult pattern to grasp. Visual Studio 2012 worked extremely well with Blend, which helped creation of the user interface with ease. Starting up app from scratch with Windows phone is very quick. However, this was sometime a drawback because Visual Studio generated code where were not required, which was acceptable from a generic tool.</p>
<p>Implementation of the voice commands was easy with the Voice Command Definition File. However, getting the phone to behave as required with the voice commands were particularly challenging because some voice commands behaved differently between the phone device and the emulator.  This was probably due the hardware differences.  Since the app was to be used on the mobile devices therefore the final development was carried out on the device, whereby the commands were arranged in certain order for them to be recognised, in order to overcome the difference in development environments.</p>
<p>Voice activation itself is straight forward to implement and the technology examples and documentation provide reasonable information on the process for supporting voice activation. Testing was quite funny to see as various members of the team shouted various commands at their phones &#8211; I’m not sure I could emulate an Irish accent myself though!</p>
<p>As part of the implementation we wanted to provide the capability to dive into the application with deep linking too so commands such as “Dominos give me a deal” could be implemented in the future to take the customer directly to current deals for example. This aspect provides the app with a fun feel for the user and hopefully makes them feel happy when they use this feature to interact with the application and their device.</p>
<p>As a relatively new technology the implications of what can be achieved with NFC are not fully realised at present. There are two primary ways in which the technology can assist the user and in the Dominos application we have both approaches in play; firstly as an embedded tag scan which allows the user to scan a tag at a specific point in time &#8211; when they’re on the voucher view. Secondly, as an application launch tag which can be used to launch the application – in this case to save a voucher for use later or to take the user to a meal deal. There is a lot of potential for this capability so the features provided by the application may be expanded in the future. Being able to save multiple types of voucher to save money on orders or perhaps being able to drop products into the basket by simply scanning a menu demonstrate how the technology can assist with the users experience of building and placing an order – making it easier.</p>
<p>The implementation itself relies on the same deep linking capabilities mentioned earlier. As with the voice activation features good information exists to assist with the code required to implement the NFC features. The bigger challenge is thinking about how the feature can aid the user and how to make that relevant and if possible fun for the user.</p>
<p>In order to develop and test this feature we needed two extra components that don’t currently come out of the box with Visual Studio or the emulator. The first is the tags themselves as the emulator doesn’t appear to provide any capabilities for mocking an NFC event so you need some real tags to test with. The second component is being able to write the information we desire to the tags. Some third party tools are available for this but we found the example tag writers provided on the MSDN better for our purposes.</p>
<p>Each time we demonstrated the apps NFC features they were received very well and our tags left with the audience and copies of the app!! It’ll be great to see some posters or menus that use these features.</p>
<p>Our strategy with Domino’s mobile products is for them to integrate seamlessly into a multichannel ordering process, so our Windows Phone 8 app does everything their e-commerce site does, such as ability to log in to the same account online or on the app, personalized information for returning customers, shopping baskets and a ‘Pizza Tracker’ to make sure their customers are getting a consistently great Domino’s experience no matter what platform they’re using.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image008.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="clip_image008" src="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image008_thumb.png" alt="clip_image008" width="246" height="410" border="0" /></a></p>
<p>When you’re building apps across platforms, from the developer&#8217;s perspective, separation of concern is vital for developing cross platform apps whereby the business logic could reside within the Kirin JavaScript code and the user interface code could reside with native device code. Intuitive and user friendly interface as well as performance of the apps are important too.</p>
<p>The UI needs to be consistent through-out so the user is always sure and comfortable with the choices available to them and what they can do to interact with the application and achieve their desired objectives. XAML provides great support for UI consistency with templates and styles that allow for re-use. These assets can also be re-used on other Windows platforms too.</p>
<p>Consider how the interesting technologies provided by the platform can assist your user with how they interact with your app; to make tasks quicker and easier or to make tasks more fun and interesting. “Shake me” to add some sides might be a useful short cut in the application but it might also frustrate the user if it happens in error so don’t use a technology feature just because it’s there.</p>
<p>If it can’t be slick then make it easy; in some places you may need to collect a reasonable amount of information from the user so try to make it as painless as possible.</p>
<p>As with any application the internal architecture of the application itself is important so the application remains responsive every time the user performs a task. Consider your deep linking functionality upfront as this will also help to keep your implementation cleaner and more focused. Async, async, async – make sure everything that can be performed in the background is performed in the background.</p>
<p>Tools for me have been a key feature of the Microsoft technology stack. Visual Studio is slick and efficient and provides just about everything you could think of for developing just about any type of application you could imagine. For business applications the ability to develop secure and scalable back-office applications with front-office components built in the one technology and then deploy those features to users through a range of different devices from Phone and Xbox to tablets, laptops and desktops – it represents a very unified corporate world. The tools help make the Windows development process more fun than building Android or iOS although the tools for these have both improved massively in the last couple of years.</p>
<p>&nbsp;</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image002.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="clip_image002" src="http://www.ubelly.com/wp-content/uploads/2013/05/clip_image002_thumb.png" alt="clip_image002" width="241" height="401" border="0" /></a></p>
<p>If you’re still undecided whether to start building for Windows Phone all I can say is get involved. Currently Windows Phone has a smaller market share than other platforms but that’s also a great opportunity to get your app recognised on the platform early. The devices running Windows Phone 8 have been improving too so they really can compete against the phones that run other platforms. With the added benefits of the Windows desktop market and the Xbox gaming platform your app can reach a very wide and diverse audience not being restricted to just the phone and tablet. That said the tablet themed devices such as Surface Pro that can run a full Windows 8 desktop are starting to appear so we now have a tablet that can do more than play games, surf the internet or read email.</p>
<p>I can imagine it won’t be too long before I can order a pizza directly from my Xbox, flick through the menu by gesturing at the Kinect and then back to my movie!”</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/H7E9c4wm69A" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/nfc-and-voice-activation-in-dominos-windows-phone-8-app/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/nfc-and-voice-activation-in-dominos-windows-phone-8-app/</feedburner:origLink></item>
		<item>
		<title>Capture kung fu on a touchscreen with Buddha Finger</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/eu-DLwUdKDo/</link>
		<comments>http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/#comments</comments>
		<pubDate>Mon, 13 May 2013 09:02:47 +0000</pubDate>
		<dc:creator>Tom</dc:creator>
				<category><![CDATA[Games]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18370</guid>
		<description><![CDATA[<div><img width="300" height="300" src="http://www.ubelly.com/wp-content/uploads/2013/05/BFIcon-300x300.png" class="attachment-type-photo wp-post-image" alt="BFIcon-300x300" title="BFIcon-300x300" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/BFIcon-300x300-100x100.png" class="attachment-thumbnail wp-post-image" alt="BFIcon-300x300" title="BFIcon-300x300" style="float:left; margin:0 15px 15px 0;" />For the majority of us, cheesy kung fu movies are something we grew up with and if we&#8217;re honest still  <a href="http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="300" height="300" src="http://www.ubelly.com/wp-content/uploads/2013/05/BFIcon-300x300.png" class="attachment-type-photo wp-post-image" alt="BFIcon-300x300" title="BFIcon-300x300" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/BFIcon-300x300-100x100.png" class="attachment-thumbnail wp-post-image" alt="BFIcon-300x300" title="BFIcon-300x300" style="float:left; margin:0 15px 15px 0;" /><p><a href="http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/annamarsh_700x540/" rel="attachment wp-att-18371"><img class="size-medium wp-image-18371 alignleft" title="AnnaMarsh_700X540" src="http://www.ubelly.com/wp-content/uploads/2013/05/AnnaMarsh_700X540-231x300.jpg" alt="" width="231" height="300" /></a>For the majority of us, cheesy kung fu movies are something we grew up with and if we&#8217;re honest still hold a secret passion for. That&#8217;s why we were so excited to interview the studio behind<a href="http://www.windowsphone.com/en-gb/store/app/buddha-finger/ee23dd1e-2c75-4e2e-9342-81e7b9c70d9f"> Buddha Finger</a>, which has really captured that 1980&#8242;s feeling while also providing fast, exciting game play. We chatted with <a href="http://www.linkedin.com/pub/anna-marsh/2a/994/a91">Anna Marsh</a>, the Design Director at <a href="http://www.ladyshotgun.com/">Lady Shotgun</a> studios to find out a little more about the project.</p>
<p><strong>What, in your opinion, is unique about Lady Shotgun as an indie game studio?</strong></p>
<p>I started Lady Shotgun initially because I&#8217;d become a mother, and I wanted to work flexible hours and cut the commute out.  My friends Sarah &#8211; who I&#8217;d worked with at Eidos &#8211; and Gaby &#8211; who I knew as our children went to the same creche &#8211; were both in similar situations.  That was the catalyst, the three of us wanted to create something together around our childcare requirements.  So that&#8217;s pretty unique, a studio started by three mums <img src='http://www.ubelly.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />   For Buddha Finger we all worked from our own homes and although the company has outgrown my home now and needs to move to an office space, I&#8217;m really keen to allow our team members who prefer to work from home do so.  Commuting can be such a massive waste of time and energy in my opinion and when people can work their favoured hours rather than being forced into office hours I find they&#8217;re far more productive. So that aspect means that we can employ a far more diverse range of developers than many studios, indie or otherwise.</p>
<p><strong>What is the inspiration behind Buddha Finger?</strong></p>
<p>I wanted to design a game that really used the touchscreen interface in an immediate way, I like designing what the game is going to feel like first so I was searching for something that would feel great with a touchscreen.  I was watching Kung Fu Panda with my daughter and the part where the old wise tortoise Oogway beats the powerful tiger Tai Lung, I realised that the touchscreen would be the perfect way to capture the feel of that mystical kung fu pressure point attack. The mechanics were inspired by<a href="http://en.wikipedia.org/wiki/Elite_Beat_Agents"> Elite Beat Agents</a> &#8211; press the points in numerical order &#8211; but instead of it being based on rhythm, it&#8217;s based on how fast you go. That introduces an element of risk/reward, the faster you go, the higher your score, but the more likely it is you will make a mistake.</p>
<p><strong>How did you settle on the final design and style of the game?</strong></p>
<p>I adore kung fu films and those cheesy 1980s action movies with Jean Claude Van Damme, Steven Segal,  and that seemed to suit the idea of the mystical kung fu style well, so we based our aesthetic and narrative on this idea.  I had a lot of fun looking through reference stuff with <a href="http://www.linkedin.com/in/gabrielapavan">Gabriela Pavan</a>, the lead artist, and picking out actors and poses to base the characters on, and coming up with ideas for locations and story with writer <a href="https://twitter.com/haikus_by_KN">Katharine Neil</a> (whos a great indie developer in her own right!) inspired by these films.  Katharine did a lot of watching these kinds of movies for research too! She called it a Van Dammathon <img src='http://www.ubelly.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p><a href="http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/scene_g4/" rel="attachment wp-att-18379"><img class="alignnone  wp-image-18379" title="scene_G4" src="http://www.ubelly.com/wp-content/uploads/2013/05/scene_G4.jpg" alt="" width="630" height="286" /></a></p>
<p><strong>What’s your process for designing the user experience / journey?</strong></p>
<p>I have quite a particular way of working actually &#8211; if I can&#8217;t fully visualise the fundamental, &#8220;second to second&#8221; gameplay I find it impossible to do anything.  So I spend some time holed up on my own working that out on paper, then when I understand it, I can start talking to the rest of the team and feedback.  For Buddha Finger after I&#8217;d worked out the gameplay, I made a flow chart with all the skills we need to introduce to the player, and roughly the number of levels we were aiming for, then I sit down with the story writer, Katharine, and we started to spin out ideas for. Gaby had already designed many of the bosses, so looking at them and coming up with who they were and the locations they could appear in gave us the skeleton of the story, and we fleshed dout using our &#8220;kung fu/cheesy 1980&#8242;s action film&#8221; reference. And finally, I then tried to ramp up the difficulty throughout the game, and use some special levels with different &#8220;enemies&#8221; &#8211; like, a woman in labour, you help her give birth with the power of you kung fu technique! &#8211; to mix things up a bit.</p>
<p><a href="http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/ladysg_buddhafinger5/" rel="attachment wp-att-18374"><img class=" wp-image-18374 alignleft" title="LadySG_BuddhaFinger5" src="http://www.ubelly.com/wp-content/uploads/2013/05/LadySG_BuddhaFinger5-429x644.jpg" alt="" width="300" height="451" /></a></p>
<p><strong>What do you think the biggest challenges are in designing for touch screens compared to traditional inputs?</strong></p>
<p>I much prefer designing for touch screens now actually! I think they&#8217;re more immediate and intimate than traditional controllers, the player is directly in touch with the game. The big change is I think that with a controller, most of your actions are relative to a player character &#8211; jump, punch, shoot, whatever.  With a touchscreen, the actions become more relative to the whole screen &#8211; so, if I want my character to move forwards I tap somewhere in the environment  for them to move to, rather than push the character forwards.</p>
<p>With Buddha Finger I designed something that just wouldn&#8217;t work with a traditional controller because I wanted to use that interface in an immediate way, it translates a real world action of pressing points with your fingers to pressing those points on a screen, its quite a direct translation of the real world to the game world which is why I think it works.  I wanted to make players feel like &#8220;finger ninjas&#8221;, so I spent a lot of time setting up the positions of the points and the time pacing between them, so that the player&#8217;s hand movements would become something reminisent of classic kung fu film choerography.</p>
<p><strong>What is unique about the Windows/Windows Phone versions of the game?</strong></p>
<p>So far we&#8217;ve released only on iOS before, which we did simply because we had the most experience on this platform. For Windows we have altered some of the text and images to the age rating below 12+ , we&#8217;re on track to add an &#8220;easy mode&#8221; very soon to make it easy enough to play for younger players.  We&#8217;ve also added some improvements to the UI &#8211; the direction of the spiral points is much clearer for example.  And, we&#8217;ve included a trial mode &#8211; which is made very easy on Windows because there&#8217;s no necessity to add IAP to do it.  That i&#8217;m very pleased by &#8211; letting players try before they buy is really key to showing the game off.  For Windows 8 we&#8217;ve also included mouse and keyboard controls and a landscape screen mode.</p>
<p><strong>What is the most important lesson you learned while developing Buddha Finger?</strong></p>
<p>Patience <img src='http://www.ubelly.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />   You have to take it as it comes as an indendent developer &#8211; you simply don&#8217;t have the resources to brute force things through if they&#8217;re not happening naturally.  Coming from console development, it can be difficult at first but you soon learn to keep a variety of stuff to do on the task list so if, for example, your audio person has to take a paying freelance job to pay their rent or whatever in the middle of implementing sound, you switch to doing some PR stuff for a while. that way you keep things rolling around obstacles.</p>
<p><a href="http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/bfw8_land2/" rel="attachment wp-att-18373"><img class="alignnone  wp-image-18373" title="BFW8_Land2" src="http://www.ubelly.com/wp-content/uploads/2013/05/BFW8_Land2-644x362.png" alt="" width="580" height="326" /></a></p>
<p><strong>With each of the founding managers working in different countries, how does that affect your development process and what tools do you use to collaborate?</strong></p>
<p>The whole team for Buddha Finger worked from their own homes, and we were pretty scattered! The only way we can do this is by being very organised, I did a load of preproduction right at the start of development that allowed us to break the game up into chunks and assign to the different team members.  We used Team Lab and Assembla to co-ordinate tasks, and I&#8217;ve used Jira with <a href="http://www.lemonmoosegames.com/">Lemon Moose</a> who have helped out with the ports.  Keeping everything in one place using one of these tools this helps a lot, it can be very difficult to find informaiton in emails after just a few weeks working on a project.</p>
<p><strong>How do you build your games to work across a range of platforms?</strong></p>
<p>Well we originally started off as iOS native, using Coco&#8217;s 2D, simply because it was the platform the team had the most experience in and this was the fastest.  In future we&#8217;re looking to use a cross platform engine from the get go though.  We have partially used Marmalade for the ports but almost all the<a href="http://www.microsoft.com/click/services/Redirect2.ashx?CR_CC=200206182&amp;CR_EAC=300090995"> Windows</a> version is Lemon Moose&#8217;s own game engine.</p>
<p>One decision that really worked was to make the game as data driven as possible. That basically means that the code provides the framework to the game, but almost all the content &#8211; which enemies are in what levels, how the levels and cutscenes link together, where the points appear on each enemy and the scores the player will ge from pressing them &#8211; is kept in XML data files.  It keeps the code as mimimal and clean as possible and lets the coders concentrate on code, whilst I concentrate on making the game fun to play.  Its meant that Lemon Moose have been able to put together the ports reletively swiftly.</p>
<p><strong>What advice would you give anyone working across platforms to make sure they stay true to the ethos of the OS, brand guidelines etc?</strong></p>
<p>Using a cross platform engine helps a lot with technical issues. There are downsides, of course, but for our next projects we&#8217;ll do cross platform from the get go.  Doing submissions accross mulitple app stores can take up a lot of time so make sure you have a team memeber who&#8217;s prepared and has the time devoted to do the submissions.  There can be a big difference in how age ratings are treated between platforms for example, and screenshots must be correct proportions for each platform.</p>
<p>There are some noticable &#8220;brand&#8221; differences between the platforms in terms of content &#8211; a quick evaluation, I would say:  Apple seem to be focus on games with high production values &#8211; a strong, beautiful aesthetic is important. Windows is very family orientated and like games parents and children can play together, and particularly Windows 8 is very hot on age ratings.  BlackBerry are keen on social aspects like leaderboards being implemented. Android I admit looks like a bit of a free for all right now!</p>
<p>I suppose the key thing is to make a great game that looks good and then you&#8217;ll improve your chances on all platforms.  After that, you need to either focus on one platform at a time for your submissions, or make sure you do a lot of prep work on all platforms to make sure you&#8217;re ready to submit on all of the simultaneously.</p>
<p><strong>What drew you to the Windows 8 and Windows Phone platforms for the game title?</strong></p>
<p>I was showing Buddha Finger with Katharine at the Eurogamer Expo and a former colleague of mine who now works for Microsoft passed by and played the iOS version. He loved it, and passed our details to the Phone team and when I got in touch with the team they were so very enthusiastic and supportive that it swayed my decision to make the first port to Windows.</p>
<p><strong>What has been the experience in developing for the platforms?</strong></p>
<p>Excellent! Granted, we&#8217;ve had a few hiccups in the submission process which seems just due to the newness of the platforms, but there&#8217;s excellent access to support from Microsoft.  As well as the awesome tech evangelist we&#8217;ve been working with the online support is great, you can get tech support via instant chat system which is very helpful.</p>
<p><strong>What’s next for Lady Shotgun?</strong></p>
<p>We&#8217;ve got few projects potentially in the pipeline, we&#8217;ve got as far as a couple of basic prototypes and some very sweet concept art!  One is a FPS with intuitive touch screen controls, and the other something for older tablet owners. I&#8217;m very excitied by the possibilities but to be honest I wont&#8217;t get time to really concentrate on anything properly until I&#8217;ve done a few more weeks of PR-y stuff for the Windows Buddha Finger.  One of the things about being indie which is simultaneously great and hard is that I do so many different jobs, I&#8217;m designer, project manager, PR, QA, production and art intern, business development&#8230;. I&#8217;m the only full time member of Lady Shotgun so it can get crazy! But, it can also take me in really fun and interesting directions so for the time being at least, I&#8217;m enjoying going with the flow!</p>
<p>Ready to build your game? That’s great, register today for a <a href="http://www.microsoft.com/click/services/Redirect2.ashx?CR_CC=200206182&amp;CR_EAC=300090997">Windows Store account</a>, download the <a href="http://www.microsoft.com/click/services/Redirect2.ashx?">Windows 8 SDK</a> and you’ll be flying.</p>
<p>Or do you want to get something built in just 10 minutes?  Then  make sure you check out <a href="http://www.microsoft.com/click/services/Redirect2.ashx?CR_CC=200206182&amp;CR_EAC=300090985">ZipApp</a>.</p>
<p>&nbsp;</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/eu-DLwUdKDo" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/capture-kung-fu-on-a-touchscreen-with-buddha-finger/</feedburner:origLink></item>
		<item>
		<title>Soft Array: Exploring ‘Universe’ with 80 touch screens</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/UJLnqvV6x-s/</link>
		<comments>http://www.ubelly.com/2013/05/soft-array-exploring-universe-with-80-touch-screens/#comments</comments>
		<pubDate>Mon, 13 May 2013 08:00:55 +0000</pubDate>
		<dc:creator>Sara Allison</dc:creator>
				<category><![CDATA[Apps]]></category>
		<category><![CDATA[arcade]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[interconnected devices]]></category>
		<category><![CDATA[microsoft]]></category>
		<category><![CDATA[soft array]]></category>
		<category><![CDATA[windows 8]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18352</guid>
		<description><![CDATA[<div><img width="312" height="234" src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114872-1_featured.jpg" class="attachment-type-photo wp-post-image" alt="OLYMPUS DIGITAL CAMERA" title="OLYMPUS DIGITAL CAMERA" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114872-1_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="OLYMPUS DIGITAL CAMERA" title="OLYMPUS DIGITAL CAMERA" style="float:left; margin:0 15px 15px 0;" />It might resemble a spaceship command centre straight out of the latest Star Trek movie, but Soft Array is actually  <a href="http://www.ubelly.com/2013/05/soft-array-exploring-universe-with-80-touch-screens/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="234" src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114872-1_featured.jpg" class="attachment-type-photo wp-post-image" alt="OLYMPUS DIGITAL CAMERA" title="OLYMPUS DIGITAL CAMERA" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114872-1_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="OLYMPUS DIGITAL CAMERA" title="OLYMPUS DIGITAL CAMERA" style="float:left; margin:0 15px 15px 0;" /><p>It might resemble a spaceship command centre straight out of the latest Star Trek movie, but Soft Array is actually an art installation showcasing the epitome of an interconnected devices experience, with no less than 80 Windows 8 touch devices set up over multiple structures with a programmable environment &#8211; so anyone can come and play around with it, build on it and hack it.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/MVI_7531-0.00.001.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="MVI_7531-(0.00.00" src="http://www.ubelly.com/wp-content/uploads/2013/05/MVI_7531-0.00.00_thumb1.jpg" alt="MVI_7531-(0.00.00" width="513" height="289" border="0" /></a></p>
<p>Soft Array was created by design studio <a href="http://arcade.cx/">Arcade</a> for Microsoft. Arcade and Microsoft invited a number of designers and developers to build apps for Soft Array’s debut at SxSW Interactive, one of which was London based design agency, <a href="http://www.weapon7.com/">Weapon7</a>. We spoke with <span><a href="http://twitter.com/michaelnaman">Michael Naman</a>, Head of Creative Technology</span>to find out more…</p>
<p>“Universe is an app that uses distributed processing to control mass particle flow across 80 Windows 8 devices &#8211; it was part of an installation featured in Microsoft’s Windows Studio venue at SXSW Interactive. What you see on screen is a single planet with asteroids orbiting it and flying across the galaxy. There was a poll asking SXSW attendees what their preferred topic of interest is at the event, each topic is colour coded. The colour of the last vote made is represented in the planet and the asteroids orbiting it. Users can interact with the planets and influence their behaviour.</p>
<p>The chance to do something technically challenging and innovative with Windows 8 at SXSW was too irresistible to miss. It&#8217;s been fantastic to bring our front-end knowledge of web technologies to native Windows 8 applications. We wanted to use Windows 8 to show connectivity in a totally new way, engage with people and see everyone get involved. For example, as well as using the networked devices, the app uses features like live tiles Share to draw users back into the experience.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/jeremy.jpg"><img style="border-width: 0px; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="jeremy" src="http://www.ubelly.com/wp-content/uploads/2013/05/jeremy_thumb.jpg" alt="jeremy" width="470" height="353" border="0" /></a></p>
<p>We needed to show how each device was able to seamlessly communicate with each other, as Windows 8 does from smartphone to tablet to computer. The way we did that was with distributed processing. Each time an asteroid left one screen it appeared on the other. The processing for each asteroid switched from machine to machine rather than coming from a single computer and linked up to multiple screens. You could see this connectivity visually as the asteroids flew across the galaxy.</p>
<p>It also needed to have a reason for being, which is why we asked people to vote which topics they were interested in at SXSW. The more dominant a colour, the more people there that were interested in that topic.</p>
<p>The designs for Universe came from three places:</p>
<ul>
<li>Windows 8 itself, especially the colour scheme and live tiles</li>
<li>Constellations, both as they appear naturally, and as constellation maps</li>
<li>The structure (called the Soft Array) also had geometric shapes around it</li>
</ul>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/P3114880_2.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="OLYMPUS DIGITAL CAMERA" src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114880_2_thumb.jpg" alt="OLYMPUS DIGITAL CAMERA" width="470" height="265" border="0" /></a></p>
<p>The user journey was exceptionally important. It needed to be something beautiful that people could appreciate from afar, and something that people could engage with directly. So we decided to use a bold, colourful approach to its design to attract people in to engage, and if they didn’t want to do that they could still appreciate its aesthetics. Once they were at a touch device we knew people would want to move things about and make it their own in some way. So we made as many aspects as possible  interactive, so it was something you could touch and play with. We made the planets moveable, users could also change their size and affect their gravitational pull. The direction which the planets launched out asteroids could also be manipulated to create completely different shapes and pathways on the installation.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/P3114872-11.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="OLYMPUS DIGITAL CAMERA         " src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114872-1_thumb1.jpg" alt="OLYMPUS DIGITAL CAMERA         " width="465" height="349" border="0" /></a><br />
Why Windows? We ran the numbers, and the potential is incredible. We hadn’t developed on the Windows 8 platform before, so our Head of Creative Technology, Michael Namen, and his team had to learn the coding language in a matter of days. We thought it would be complicated and clunky, but it turned out to be very straightforward. Visual Studio was actually very good to work in, having never used it before. Windows 8 is really quite intuitive, and when they say it’s built for touch that basically means it does what you think it will do when you swipe etc. We were able to show high res imagery, and users were able to seamlessly come out of our app, explore Windows 8 and the other apps being showcased. We knew people might do this so our app automatically saw any device no longer on our app as ‘space’, which the asteroids could still pass through.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/P3114892.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="OLYMPUS DIGITAL CAMERA         " src="http://www.ubelly.com/wp-content/uploads/2013/05/P3114892_thumb.jpg" alt="OLYMPUS DIGITAL CAMERA         " width="453" height="340" border="0" /></a></p>
<p>We were given a number of Samsung Windows 8 development tablets from Arcade to create and test the app on. We only had two weeks to create and design the app from scratch, so testing was done as we went. We were surprised at how quickly you can build stuff, and how little there is to learn with regards to Windows 8 native development with web technologies.</p>
<p>The app was really well received at SwSW. People engaged with it as we had expected, either choosing to stand back and view it as a whole, or coming closer to play around. Because the asteroids could travel quite far we saw people moving from tablet to tablet trying to make them all follow a specific pathway, like a figure of 8 for example.</p>
<p>We’re always looking to push ourselves and explore new technology; mobile app development is a part of what we do. Building a Windows 8 app let us explore the platform for ourselves, develop new skills, and bring an idea to life. Plus the interconnectivity was interesting to concept around. We’re now actively pursuing it as an option for our clients.</p>
<p>Come and see Soft Array for yourself at <a href="http://modern.jago.co.uk">Modern Jago</a> &#8211; Microsoft’s limited time creative and collaborative space in Shoreditch &#8211; before it ships to the Cannes Lions Festival. Or, if you’d like more of an insight into what a user of Windows 8 expects from an application and examples of those expectations creatively executed, join Microsoft UX Evangelist <a href="https://twitter.com/andspo">Andrew Spooner</a> in a free workshop at Modern Jago on the 6th or 19th June. Visit www.modernjago.co.uk for more details.</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/UJLnqvV6x-s" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/soft-array-exploring-universe-with-80-touch-screens/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/soft-array-exploring-universe-with-80-touch-screens/</feedburner:origLink></item>
		<item>
		<title>The British &amp; Irish Lions official app: What does it take to design the user experience across Windows, iOS and Android?</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/YN9AW3-YP1o/</link>
		<comments>http://www.ubelly.com/2013/05/the-british-lions-app-what-does-it-take-to-design-the-user-experience-across-windows-ios-and-android/#comments</comments>
		<pubDate>Thu, 09 May 2013 14:30:41 +0000</pubDate>
		<dc:creator>Sara Allison</dc:creator>
				<category><![CDATA[Apps]]></category>
		<category><![CDATA[British Lions]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[user experience]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[windows 8]]></category>
		<category><![CDATA[windows app development]]></category>
		<category><![CDATA[windows phone]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18317</guid>
		<description><![CDATA[<div><img width="312" height="195" src="http://www.ubelly.com/wp-content/uploads/2013/05/Lions_visualstyle2_featured.jpg" class="attachment-type-photo wp-post-image" alt="Lions_visualstyle2_featured" title="Lions_visualstyle2_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/Lions_visualstyle2_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="Lions_visualstyle2_featured" title="Lions_visualstyle2_featured" style="float:left; margin:0 15px 15px 0;" />The British &#38; Irish Lions Official app was launched across the three main app platforms with no less than seven  <a href="http://www.ubelly.com/2013/05/the-british-lions-app-what-does-it-take-to-design-the-user-experience-across-windows-ios-and-android/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="195" src="http://www.ubelly.com/wp-content/uploads/2013/05/Lions_visualstyle2_featured.jpg" class="attachment-type-photo wp-post-image" alt="Lions_visualstyle2_featured" title="Lions_visualstyle2_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/Lions_visualstyle2_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="Lions_visualstyle2_featured" title="Lions_visualstyle2_featured" style="float:left; margin:0 15px 15px 0;" /><p>The <a href="http://www.lionsrugby.com/lions_official_apps.php">British &amp; Irish Lions Official app</a> was launched across the three main app platforms with no less than seven different apps (Windows Phone 7, Windows Phone 8, Windows 8, iOS for mobile and tablet, Android for mobile and tablet). Phew! <a href="http://www.linkedin.com/profile/view?id=148190497&amp;authType=NAME_SEARCH&amp;authToken=ouEj&amp;locale=en_US&amp;srchid=e384edd3-15d2-4f62-8259-699394c9b873-0&amp;srchindex=6&amp;srchtotal=15&amp;goback=%2Efps_PBCK_*1_liam_flaherty_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link">Liam Flaherty</a>, Creative Designer at <a href="http://www.sequence.co.uk/">Sequence</a> gives his take on the challenges and positives of creating an amazing experience across different platforms.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/liam-flaherty-sequence1.jpg"><img style="margin: 0px 10px 0px 0px; border: 0px currentcolor; float: left; display: inline; background-image: none;" title="liam flaherty sequence" src="http://www.ubelly.com/wp-content/uploads/2013/05/liam-flaherty-sequence_thumb.jpg" alt="liam flaherty sequence" width="135" height="135" align="left" border="0" /></a>“The British &amp; Irish Lions tour is a highly anticipated and prestigious sporting event. The free British &amp; Irish Lions Official app is available across the 3 leading operating systems, Windows, iOS and Android &#8211; both phone and tablet. The app provides in-depth tour knowledge and the perfect platform to share with the rest of the online sporting community using the #seaofred hashtag on the featured twitter feed. There will also be the ability to add your Man of the Match as the tour proceeds. We are really excited about the behind the scenes videos that will be taken by the Lions using the <a href="http://www.surface.co.uk">Microsoft Surface</a> and the <a href="http://www.nokia.com/gb-en/phones/lumia/?cid=ncomprod-fw-src-na-nokiawindowsphoneexact_0x0-newnokiamobilephone-msn-gb-en-m_nwwpnokiawindowsgeneric&amp;sissr=1">Nokia Lumia</a>. These videos will be uploaded in real time to the app, giving fans unprecedented insight into the tour. The app also provides the opportunity to enter exclusive competitions and win once in a lifetime prizes. These features provide a great deal of opportunity for exposure for the Lions in the build-up to the tour.</p>
<p>As well as massive potential for usage during the tour the app will also serve as a great repository of content for the months following where fans can go to read more about their favourite event and sport. The ‘behind the scenes’ video function of the app is a modern and digital take on the iconic &#8216;living with the lions&#8217; documentary, this will be a snapshot of history captured in a unique and utterly modern way. We‘ll all be part of a great sporting legacy. This app will provide more authentic content about the tour than any other app or website on the market. The tone is playful and fun with the content created by the squad and the fans themselves.<em> </em></p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/windows8_squad_playerpage_designs.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="windows8_squad_playerpage_designs" src="http://www.ubelly.com/wp-content/uploads/2013/05/windows8_squad_playerpage_designs_thumb.jpg" alt="windows8_squad_playerpage_designs" width="387" height="698" border="0" /></a></p>
<p align="center"><span style="font-size: xx-small;">Windows 8 Squad Playerpage Designs</span></p>
<p>To come up with the initial idea for the project we brainstormed as a team of rugby fans to work out the features that we would want to see from a British &amp; Irish Lions App. The inspiration for the design of the app came from the established heritage of the British &amp; Irish Lions as a brand. It’s a very distinctive logo and the lions wanted to maximise its effect by using the colour red throughout. The lions wanted there to be an epic feel to the design to recreate the drama of the sport. Even the content pages make reference to the original branding using hints of the Lions red, making it instantly recognisable to fans.</p>
<p align="center"><a href="http://www.ubelly.com/wp-content/uploads/2013/05/Lions_visualstyle2.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="Lions_visualstyle2" src="http://www.ubelly.com/wp-content/uploads/2013/05/Lions_visualstyle2_thumb.jpg" alt="Lions_visualstyle2" width="371" height="742" border="0" /></a></p>
<p align="center"><span style="font-size: xx-small;">Lions Visual Style</span></p>
<p>Our process for designing the user journey started by considering the features before anything else. We filtered out anything that wasn’t specifically aimed at our audience (rugby fans and sports fans).</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/cross-platform-squad.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="cross-platform-squad" src="http://www.ubelly.com/wp-content/uploads/2013/05/cross-platform-squad_thumb.png" alt="cross-platform-squad" width="627" height="444" border="0" /></a></p>
<p align="center"><span style="font-size: xx-small;">Cross-Platform Squad Sketch</span></p>
<p>Going forward, our aim is to highlight certain areas of the site as they become featured and relevant. For example, with the pre-squad announcement the focus was primarily on the “On the Plane” competition. Then, after the squad announcement, and before the tour, the focus will be on the squad. As the tour approaches focus will turn to the first game, after that it will shift to the next test game. We want to keep those journeys high up in the navigation as well as highlighting new behind the scenes content as it becomes available.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/ontheplane1.jpg"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="ontheplane" src="http://www.ubelly.com/wp-content/uploads/2013/05/ontheplane_thumb1.jpg" alt="ontheplane" width="480" height="549" border="0" /></a></p>
<p>&nbsp;</p>
<p align="center"><span style="font-size: xx-small;">On the plane competition</span></p>
<p>We didn’t use the default languages of Windows, Apple and Google, however we did use conventions found on these platforms. We decided to use the modern user interface that complements the Create Once, Publish Everywhere ethos. The core underlying framework is the same for all platforms and the main challenges were adhering to distinct user interactions of each. Initially we built the foundation framework which we went on to use to feed content to all apps regardless of platform, once that was created and tested the team proceeded to develop the specific user experiences.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/iphone-android-structure.png"><img style="border: 0px currentcolor; margin-right: auto; margin-left: auto; float: none; display: block; background-image: none;" title="iPhone and Android Structure" src="http://www.ubelly.com/wp-content/uploads/2013/05/iphone-android-structure_thumb.png" alt="iphone-android-structure" width="469" height="977" border="0" /></a></p>
<p align="center"><span style="font-size: xx-small;">iPhone and Android Structure</span></p>
<p>The apps aren’t native to each platform but they do look typical of each. For example, the iOS app doesn’t use standard controls, but it does use conventions familiar to users of other similar apps on the platform. Plus, the flexibility we gave to the client in the CMS meant that the structure could be changed easily. <a href="http://dev.windows.com">Windows 8</a> is fantastic at showcasing content so we maximized on that by using the Live tiles, lock screen, share charm (for on the plane), lovely big feature image, pushing relevant content to the surface.</p>
<p>The apps provide a different experience and content to the website. The ‘behind the scenes’ content is exclusive to the app, as is the second screen benefits of using your handheld device. However the on-the- plane competition is featured on MSN and the <a href="http://www.lionsrugby.com/home.php">British &amp; Irish Lions website</a> is instantly recognisable design-wise as being related to the app.</p>
<p>I’m currently working on the design layouts for phase 3 of the project. This includes designing the new fixtures and results pages on <a href="http://dev.windows.com/">Windows 8</a>, tablet and phone. The design for phase 3 is entirely centred around the second screen experience. We are making sure to continue the design elements from the first two phases, including the colours of dark grey highlighted by the ‘sea of red’ and the rich background image of the stadium, so that users easily recognise it as the British &amp; Lions app. We are using windows 8 navigation and design conventions along with my designs to present all the statistics and live match information in a clean and succinct way that enables users to use their second screen to enhance their experience of watching the game. Bring on the tour!”</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/YN9AW3-YP1o" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/the-british-lions-app-what-does-it-take-to-design-the-user-experience-across-windows-ios-and-android/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/the-british-lions-app-what-does-it-take-to-design-the-user-experience-across-windows-ios-and-android/</feedburner:origLink></item>
		<item>
		<title>Rails Girls London 2013</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/gcGJ74sNpoY/</link>
		<comments>http://www.ubelly.com/2013/05/rails-girls-london-2013/#comments</comments>
		<pubDate>Wed, 08 May 2013 15:24:27 +0000</pubDate>
		<dc:creator>CharlotteS</dc:creator>
				<category><![CDATA[Web development]]></category>
		<category><![CDATA[event]]></category>
		<category><![CDATA[london]]></category>
		<category><![CDATA[rails girls]]></category>
		<category><![CDATA[Ruby on Rails]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=17965</guid>
		<description><![CDATA[<div><img width="312" height="169" src="http://www.ubelly.com/wp-content/uploads/2013/05/railsgirls_featured.png" class="attachment-type-photo wp-post-image" alt="railsgirls_featured" title="railsgirls_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/railsgirls_featured-100x100.png" class="attachment-thumbnail wp-post-image" alt="railsgirls_featured" title="railsgirls_featured" style="float:left; margin:0 15px 15px 0;" />Last weekend I attended a &#8220;Rails Girls&#8221; event in London, an initiative that aims to get more women interested in  <a href="http://www.ubelly.com/2013/05/rails-girls-london-2013/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="169" src="http://www.ubelly.com/wp-content/uploads/2013/05/railsgirls_featured.png" class="attachment-type-photo wp-post-image" alt="railsgirls_featured" title="railsgirls_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/railsgirls_featured-100x100.png" class="attachment-thumbnail wp-post-image" alt="railsgirls_featured" title="railsgirls_featured" style="float:left; margin:0 15px 15px 0;" /><p><a href="http://www.ubelly.com/2013/05/rails-girls-london-2013/railsgirls/" rel="attachment wp-att-17972"><img class="alignnone size-full wp-image-17972" src="http://www.ubelly.com/wp-content/uploads/2013/04/railsgirls.png" alt="" width="644" height="350" /></a></p>
<p>Last weekend I attended a &#8220;<a title="Rails Girls London" href="http://railsgirls.com/london">Rails Girls</a>&#8221; event in London, an initiative that aims to get more women interested in technology. In this case, the goal is to teach &#8220;<a title="Ruby on Rails" href="http://www.rubyonrails.org">Ruby on Rails</a>&#8220;, an open-source framework for the <a title="Ruby Programming Language" href="http://www.ruby-lang.org/en/">Ruby</a> programming language. Originally started in Helsinki by Rails Girls co-founders Linda Liukas and Karri Saarinen, chapters are popping up all over the world including in Shanghai, Poland, Brazil, Estonia and Washington.</p>
<p>This was the first Rails Girls London event, spanning two days and entirely free. I&#8217;ve tried PHP, JavaScript and even Ruby, but failed to stick at it. I have always been interested in web development but never succeeded in breaking through the initial mental block of not knowing where to start. When I signed up, it was in the hope that Rails Girls would give me a much needed push.</p>
<h2>Attendees &amp; Coaches</h2>
<p>Rails Girls London was organised by <a title="Katja Zorina's Twitter" href="http://www.twitter.com/katjazorina">Katja Zorina</a>, <a title="Damon Davison's Twitter" href="http://www.twitter.com/allolex">Damon Davison</a> and <a title="Despo Pentara's Twitter" href="http://www.twitter.com/despo">Despo Pentara</a> in collaboration with <a title="Chris Bell's Twitter" href="http://www.twitter.com/cjbell88">Chris Bell</a> and the <a title="Made by Many" href="http://www.madebymany.com">Made by Many</a> organisation in London. The coaches were made up of Ruby on Rails developers who have been programming in Ruby from anything between 1-7 years. Attendees of the workshop included design students who wanted to learn more about development, reporters who wanted to use Ruby for their work, enthusiastic computer folk who needed a push to learn (like me) and more. It was a great mix of all ages from all different parts of the UK.</p>
<h2>The Workshop</h2>
<p><a href="http://www.ubelly.com/2013/05/rails-girls-london-2013/railsgirls2/" rel="attachment wp-att-17973"><img class="alignnone size-full wp-image-17973" src="http://www.ubelly.com/wp-content/uploads/2013/04/railsgirls2.jpg" alt="Photo by http://www.flickr.com/photos/allolex/" width="644" height="429" /></a></p>
<p>After an introduction to the day, we were split into groups depending on how well versed we were with the basics of programming. Then, coaches took 2-3 people each and started teaching! I was coached by <a title="Andrew Nesbitt's Twitter" href="http://www.twitter.com/teabass">Andrew Nesbitt</a>, someone who has been working with Ruby and Rails for about 7 years, so I was confident I would come away having learned a lot.</p>
<p>We started off by building a basic application using the <a title="Rails Girls App Tutorial" href="http://guides.railsgirls.com/app/">Rails Girls App tutorial</a>. This was diving straight in and it was quite overwhelming, but at the end I came out with a good understanding of the structure of a Ruby on Rails application. We got through the tutorial quite quickly so we moved on to <a title="Try Ruby - Code School" href="http://tryruby.org/">Try Ruby</a>, an interactive online tutorial that covers all of the basics of Ruby including arrays, hashes and methods with quite a few weird jokes and cartoon foxes thrown in.</p>
<p>Andrew taught us how to store our files on <a title="GitHub" href="http://www.github.com">GitHub</a>; a version control system that keeps a track of all the changes we make to our code. Then, we learnt how to deploy our application to &#8220;<a title="Heroku" href="http://www.heroku.com">Heroku</a>&#8220;, a site that hosts our small Rails applications for free. I made a huge rookie mistake by sharing my application passwords on Github (woops&#8230;), but it was beneficial as I learnt some complex methods to get rid of these!</p>
<p>At the end of the day we watched lightning talks given by some of the coaches and organisers. They gave us basic things to watch out for when programming (make sure you&#8217;re in the right folder or else you&#8217;ll upload your entire desktop to Git), how to search for help online (<a title="Stack Overflow" href="http://stackoverflow.com/">StackOverflow</a> is a valuable resource for any programming help) and how to get more out of our Rails applications.</p>
<h2>Summary</h2>
<p>Rails Girls London was a great thing to do. Being taken through the basics of a language and then left to explore and ask questions as and when I needed to was a great way for me to learn. Obviously, it wasn&#8217;t enough time to cover everything about Rails but it certainly gave me enough insight to know where to go next. I hope I can hit the books, create some fun little applications and keep building up my knowledge. Even more so, I hope I can learn enough about the language to return to Rails Girls and coach others.</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/gcGJ74sNpoY" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/rails-girls-london-2013/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/rails-girls-london-2013/</feedburner:origLink></item>
		<item>
		<title>10 top tips for creating an amazing user experience</title>
		<link>http://feedproxy.google.com/~r/ubelly/~3/LhAeA_Ch5qk/</link>
		<comments>http://www.ubelly.com/2013/05/10-top-tips-for-creating-an-amazing-user-experience/#comments</comments>
		<pubDate>Tue, 07 May 2013 10:30:55 +0000</pubDate>
		<dc:creator>Sara Allison</dc:creator>
				<category><![CDATA[Apps]]></category>
		<category><![CDATA[app design]]></category>
		<category><![CDATA[app development]]></category>
		<category><![CDATA[building apps]]></category>

		<guid isPermaLink="false">http://www.ubelly.com/?p=18286</guid>
		<description><![CDATA[<div><img width="312" height="185" src="http://www.ubelly.com/wp-content/uploads/2013/05/Official-Lions-splashscreen_featured.jpg" class="attachment-type-photo wp-post-image" alt="Official Lions splashscreen_featured" title="Official Lions splashscreen_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/Official-Lions-splashscreen_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="Official Lions splashscreen_featured" title="Official Lions splashscreen_featured" style="float:left; margin:0 15px 15px 0;" />With the launch of the British &#38; Irish Lions Official app across no less than seven platforms at once across Windows,  <a href="http://www.ubelly.com/2013/05/10-top-tips-for-creating-an-amazing-user-experience/" class="more-link"><span class="more-icon"></span><span class="screen-reader-text">Continue Reading</span></a>]]></description>
			<content:encoded><![CDATA[<div><img width="312" height="185" src="http://www.ubelly.com/wp-content/uploads/2013/05/Official-Lions-splashscreen_featured.jpg" class="attachment-type-photo wp-post-image" alt="Official Lions splashscreen_featured" title="Official Lions splashscreen_featured" /></div><img width="100" height="100" src="http://www.ubelly.com/wp-content/uploads/2013/05/Official-Lions-splashscreen_featured-100x100.jpg" class="attachment-thumbnail wp-post-image" alt="Official Lions splashscreen_featured" title="Official Lions splashscreen_featured" style="float:left; margin:0 15px 15px 0;" /><p>With the launch of the <a href="http://www.lionsrugby.com/lions_official_apps.php">British &amp; Irish Lions Official app</a> across no less than seven platforms at once across Windows, iOS and Android, we thought the team at <a href="http://www.sequence.co.uk/">Sequence</a> who built them might have some useful knowledge to share on how you create an amazing experience regardless of what platform you’re working with. Here&#8217;s what lead designer<a href="http://www.linkedin.com/profile/view?id=148190497&amp;authType=NAME_SEARCH&amp;authToken=ouEj&amp;locale=en_US&amp;srchid=e384edd3-15d2-4f62-8259-699394c9b873-0&amp;srchindex=6&amp;srchtotal=15&amp;goback=%2Efps_PBCK_*1_liam_flaherty_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link"> Liam Flaherty</a> and UX designer <a href="http://www.linkedin.com/profile/view?id=155277436&amp;authType=NAME_SEARCH&amp;authToken=wMH6&amp;locale=en_US&amp;srchid=62f3fb29-9890-4ba1-89ba-ae4b20e2c49e-0&amp;srchindex=5&amp;srchtotal=118&amp;goback=%2Efps_PBCK_matt+o%27Keefe_*1_*1_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link">Matt O&#8217;Keefe</a> had to say&#8230;</p>
<p><strong>1. </strong><strong>Have a clear value proposition</strong></p>
<p>A user needs to very quickly learn ‘what can this app do for me?’ Anyone working on creating and building an app needs to keep coming back to this question.</p>
<p><strong>2. </strong><strong>Know your audience</strong></p>
<p>Consider how they like to be spoken to and how technical the language should be. Building the British &amp; Irish Lions Official app was a rare scenario where the team that worked on the app were also end users as we’re all rugby fans. The British &amp; Irish Lions had a lot of research to hand about committed rugby fans but we suggested they widen their scope with the app to include people that may not normally follow rugby but may want to get involved in the tour. We wanted it to be so that no matter your level of rugby knowledge, you could use and enjoy this app.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/ontheplane.jpg"><img style="border: 0px currentcolor; display: inline; background-image: none;" title="ontheplane" src="http://www.ubelly.com/wp-content/uploads/2013/05/ontheplane_thumb.jpg" alt="ontheplane" width="396" height="453" border="0" /></a></p>
<p><strong>3. </strong><strong>Do one thing well</strong></p>
<p>Complexity is often a symptom of not differentiating people&#8217;s actual needs from what you are building.</p>
<p><strong>4. </strong><strong>Test often with real people</strong></p>
<p>Don&#8217;t design in a bubble, keep on testing and playing with your app as you build and ask as many other people as possible to the same. Your app will evolve and that’s a good thing.</p>
<p><strong>5. </strong><strong>Optimise for the platform</strong></p>
<p>Make your app feel at home &#8211; if it’s for <a href="http://www.microsoft.com/click/services/Redirect2.ashx?CR_CC=200206182&amp;CR_EAC=300090995">Windows</a>, make it feel at home on Windows. We created an information architecture that made the most sense for the content and then designed the navigation using each platforms navigation style. We chose big background images for <a href="http://code.msdn.microsoft.com/windowsapps/ParallaxBackground-A-Metro-f929e558">Windows 8 with parallax</a> and made sure that we used the default font on each platform which helps make the app feel more native than it actually is.</p>
<p><strong>6. </strong><strong>Don&#8217;t try and be too clever</strong></p>
<p>Users don&#8217;t want to have to work at using your app, keep it simple and easy to use.</p>
<p><strong>7. </strong><strong>Use existing design patterns where you can</strong></p>
<p>Familiar interactions feel intuitive so try not to change designs beyond recognition. The British &amp; Irish Lions branding wasn’t originally designed with digital in mind so we worked hard on bringing the prestigious identity of the Lions to life with this app.</p>
<p><a href="http://www.ubelly.com/wp-content/uploads/2013/05/splashscreen.jpg"><img style="border: 0px currentcolor; display: inline; background-image: none;" title="splashscreen" src="http://www.ubelly.com/wp-content/uploads/2013/05/splashscreen_thumb.jpg" alt="splashscreen" width="407" height="243" border="0" /></a></p>
<p><strong>8. </strong><strong>Avoid unnecessary features</strong></p>
<p>Start simple and, if there&#8217;s a genuine need, add more. We worked out all features at each stage of the tour to ensure that the structure of the app would ‘work’ no matter how many features were added.</p>
<p><strong>9. </strong><strong>Build in some delight</strong></p>
<p>Little things can make people smile and a little character goes a long way. The whole idea behind this app is that the exclusive content will be created by the team themselves, sharing the personal real time experiences that make up the tour. This is what makes this app unique and exciting, an original and thoroughly modern experience of a sporting event using digital to provide a direct line to the team, as opposed to having to rely on reports created by people looking in from the outside.</p>
<p><strong>10. </strong><strong>Stuff will always go wrong but when it does help make it better</strong></p>
<p>Make errors and messages that you build into your app helpful and try to make as much information as recoverable as possible. The star ratings and reviews on the Apple/Android and Windows stores gave us an invaluable insight into the user’s experience of the app and enabled us to iterate on and refine our design.</p>
<p><a href="http://www.linkedin.com/profile/view?id=148190497&amp;authType=NAME_SEARCH&amp;authToken=ouEj&amp;locale=en_US&amp;srchid=e384edd3-15d2-4f62-8259-699394c9b873-0&amp;srchindex=6&amp;srchtotal=15&amp;goback=%2Efps_PBCK_*1_liam_flaherty_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link"><br />
</a><a href="http://www.ubelly.com/?attachment_id=18295" rel="attachment wp-att-18295"><img class="alignleft size-full wp-image-18295" title="liam flaherty sequence_small" src="http://www.ubelly.com/wp-content/uploads/2013/05/liam-flaherty-sequence_small.jpg" alt="" width="73" height="73" /></a><a href="http://www.linkedin.com/profile/view?id=148190497&amp;authType=NAME_SEARCH&amp;authToken=ouEj&amp;locale=en_US&amp;srchid=e384edd3-15d2-4f62-8259-699394c9b873-0&amp;srchindex=6&amp;srchtotal=15&amp;goback=%2Efps_PBCK_*1_liam_flaherty_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link">Liam Flaherty</a>: Creative Designer at <a href="http://www.sequence.co.uk/">Sequence</a>. An enthusiastic and friendly freelance graphic designer. Always like to push my skill set to improve with every piece of design I work on.</p>
<p>&nbsp;</p>
<p><a href="http://www.ubelly.com/?attachment_id=18296" rel="attachment wp-att-18296"><img class="alignleft size-full wp-image-18296" title="matt okeefe sequence small" src="http://www.ubelly.com/wp-content/uploads/2013/05/matt-okeefe-sequence-small.jpg" alt="" width="50" height="50" /></a><a href="http://www.linkedin.com/profile/view?id=155277436&amp;authType=NAME_SEARCH&amp;authToken=wMH6&amp;locale=en_US&amp;srchid=62f3fb29-9890-4ba1-89ba-ae4b20e2c49e-0&amp;srchindex=5&amp;srchtotal=118&amp;goback=%2Efps_PBCK_matt+o%27Keefe_*1_*1_*1_*1_*1_*1_*2_*1_Y_*1_*1_*1_false_1_R_*1_*51_*1_*51_true_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2_*2&amp;pvs=ps&amp;trk=pp_profile_name_link">Matt O&#8217;Keefe</a>: UX Designer at <a href="http://www.sequence.co.uk/">Sequence</a>. UX designer for websites, Windows 8 applications and mobile applications.</p>
<img src="http://feeds.feedburner.com/~r/ubelly/~4/LhAeA_Ch5qk" height="1" width="1"/>]]></content:encoded>
			<wfw:commentRss>http://www.ubelly.com/2013/05/10-top-tips-for-creating-an-amazing-user-experience/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		<feedburner:origLink>http://www.ubelly.com/2013/05/10-top-tips-for-creating-an-amazing-user-experience/</feedburner:origLink></item>
	</channel>
</rss><!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Page Caching using disk: basic
Database Caching using disk: basic
Object Caching 2515/2772 objects using disk: basic

Served from: ubelly.com @ 2013-05-22 09:24:18 -->
