This morning I received the shocking and very saddening news that my ex-lecturer and colleague, friend and mentor, Andy Cameron died yesterday (May 28th) of a heart attack. Yet another great loss to the interactive media world.

Finding words is not usually something I struggle with, but today they are stuck in my throat. Andy quite simply changed the course of my life.

When I was a first year BA student, intending to become a film director, Andy was my “digital media” lecturer. He introduced us to Photoshop 2 and Macromind Director 3 and ways of thinking about this new thing called “interactivity”. It was with Andy that I wandered into the college’s VAX computer lab and got my first e-mail address, back in 1991, and where he first showed me “The Web” in line-mode text as it was back then and, later, Ted Nelson’s and Hypertext. Film directing went in the can as I saw the future potential of interactive media.

But it was Andy’s playful curiosity and enthusiasm that made the real difference. He encouraged us to explore and mess around with these new forms and technologies. He would gleefully tell us that we “should go and try” something, not really knowing if it were possible, but knowing that we would probably work it out. We did and we learned a great deal in the process. He would then feign his dismay at being out-done by his students – an experience I later had as a lecturer myself. He had a powerful intellect that placed these emerging media forms into context and was quick to call-out post-structuralist bullshitters – of which there were and still are many in the new media arts scene – and could do so due to his great knowledge of the material. His charming, slightly chaotic manner was a deceptive ruse. Underneath he was as sharp as a tack – just read some of his writing.

His greatest impact on me, though, was that he had the humility to let his students become collaborators and co-discovers. He saw the potential in the group of us who were playing with this new medium, going around to each others’ houses (including his) and showing off and swapping the little interactive “toys” we made. He encouraged us to take our playful exploration seriously, but managed to do so without sucking the life out of it. It was he who encouraged us to apply for an Arts Council grant and to set up shop as a collective studio. Andy was a pioneer, but shared his knowledge freely with us and encouraged us to come along for the ride. Without him, that group of us would never have eventually become Antirom and spawned the various careers and agencies with their roots in those early days and his intellectual generosity. We owe him a great deal.

Andy was a mentor for me for many years and shaped me intellectually and professionally more than anyone in my life, even after Antirom disbanded and I went on to have a similar hybrid commercial and academic career myself. His intellectual DNA is all over my PhD on playfulness and interactivity, which arose out of a conversation about trying to define the language of interactivity. I will always have fond memories of late nights at his place coding, designing and jabbering on about interactivity, of staying with him in Italy during a heatwave and his attempts to argue in poor Italian with the air conditioning engineers, and of those extraordinary formative years together at Antirom.

The other day I found a photo (a real, physical one) of Andy taken in the Antirom studios. I realised he was about the same age then as I am now and I realised just how much he gave me. Now I know just what a loss it is that he is gone.

My thoughts and sympathy go out to Emily and the boys.

(Creative Review has a nice tribute and comments about Andy).

Zeldman started it.

Without Design Methods, I Feel Like I Am Cheating – another cracking post from Jon Kolko. This one is close to my heart because I teach design methods on HSLU’s MA Design and always make a point of saying that theory is practice and that methods are simply tools. As Jon says,

a design method won’t lead you to a good solution, because a design method has no natural relationship to the content of the problem. There’s no presumption of quality in the method, as each method is simply a series of artificial constraints that are introduced into a particular design context in order to help frame it.

There is a useful set of links at the end of Jon’s post too.

I have been giving lists of experience prototyping tools and tips for doing research to quite a lot of students recently, so I thought I would start compiling it into a file, which has turned into quite a lengthy – and I hope useful – resource. I’ll try and keep this regularly updated.

[Last update: 19.05.2012 - added books]

Mockups & Experience Prototyping Tools

Pen, Paper and Scissors

