There’s been some discussion in recent years about how many screens we each have and that one holy grail is how we get these screens to work together – TV, PC, phone, tablet – so I thought I’d share this delightful example.

SmartGlass allows me to connect my phone or PC to my Xbox so I can use the second device as a controller for the Xbox or, as you can see in this instance, use the second screen for additional content. Here I have my Surface RT connected with SmartGlass over WiFi to my Xbox (connection is a seamless experience as long as they’re on the same wireless network) and it acts as the SatNav for the game. Not only showing me where I am on a map, but being able to use it as I would the SatNav in my car. Brilliant stuff.

Following on from recent sold out workshops, Microsoft UX Evangelist Andrew Spooner is running day long workshops that will introduce you to the new Windows 8 operating system and the design and UX patterns that exist in Windows Store apps. The day is split into 2 parts. The morning will give you an overview of the Modern UI, explaining the new Windows experience and explaining the design principles that manifest themselves in this new style of application, brought to life using live examples. You will also get a brief introduction to the development environment so you can understand how to download and run sample applications. The afternoon will build upon the essential idea for an app and guide you through the process of turning it into a Windows Store application that will truly shine in the Windows Store.

Who is the workshop for?

This is a non-technical workshop aimed at visual designers and UX designers. Developers who are looking to build a better application experience will also learn a great deal from this workshop.

What should I bring?

Bring paper and pencils for taking notes. Sketch pads will be supplied for the afternoon wire framing exercise and you will be given digital copies of the content at the end of the day. If you can bring a Windows 8 machine (either a PC or a Mac) you can drive yourself through some of the theory in the morning but that is not essential, Andrew will bring Windows 8 touch devices available to share round the room.

What will you learn?

You will learn how to approach application design for Windows 8, what the unique experiences that a user of Windows 8 expects from an application and how you should approach some of the unique features of Windows 8 and bring them to life within your app. You will get an overview of the technical structure of a Windows Store HTML application and the tools that are used to create these applications.

The new round of workshops are free to attend and will be held at The Modern Jago studio in Shoreditch, London and you can register now for the following dates:

· Weds 1st May

· Weds 22nd May

· Thurs 6th June

· Weds 19th June

If you have any questions about these workshops, feel free to contact Andrew on Twitter @andspo

In this film, number 6 in the series of conversations about digital design, I talked to Nokia’s Head of UX Nikki Barton about people, experiences and how teams can work together to create truly brilliant products.

“People want technology just to work” she says in this film. Being both a creative person and a technical person and as a Creative Director at Nokia she has a great deal of insight to offer both to designers and developers who are looking to create mobile application experiences. “But they expect it to fail.” That’s where we as designers and developers of digital experiences need to work together.

I’ve worked in teams where an idea has been put forward and the developer will quickly say outright ‘that’s not possible’ so an idea will be dismissed. And to be fair to them in the binary world of what’s possible and what’s not possible, they’re often correct, but where they’re wrong is that they’re not spending the time to understand the idea – to appreciate it from someone else’s perspective. I’ve never been given a proposition that’s not in some way possible. Ok, there are boundaries, such as time or cost, there are physical boundaries such as gravity and time travel, but rarely is an idea outright impossible. It just has constraints. In the same way, I expect designers to have an understanding of the technology that they’re working with. What is possible and what isn’t possible, what makes a great experience on a particular platform. When designers and developers work together, that’s when we can make technology work for users.

So, especially when we’re in this new age of constant connectivity and where all technology is connected together, if you’re not thinking about the human sitting between the software and the hardware, the person who is actually using the product, then your product is likely to fail.

I love her closing comment, how we should let people live their lives through the environment not through the technology. So even when I take a walk up a hill into the clouds and look down on the planet, remember, this is about people and experiences.

Enjoy.

Playing the Modern UI

Every platform has it’s own design language and it needs to be respected. If you respect the language of the user interface that has been put in place by the operating system that your game will sit upon, then your players already understand how that platform works. You can take advantage of this to save yourself time in educating players of your games how the interface to your game works.

Also, players on different platforms have different expectations. For instance, I as a user of the Windows platform across phone and Windows 8 expect to have a trial version of an application on offer before I purchase a full version. That’s the way applications on the modern version of Windows work and that’s how I expect them to work.

Trust = Ratings = Downloads

