Intranets2013 – UX Sketchnoting

I was really pleased to be able to stick around for day 3 of Intranets2013 and participate in a workshop on UX Sketchnoting run by the talented Matthew Magain of UX Mastery.

I first encountered Matthew at UX Australia last year when he shared his clever whiteboard piece What the #$%@ is UX Design?. You may know him from his more recent work on The Federal Budget in 3 minutes. I was lucky enough to get a taste of Matt’s workshop through the Intranet Leadership forum in April when I had a crack at sketchnoting Simon Sinek’s TED on How great leaders inspire action. I was pretty proud of my first attempt and keen to learn more and tap into my neglected creativity.

For the uninitiated, sketchnoting is basically taking notes using a combination of pictures and words. Matt started out he workshop by taking us through the basics of drawing, typography and design principles. Matt told us about Dual Coding theory which was developed in the 70s and says that tools like sketchnoting and storyboarding can be more effective as they engage the brain on both a visual and a verbal level.

I thoroughly enjoyed being able to work the drawing muscles that I had not flexed for a long time. I have been taking my notes on the iPad for a few years now and often miss paper where I can get more freehand and doodle alongside my notes. I also love the idea that I can incorporate something I had previously enjoyed as a pastime in my intranet work.

After getting through the basics of playing with words, objects and faces we worked on UX techniques like UI flows, wireframing, design critiquing, empathy mapping, graphic organisers, storyboarding and sketchnoting.

Using a scenario that Matt had put together we wrote a UI flow and then wireframed the user interface freehand. I have wireframed before in Visio and PowerPoint (*shudder*) but only a little in freehand. The idea was to do a few iterations of the wireframe before getting to the final one. I only got through two as I was being a little too detailed but I enjoyed the process of critiquing my design with the group. It was less of a critique and more of a collaborative session that improved on the design and cut out features that would not work. I can certainly see the value in using a sketched wireframe rather than a polished Visio or PowerPoint one, it shows the audience that the work is in draft. It can still be manipulated and it is okay if it doesn’t resemble the final product.

I found the storyboarding session the most interesting as it is something I have always wanted to do but was never sure where to start. We began with an empathy map (using a hospital Nurse) and then worked on a graphic organiser to flesh out the objective, audience and solution for our story. After that I quickly drafted my plot and then put it into the storyboard boxes. Having a process to follow removed the intimidation and this is a technique I will definitely use again and am pleased to be able to add to my skill-set. What a great tool to be able to quickly demonstrate the ‘Why?’ to leaders, managers or users.

We wrapped up the session with sketchnoting. I loved the opportunity back in April and was planning on sketchnoting a keynote at the conference but a combination of time, self-doubt and a phone meeting meant I didn’t quite get to it. Luckily the workshop meant I could have another crack and improve on what I had done last time. Having had a go before I decided to choose  a column layout, rather than a path, the path didn’t work for me last time and the columns made it easier to pace. Before we watched the video I started with a title and caricature of the presenter as Matt suggested. We were sketchnoting Dave Eggers TED Talk Once upon a school and the 20 minutes flew as I listened intently to the TED, picking out key points and either drawing or using typography to illustrate what was happening. I am very pleased with the result of this attempt as I can already see an improvement on last time. I think I still need to work on my typography and using borders more to feature quotes and key information, but I can work on that next time.

So what did I get out of this workshop? From a professional perspective I have picked up a big handful of really handy UX skills that I know I can go back to the office and apply to current and future projects. I am already thinking of a few ways I could possibly use storyboarding in our current intranet project. On a personal level I have been able to pick up an Artliner and Copic and actually draw something, which I have been intending to do for years now. I said to Matt I found it difficult to work in inks because I would be frustrated by the permanency, I could not fix errors and mistakes… but I focused on that in the workshop and feel much better about working in the medium.

If you happened to be looking at a workshop like this and thought it looked like too much fun to be of practical use, I hope this post changed your mind. Thanks Matt for a great workshop, I look forward to sharing more of my Artline adventures on this blog.

Postscript

For more Intranets2013 action have a look at:

• Sam Marshall’s live blog of Day 1 and  Day 2 
• Intranets2013 by Jakkii Musgrave on Storify.
• Andrew Wright’s Intranets 2013: my top 10 take-aways.
• Jonathan Phillips’ conference review on Intranetizen.
• Presentations from Intranets2013.