Yes, that’s right. Basic pen and paper mockups, along with a bit of double-sided sticky tape, glue, sticky notes and scissors or a knife can get you a long way. Often you’re just trying to get a sense of the flow of something or you might be trying to quickly visualise how something will work or feel. It takes almost no time to sketch up something with some markers, cut pieces out and stick them onto cardboard. It’s a good way to workshop ideas in a kind of 3D brainstorming/bodystorming way.

It’s also a useful way of building quick mockups for a slideshow/demo video of how a concept might work. Need an iPhone app screen? Sketch the app on a bit of paper, stick it to a real iPhone and photograph someone using it. This is much better than just showing a sketch of the app screen alone – context is king.

Keynote and Keynotopia

Keynotopia is a set of Keynote templates for creating Web and app (iOS and Android) mockups and wireframes in Keynote. Keynote’s snap-to-object and alignment tools and the ability to assign hyperlinks from objects to other slides makes it an ideal wireframing/mockup tool. You can export as a clickable PDF and run it fullscreen to test a web or smartphone app prototype, or any other interface you care to imagine (a ticket machine, for example). Can be powerful in combination with LiveView Screencaster running on a touchscreen iOS device. Edenspiekermann recently wrote a blog post about how this fits into their workflow.

Another use of Keynote is to create narrated slideshow concept videos of a service. Shooting video demos is, of course, possible if you have the skills, but for most people the effort required to get these looking better than your uncle’s home-movies is time better spent doing some good mockups and design work. On the other hand, photography is relatively easy to do relatively well. Even without a decent lighting set-up you can shoot either in natural light or with a good, ceiling-bounced flash and get some decent images. The other advantages it that it’s easy to Photoshop a still image of sketched screen mockup into a photograph of someone holding a smartphone. It is is possible, but a lot of work to try and do the same thing with video.

Once you have created your storyboard images (which might be a mix of photos and sketches), you can import them into Keynote and then play the slideshow and record a narrative at the same time. Keynote can export this as a movie for you. It’s a lot easier than trying to do all this in a video editing application, such as iMovie.

Keynote Kung-Fu

A Keynotopia alternative is Keynote Kung-Fu, which also provides a set of wireframing tools and templates for Keynote and is only $12.

Mockapp

Mockapp is another tool for iOS to mock-up clickable applications.

Adobe Proto

Adobe Proto is a “a new Adobe Touch App, lets you create interactive wireframes and prototypes of websites and mobile apps on your tablet.” I haven’t used it yet, so can’t vouch for it (I have a 1st Gen iPad only). Adobe’s whole Creative Cloud suite offers some other touch apps that might start to become useful too.

Glyphish

If you need some icons, try Glyphish.

iMovie

iMovie is Apple’s consumer-level (read: amateur) video editing application, but it’s surprisingly powerful and pretty easy to use. It can eat up hard-disk space, because it’s not terribly efficient with your media library. However, it’s a great tool for putting together demo videos or putting together the results of observation research, interview vox pops, etc.

LiveView Screencaster

LiveView Screencaster allows you to send a portion of your computer screen to an iOS device for easy simulation of an app. Can be set so that touches on the iOS device are passed through as mouse clicks on the computer. This means you can prototype in Flash, HTML, clickable PDFs, Keynote (or Powerpoint, if you’re desperate), etc. and “play” it on an iOS device. Needs a normal WiFi connection – HLSU’s set-up doesn’t work, but you can run it by creating your own WiFi network with a laptop. Amazingly, it’s free.

Omnigraffle

Omnigraffle is the best wireframing tool around (although in many cases Keynote will do the job). It allows for sophisticated templating and has a number of other tools for building flowcharts, site maps, and all sorts. I love it because of its smart guides. It’s everything Illustrator fails at being in terms of ease-of-use. There are a bunch of different templates for it over at Graffletopia, which also give you the ability to create interactive wifreframes of iOS, web and other apps. You can export in a wide range of formats, including clickable PDFs (i.e., PDFs that have internal links between pages). The formats include:

• OmniGraffle document — an OmniGraffle document. You can make the file read-only (not editable), and you can choose to include linked images in the file so that they show up properly on someone else’s computer.
• PDF vector image
• TIFF bitmap image — This format supports transparency.
• PNG bitmap image — This format uses lossless compression to retain the details of an image while decreasing its file size. It supports transparency.
• JPEG bitmap image
• EPS vector image
• HTML image map — A hypertext file and a JPEG, PNG, or GIF image. URL actions in the original OmniGraffle document are coded into the image map as links so that the image can be clicked to follow them.
• OmniOutliner 3 — Represent the diagram as a text outline, using the connection lines between shapes to create a hierarchy.
• SVG vector drawing — An open internet standard that uses XML.
• PICT vector image — A legacy Macintosh graphics format.
• Photoshop image — File format for the popular image-editing application.
• BMP bitmap image — A legacy graphics format.
• OmniGraffle Diagram Style, OmniGraffle Template, OmniGraffle Stencil — Resources for OmniGraffle.
• Visio XML document — The XML-based file format for the Microsoft diagramming application.

Wireframing resources online

If you’re really getting into wire framing (this post is really about experience prototyping) then check out Wireframes Magazine (yes, really) and I ♥ wireframes, which has some nice examples.

Hardware Prototyping

Arduino

If you want to get a bit more hardcore and start to put together some interactive hardware prototypes, then you can use the Arduino circuit board that comes in several flavours. It’s pretty inexpensive for what it does and you can create some very cool finished pieces with it (a lot of interactive artworks use them), but it’s great for building a convincing product prototype. It uses a version of the Processing programming language to run it (and Processing itself is worth checking out).

If you want to get started with Arduino, Massimo Banzi’s book Getting Started With Arduino is a good place to, er, get started.

Tom Igoe’s Making Things Talk is good too.

Audio, Interview and Transcription Tools

Skype

Of course everyone knows Skype, the free video chatting application with the worst interface in the world. Now that Microsoft own it, they’re ensuring that the interface and quality only get worse. However, most people have it, so like the wailing horror that is Microsoft Office, its ubiquity trumps quality. Let’s hope Apple’s Facetime (which is also pretty idiosyncratic) helps put a dent in Skype’s world.

Anyway, you can use Skype to prototype all sorts of interactions, such as call-centre experiences, etc. Skype allows you to view other people’s screens or let them view yours (Apple’s iChat and Screen Sharing is better for this, but there are other Remote Desktop Protocol apps that enable control of remote computers too). This means you can also do testing of website mockups, etc. remotely, without having to actually build the website or app.

iChat

iChat is Apple’s video chat application that came before Facetime. It’s quality is much better than Skype, which isn’t difficult to achieve. It also connects nicely to Garageband if you are trying to record conversations, which is easily done in iChat. The downside? Only people (you know, the good-looking ones) with a Mac have it.

Facetime

Facetime is Apple’s newer video chat app that shipped with Lion and is also on iOS, so you can video chat with people on their iPhones and iPads. The quality is pretty good, but most people seem to struggle to get their Apple ID and all that jazz set up. You can’t record calls directly either.

Call Recorder

Ecamm’s Call Recorder is a plug-in for Skype that allows you to easily record audio or video calls on Skype. Of course, the remote site of the call is subject to Skype’s call quality (i.e., not good), but Ecamm also provide some tools to split the saved files into separate tracks, your side of the conversation and the remote side. iChat does this better in conjunction with Garageband, but that’s a very Mac-only and rather heavy-duty setup.

Skype’s lack of quality is fine for research, but pretty awful if you need to present anything or if you’re trying to do an interview that will be a podcast. You can clean up things a bit in applications like Garageband or Sound Studio, but the golden rule is “rubbish in, rubbish out.” It’s impossible to add fidelity that was never there in the first place.