If you are able to match a user’s expectations in the way your game works then your users will trust your application. If they trust your application then they will give it a higher rating. The higher the rating the more downloads your game will achieve.

Checklist for Windows 8 game designers

Here’s a list, in no particular order, of features and functionality that producers of games for the Windows 8 platform should consider when designing their game.

1. Trial version – as mentioned above, this is an expectation. Also, the Windows Store is able to handle trial periods for you so there is nothing programmatic that you need to add if your trial version is based upon time limit alone. If you wish to remove features based on trial vs paid for version of an app then this is work that the developer will have to take on.
2. Take advantage of the Windows 8 touch language that already exists – you can create your own touch gestures but in the first instance use the ones that are present in the operating system itself.
3. If you can use one of the standard system controls then do so. Sliders, toggle switches, date pickers, ratings controls are already familiar to Windows 8 users. They are already optimized for touch, keyboard and mouse input and include accessibility features. Use the standard controls but make sure to skin them to the personality of your game and use the time you saved to work on the content and gameplay.
4. Flat Navigation – take a look at the way that Internet Explorer works to allow a user to navigate between tabs using the top application bar. Is there a similarity between this style of navigating between ‘documents’ and the different sections of your game?
5. Hub Navigation – take a look at the hierarchy of content in the Windows Store. Does your game content have a similar hierarchy of information to process before the game can be started. If possible, pick one of these navigational structures.
6. Navigation – App Bars – Windows 8 users are used to looking to the edges of the screen for commands that they can’t see on the screen’s canvas directly. Take advantage of the application bar at the top and the bottom of the screen to place commands that would otherwise be a distraction either before the game has started or during gameplay itself. Use the calling of the application bar to pause the game whilst the user explores the commands
7. Live Tiles – common across Windows Phone, the Xbox dashboard and now on Windows 8, live tiles should be used to encourage users back into your game. This could be a reminder of their current progress or that their high score has been beaten.
8. Notifications – can you use notifications to interrupt users appropriately and get them back into your game? For instance – ‘Your friend has just beaten your high score. Are you going to stand for that?’ Touching on the notification brings the user back into your game.
9. Share charm – Windows 8 has sharing built into the operating system itself. That’s how content is shared between all Windows Store applications – take advantage of this power to allow your users to share contextual content on each screen of your game.
10. Search charm – if the player needs to search within the content of your game, the search charm should be the place where they kick off this process.
11. Settings charm – this is where the settings for the operating system can be found, it’s where almost every app from the Windows Store keeps it’s app settings so why should games be any different? Use the settings charm and avoid adding settings to your application canvas.
12. View states – consider how your game is going to respond to changes in orientation of the device. Moving from portrait to landscape can add additional function to the game play, or you can ignore it. But you need to consider what your game is going to do when orientation of a device changes.
13. Snapping – all applications can be snapped so plan for this and give a great snapped experience. Even if that means that your game is paused in this state – inform the user.
14. Pixel density – provide bitmap images in the right format so your game looks fantastic on every screen
15. Input and sensors – digital authenticity is a large part of the Windows 8 platform. Take advantage of the digital nature of the device to add to your gameplay using accelerometers, GPS, cameras, microphones and technology such as Sensor Fusion. Would your game benefit from being played using an Xbox controller? It’s simple to implement, you just need to consider it.
16. Roaming – your game has the ability to know who I am as I am logged into the machine. Take advantage of this and roam my scores across my devices so I have a consistent experience on my desktop, table, laptop and even phone.

Not all of these are appropriate to every game scenario, but don’t dismiss any of them outright as they are familiar and important to users of the Modern UI. But also, don’t try and shoehorn them in as the user has a great deal of control over ‘their’ operating system and can just as easily turn off your potentially irritating implementation just as easily as you can include it.

Be considerate to the player

They should be the most important part of your game design process.

Go forth and create great games.

I’m looking forward to it.

New Adventures 2013 promised to be a great conference and it didn’t disappoint. One of the talks I was most looking forward to was Jason Santa Maria’s on “The Nimble Process”.

Jason started by talking about how we, as in an industry and as individuals, always like to see how others work and we’re always looking to improve our own processes. He talked about how his process has changed a lot recently, from something that used to be quite rigid and linear to something much more erratic.