Tip: If you want good quality from both sides, ask the person you are calling to record their side of the call – either with another device and mic, or with Call Recorder or separate audio recording app. You will do the same on your side of the call. Afterwards, ask the interviewee to send you the audio file (or video, but it will be big) or to drop it into a Dropbox folder. Then you can use Garageband, Sound Studio, iMovie or another, more professional tool like Pro Tools, Final Cut, etc. to import the two tracks and export as a single mixed audio/video file. The quality will be high because you’ve got local audio recordings from both sides and not Skype’s munged versions.

Piezo and Fission

Piezo is a little app from Rogue Amoeba that allows you to record any audio source on the Mac. So whatever app you are using for interviews, etc., you can record it. You can also record any other audio streams. Rogue Amoeba also make a nice little audio editing apple called Fission, which is an alternative to Sound Studio.

Sound Studio

Sound Studio is an audio editing application that has pretty good features, but is still pretty simple. If you don’t want to pay for an audio editing app and you are on a Mac, you can always use Garageband, but Garageband isn’t quite so quick and easy.

Garageband

Garageband is Apple’s audio and music recording and creation tool. It’s usually installed on most new Macs and is really intended to create music with, although you can do some audio editing for things like Podcasts in it. It might be useful for preparing some AV material for a prototype or for a slideshow/demo movie, but the real benefit for interviews is that you can use it to record iChat interviews and it records everything automagically across two tracks. This means you can apply filters and effects (useful for dealing with noise and bad connections) on each side of the conversation individually.

F5 Audio Transcription Tool

F5 Audio Transcription Tool is a free tool for Mac and Windows that can load a media file (audio, video) into a basic text editor. Here you also have keyboard shortcuts to start/stop the playback, adjust the speed, skip back or forth a number of seconds and add timestamps into your transcriptions. You can even add a USB foot pedal if you really want to go for it.

Books

Sketching User Experiences

Sketching User Experiences: Getting the Design Right and the Right Design by Bill Buxton is considered a classic, although it’s not that old (2007). I don’t know where my copy is anymore, but here are the key points of what it contains from the Amazon.com blurb:

• Covers sketching and early prototyping design methods suitable for dynamic product capabilities: cell phones that communicate with each other and other embedded systems, “smart” appliances, and things you only imagine in your dreams;

• Thorough coverage of the design sketching method which helps easily build experience prototypes-without the effort of engineering prototypes which are difficult to abandon;

• Reaches out to a range of designers, including user interface designers, industrial designers, software engineers, usability engineers, product managers, and others;

• Full of case studies, examples, exercises, and projects, and access to video clips that demonstrate the principles and methods.

Prototyping – A practitioner’s guide

Prototyping – A practitioner’s guide by Todd Zaki Warfel does what it says on the cover. It’s a guide for creating (mainly) Web and screen-based interaction design prototypes. The tools and techniques will serve you well for many situations and Todd goes into more depth about the ones I’ve described above. It gets my vote for including “flat dental tape” in his suggestions for paper prototyping.

Possibly related posts:

1. Does Your Research Exist? Does Your Research Exist? Another great list of tips from...
2. Design Research – A Failure of Imagination? Have design education and design research failed to fire up...
3. Design research: sorting your shoe walking from your talk talking « Design research: sorting your shoe walking from your talk talking...

We live in a culture that encourages envy. Envy for products we don’t own, lifestyles we don’t have, happiness we believe others have. Growing up means living with the realisation that everyone is making it up as they go along. Your parents and teachers didn’t know better after all. For some that is a relief, for others a scary disappointment.

The truth is that each of our lives are unique. Each of our lives is a prototype and the mantra of prototyping is fail early and often.

The older I get, the harder I find it to overcome the fear of failure that stands in the way of change. Children, a home, responsibilities, outgoings, habit and just plain fear each all present very compelling reasons for not making changes. I envy my students’ years ahead of them and their current lack of many of these responsibilities. But they are often are paralysed by one big one: coming up with The Big Project Idea that will best prepare them for an uncertain future.

The answer is that there is no big idea to be chosen, just the process of hammering an average idea into a great one. That experience is the best preparation for the future.

Hankering after an ideal of perfection is exhausting and soul-destroying. Treat your life as a never-ending prototype. Get into the habit of failing early and often. It only becomes harder later and that’s exactly the time when you need it most of all.

Possibly related posts:

1. Photo check deposits fail from Chase Mobile App Photo check deposits fail from Chase Mobile App – Marco...
2. What matters in life What matters in life . Marco comments on Jeff Atwood...

1. Sign up for a new mobile/cable/insurance, etc. package – often you create a contract on the phone
2. Receive a 10-page contract in the mail, put all the papers in a folder somewhere and forget the dates
3. Have some problem with your service, decide you don’t like your service provider and decide you want to change
4. Find out that your contract has automatically been extended and hate them even more, swearing you’ll never miss the date again
5. Immediately write a letter quitting your contract for the next year

The thinking behind this is that companies can simply rely on most people to keep forgetting and lock them in. Sometimes this means they’re locked into old plans or tariffs too, which can be more expensive. Companies try to claim that they’re providing a helpful service by automatically extended the customers contract so that they’re always covered or connected, but of course they could still do this and let people quit with just, say, a month’s notice once they are past the official end of their contract.

All in all it leaves a sour taste in the mouth and, as a customer, you pretty much hate any service provider who tricks you with this and you swear never to do business with them again. The problem is, they all do it, so there’s not much chance to avoid it.

Signing the divorce papers on your honeymoon

What some people do is to quit their contract in writing immediately after signing their contract, so they don’t forget. You can always retract it later if you are happy with the service.

Let’s just recap on that and frame it in terms of a relationship commitment, like a marriage, which it is. This is akin either to a pre-nuptual or, worse, signing divorce papers and filing them away somewhere on the first day of your honeymoon, just in case it goes pear-shaped later. It’s not a recipe for a mutually beneficial and trusting relationship.

There is an enormous service opportunity for companies who decide not to do this, providing they can get it past blinkered management. Nobody wants to be locked in to a service, because everyone knows they have no power as a customer because they can’t go anywhere else and the company has no incentive to improve their service. In the mobile phone industry, the focus is still on customer acquisition instead of retention, though there are some signs that this is changing.

One company’s junk service is another company’s gold

Interestingly, a side-service industry has sprung up helping people to quit their contracts (Carphone Warehouse were the first company to do this back in the early days of mobile contracts in the 90s). In Germany there is a service called Aboalarm – Abo is short for Abonnement or subscription. They have both a website and an iOS app that has the customer service details of almost every service provider. You can go online and use one of the templates or simply use the app.

You put in your details, sign it with your finger and they fax it off for you. This is either free when hooked into some kind of social media recommendation or 79c. The app also allows you to set alarms when you first create a contract that goes into your calendar with a reminder a few days before the Kündigungsfrist, so you never forget.

The service design lesson here? Apart from the obvious one of not shackling your customers, it is possible make plenty of money providing ways around other companies’ lack of service.

Breakfast on the German ICE train

While there are a few things not to like about German trains – officious staff, annoyingly slow ticket machines – it’s small beer (especially when compared to Germany’s beers).

This is the view of my breakfast on the Inter-City Express train to Switzerland that I have to take to work on many mornings. I normally grab something in Basel on the way and today was a luxury, although at 8.20 euros, including table service, it’s not much different to what I pay on-the-hoof in Switzerland. It made dragging myself out of bed at 5.40 AM more bearable.

Comfortable seats, proper tables setting, linen tablecloth, waitress. All remnants of a bygone age for trains in many other countries. This isn’t First Class either – there they bring you the food to your seat so you don’t have to even move your executive arse. It is the restaurant car for normal mortals.