Jason questioned if there actually is an ideal process or the right tool that we should all use,
concluding that there is no right path we’re not all assembling the same thing and coming up with the same results. We are individuals and work on different projects, so we’re always going to have different processes that work for us and processes that don’t.

One thing I loved that Jason said was that finding a process that works for us is all about trial and error and making mistakes something I can relate heavily to, as I’m trying to encourage others to make mistakes more so that we can learn from them.

Jason’s old process went something like this: Plan > Design > Code > Launch. He explained how this process was perfect at the time as the amount of options we had as designers and developers was limited.

However, Jason’s process now is much less linear and includes version upon version of design, lots of iteration. It looks much more of a messy process as you are constantly going from one stage, back to the beginning and all over time after time, until you have your “finished” product.

Using his time at Typekit as an example, Jason talked about how he was scared of putting his work on Typekit live as he wasn’t used to showing someone a design unless it was complete, a whole. But the idea here was to test it out on people, change it, ship the changes and then test again going back to the iteration after iteration.

Explaining Design

“A design process is also about communication.”

Jason talked about MVP (Minimum Viable Product) and how he is adapting this to become a MVU (Minimum Viable Understanding) how can he quickly get his idea across.

Causing a few chuckles across the room, Jason talked about how clients aren’t idiots and rather than present to a client, present with them and express your ideas so that they can understand and participate.

Being nimble

“Good design happens with or around good constraints.”

Jason advised us to early on in the design process, have fewer constraints so that you’re not restricting your ideas or your creativity. Later on though, constraints are good as you’re tying things down and making decisions.

Jason told us to avoid details (such as grids and using UI Sketchbooks for wireframing and sketching), as they are your enemy. Instead, he asked us to try and think of something as if it is very out of focus you don’t need to think more than roughly. Later on, further down the process, everything starts to come into focus.

Jason said it was alright to play around and sketch lots of ugly ideas it also gets a lot of the crap ideas out of the way at the beginning.

Using the Alphabet 100 challenge as an example (where you have to draw 100 versions of the same letter), and how he had to do the same at school with a phone (100 different sketched versions of a phone!) Jason talked about how at first, it’s difficult but after 20 or so versions, you start having to be more inventive and come up with new ideas. Jason explained how he feels this is what sketching and the beginning of the design process should be like getting as many versions down, good or bad, and to be as creative as possible. That way, you can get some great ideas that you can develop further.

Interestingly (as its one of the first things I usually start with myself when designing) Jason says he works backwards into a grid, as he feels that a grid is one more constraint you don’t need at the beginning of the process. This is definitely something I’m going to try more of and instead focus on the design, feel and typography more.

Visual Prototypes

Jason went on to talk about visual prototyping, and how he doesn’t necessarily think this has to be in Photoshop or a graphics program anymore.

He talked also about how wireframes are very limited by paper wireframes need to show content hierarchy and how the interplay of all the elements work together, and with paper that is one extra constraint (due to the size).

Jason talked about how we need to use wireframes and prototype layouts to help our clients truly understand and think about what the context is of the design. The idea here is to also really keep moulding, changing and evolving your ideas and the layout.

What is the best vehicle for an idea?

Here, Jason talked about style tiles. Here, Jason brought up points I’d never really thought about before style tiles are like a directed mood board, and while they can be really useful internally in a design process for help and ideas (such as typography, colour, etc) Jason feels that giving a style tile cheats a client out of what they’re going to get.

Jason doesn’t like style tiles, because it doesn’t focus on the real thing or the tangible product at the end and it’s a dangerous expectation to give to the client.

To quote, they are “the right tool for the right audience.”

Jason moved on to say about designing in the browser and how he feels it is great for responsive design as you can quickly see content changes. However, Jason really does feel it restrains you early on in creativity, quoting “The right tool at the right time.”

Jason said he used both a mixture of Photoshop and the browser in his process. In an example of the new A Book Apart website, he talked about how they very much had to focus on a lot of the decision making by designing in the browser, due to going straight from the old website into a prototype.

Interaction Prototypes

Jason then went on to recommend two tools that I absolutely love: Gridset and Typecast. He recommended that these are very easy to use and super fast to port into your real design or  build.

So…

Jason finished by telling us how it’s easier to “revise than to create” again touching on the idea that we should be iterating , revising and refining, rather than always trying to create a finished product.

“Understand that getting out of that mindset will make you a better designer.”