The ICE trains in Germany are clean, quiet, punctual, well-equipped (each seat has a power outlet) and, well, relatively expensive too. My half-price ticket from Offenburg to Luzern and back is around 59 Euros (to give you an idea, that’s about 230km one way). But most commuters have a BahnCard, which gives 25, 50 or 100% off ticket prices and pays for itself pretty quickly. If you’ve paid for a BahnCard 100, it also has the effect of time-shifting the pain of payment. It’s like an all-you-can-eat buffet – you paid up front, so you take the train as much as you can instead of the car. On the other had, if I drive I pay about the same in fuel.

It should be obvious why all this matters. It makes train travel a pleasure rather than a hectic, sweaty, cramped horror, which is my memory of train travel in the UK. This matters not just for my personal comfort, but because it shifts behaviour. Taking the train is a far better and more pleasant alternative than driving. The car becomes second or third choice, not the default, which is just how it needs to be.

Possibly related posts:

1. Touchpoint Observatory: Armed Ticket Collectors These people – five in total – were ticket inspectors...
2. Touchpoint Observatory: Send your post from the restaurant This restaurant in Freiburg, Germany, called Omas Küche (Grandma’s Kitchen)...
3. Touchpoint Observatory: UK Lift Engineer Bodge Job This lovely piece of work is in a multistory car...

Kickstarter, Pitchforks and Torches – the latest update from Casey Hopkins’s Elevation Dock Kickstarter project has a priceless paragraph about the responsibility of having such a successful project:

You do not know stress until you have a successful KS project. I have had these recurring dreams of the whole internet outside my apartment with pitchforks and torches if we shipped late or the parts were crappy. And everything is magnified – any hiccups cause world-ending lows; when things go right, it’s mass euphoria. The Gantt chart I made pre-Kickstarter had a solid 4 week buffer if anything like this had to be re-tooled or changed. At this bigger than expected scale, each of the dependent steps takes longer, so that buffer time goes away and any modifications affect ship time. Looking forward to my first solid night of sleep in 4 months when we can get that first Dock out the door.

Ouch.

Photo: Gabriel de Urioste

What a sad thing to hear. The very brilliant and lovely Hillman Curtis died on the 17th April at the too-young age of 51. I watched Hillman completely shape the way many designers were thinking about Flash in the early days of Flash on the web and inspire many to get into the profession. Yet, of all the big design stars from those days, he was the least star-like person you could imagine.

I had the pleasure of getting to know Hillman at Flash on the Beach a few years ago where he hung out pretty quietly with his son Jasper – one of the coolest little kids around. Seeing Hillman speak at those kinds of events was always a treat and a break from the noisy braggadocio that sometimes defines design and creative conferences. His work was wonderful, but he spoke about it in a quiet, contemplative way that had the audience leaning forward, straining to catch the soft words of wisdom. I have no idea if he had any kind of religious beliefs or practices, but he was perhaps the most Zen creative person I have ever met. Despite his achievements, there seemed to be no trace of ego about him at all and he always had a sense of calm in the midst of chaos.

A couple of years later, I interviewed him for Desktop and, as ever, he was always interesting, always gracious and, above all, always interested. Nobody deserves to die at 51, nor of such a shitty disease as cancer, but in Hillman’s case, it feels particularly unfair. My thoughts are with his family and friends who must miss their everyday contact with such a lovely human enormously.

Bye Hillman, knowing you, even just a little, has been a privilege.

All companies are going to become software companies. Jon Kolko trying out some provocative thoughts. Obviously the idea that all products are services appeals to me, but the point is that these kinds of thought experiments force you into the “if this, then…” mode of inquiry, the perfect accompaniment to “what if?” What is clear is that design and the role of designers has radically changed. The question is, has design education?

Possibly related posts:

1. Does Your Research Exist? Does Your Research Exist? Another great list of tips from...