Get the tools you need to create

Get your hands on a wealth of helpful design resources for Windows 8 right here.

This is film number 5 in a series of conversations around the design principles for modern Windows products. It looks at they way we choose to use words in our applications. The key point I was looking to address with this film was how as designers and developers of applications, we need to consider how we communicate to our users in every aspect, not just within the digital interface itself. I choose to interview an old colleague of mine, Nigel Edginton-Vigus as he’s one of he  most passionate people I’ve worked with when it comes to putting words into a product.

If there’s only one point you take away from this film, it should be about brand schizophrenia. Make sure that the tone you use in your graphic design carries over to your typographic design in turn carries over to the words you pick to put into all your communications.

If there are brands or applications that you think do this particularly well, let me know in the comments below, I’m always keen to hear people’s thoughts on this subject.

The huge rise in popularity of one page sites over the last 2-3 years isn’t showing any sign of slowing down and is an area we keep a keen eye one – offering a great source or awesome ideas and clever uses of emerging web technologies. Oh yeah, and we do love a little Parallax scroll with our morning coffee.

As we’re nearing the end of 2012 we thought it’d be fun to do a quick roundup of some of our favourite one page sites for you to check out. It is by no means exhaustive, so please share your own favourites with us in the comments or via Facebook or Twitter, we’d love to check them out.

Creative9

Creative9 is a UK based full service development & interactive design agency. The site’s mix of smooth delivery and sci-fi epicness, not to mention; avoidance of cramming in too much information, make this site a winner.

http://creative9.com

Inception Explained

As big web and movie fans, a site that delivers on both fronts is hard not to love. This experimental site built around the plot of the hit movie Inception was made by Matt Dempsey and manages to take a lot of information, visually condense it and create a seamless, fun experience for the user.

http://www.inception-explained.com

in Tacto 10 Years

in Tacto, an interactive agency specialized in the creation of digital pieces, celebrates 10 years of adventure as their work and agency has expanded, along with the technologies they work with daily. A beautiful, visual trip that not only explores the agency’s timeline but that of the web itself.

http://www.intacto10years.com

Land Een Job

Created by digital agency Interacto for their recruitment process, Land Een Job takes users on a beautifully crafted journey in search of employment perfection (including a trip through the cosmos). It’s friendly craft-paper style aesthetic works well and little touches like the shadows and birds being killed by the pollution from the factory add personality.

http://www.landeenjob.be

Dangers Of Fracking

A scrolling one page infographic style site site designed and coded by Linda Dong to inform users about the dangers of the Hydraulic fracturing, or “fracking”. This is the process of drilling and injecting fluid into the ground at a high pressure in order to fracture shale rocks to release natural gas inside. There appears to be a lot of evidence highlighting the risks of water contamination, which this site serves to highlight. It’s a really smooth, rich visual experience for users exploring a potentially heavy and/or dry subject matter.

http://www.dangersoffracking.com

Want more?

If you like getting geeky about one page sites (like I do) then add onepagelove.com to your RSS, it’s a kick-ass place to find the latest and greatest examples.

Not only is this beautiful book great as a ‘look what I’m reading’ coffee table book to be pulled out when you have guests, it’s a treasure trove of insights, wisdom and nuggets from the crème de la crème of the web community.

Insites – The Book is a limited edition, 256-page tome presented in a numbered, foil-blocked presentation box. This very special publication features no code snippets and no design tips; instead, 20 deeply personal conversations with the biggest names in the web community.

Over the course of six months, the Insites team travelled the US and the UK to meet with Tina Roth Eisenberg, Jason Santa Maria, Cameron Moll, Ethan Marcotte, Alex Hunter, Brendan Dawes, Simon Collison, Dan Rubin, Andy McGloughlin, Kevin Rose and Daniel Burka, Josh Brewer, Ron Richards, Trent Walton, Ian Coyle, Mandy Brown, Sarah Parmenter, Jim Coudal, Jeffrey Zeldman, Tim Van Damme, and Jon Hicks.

The team delved into personal journeys, big wins, and lessons learned, along with the kind of tales you’ll never hear on a conference stage. Each and every person we spoke to has an amazing story to tell — a story we can all relate to, because even the biggest successes have the smallest, most humble of beginnings.

Insites: The book will be available in the following formats:

· Limited boxed paperback edition(Only 2000 available) – £23 + shipping

· Digital edition(PDF, EPUB, MOBI) – £9

· Physical & Digital Bundle(Limited boxed paperback + PDF, EPUB, MOBI) – £29 + shipping

Available exclusively from Viewport Industries, you’ll be able to place your order on Wednesday 19th September 2012 at the following times:

· 4pm BST

· 11am EDT

· 8am PDT

Tip: take a look at the inside cover and see if you can spot The Critter. We’re proud to be a part of this fabulous book. Get yours pre-ordered on insitesthebook.com!

As a close to the first day of Reasons to be Creative, Mark Boulton took us through his thoughts on failure. In Mark’s opinion, failure is an essential part of anyone’s craft, and will make you a better designer, co-worker and general human being.

People have a bit too much of an obsession with perfection. In Mark’s eyes, perfection is a mental health disorder. One issue is that perfection is simply unattainable. However, more importantly, the closer you get to perfection in design or form, the more the cracks start to appear. This is the case for most situations, where the more you expect of the experience (think five star hotels, business class flights and high-end smartphones), the worse it is when a crack does appear.

Another important thing to remember with failing, is the importance of course correction. In the words of Mike Tyson, “everyone has a plan until you get punched in the face.” However, the important thing is that when you do get knocked down, you need to get back up, assess the situation and change your course. Current culture, especially business culture, is constrained and hemmed in by process. Instead, we need to be inspired by the way that children play. Children have an innate ability when ‘playing pretend’ of changing course as soon as the situation isn’t going their way. “I’m a princess,” “Well, I’m a pirate who’s going to steal you,” “Well I’m now a shark and I’m going to eat your ship!” Mark found this when working on the Drupal redesign project, where the constant onslaught of feedback almost made him lose his sanity. In his words, “have a game plan, sure, but the most important thing is to be able to adapt and change.”

One of the techniques that Mark has found helps with the design process specifically, is the important of sketching. Because of the automatic response to sketches feeling like an unfinished product, clients are more often than not more willing to feed back on designs that are sketched.

A really important skill for anyone, not just designers, is the ability to critique. However, there are rules about critique. You need to listen to the critique. The critique needs to focus on the work, and not the person. Critique should be a conversation. Ideally, your work needs to be public to invite the best level of critique.

Another concept that Mark talks about is thinkering. That is, the time spent thinking whilst doing something with your hands. What people find is that when you’re doing simple craft, it frees your mind up to think of other things. When designers design and are being paid for their job, it often removes the love from the process, which removes the craft. This isn’t design as craft.

There are a few other pieces of advice that Mark gives about the design process. Be your own project manager, as those removed from the craft often end up being it’s downfall. Invite critique. Be agile, not Agile. Relying on a set process like Agile isn’t enough, you need to actually be agile in your process. Don’t hide from your clients, your colleagues or from anyone. Don’t be ambitious, be a dreamer. Ambitious people don’t get what they want.

Make mistakes. Be better.

In essence, listening to Mark talk is like getting a massive download of brilliant anecdotes and sage advice about design and the design process. It’s enough to make your brain hurt.

Windows 8 marks a huge change in both application design and user experience. It has a new style of app, the Windows Store app and these, along with Windows 8 will launch worldwide on October 26th.

This day long workshop is run by Microsoft Evangelist Andrew Spooner and aims to introduce Microsoft’s new operating system and the design and UX patterns that exist in Windows Store applications. The day is split into 2 parts. The morning will give you an overview of Windows 8 and explain the new Windows User Interface and Windows experience. You will also hear how the new Microsoft design principles can manifest themselves in the applications that you create. The afternoon will take you through the process of taking the essential idea for an app and turning it into a Windows Store application that takes advantage of Microsoft’s new design style and principles so you can create an application that will truly shine in the Windows Store.

If you work in a design or UX capacity or if you work on mobile or PC applications, this is the ideal opportunity to become familiar with Windows Store applications of launch so that you are ready to port over your existing applications or start building applications for your clients.

Agenda

Windows 8 UX Workshops

More workshops will be added in the near future, but don’t hesitate, register today for a Windows 8 UX workshop near you.

• 30^th August 2012 • Thursday • Edinburgh
• 13^th September 2012 • Thursday • Bristol
• 20^th September 2012 • Thursday • London