20three

Sketchbook pages: 02.2012

Owen — Fri, 03 Feb 2012 14:41:46 +0000

Some recent scans of my sketchbook.

Metaphors & skeuomorphs in touchscreen UI design

Owen — Mon, 30 Jan 2012 15:21:06 +0000

Skeuomorph:
(Greek: skeuos—vessel or tool, morphe—shape), is a derivative object that retains ornamental design cues to a structure that was necessary in the original. Skeuomorphs may be deliberately employed to make the new look comfortably old and familiar.

There is no question that Android interface design has caught up with Apple IOS in terms of delivering a premium user experience, and with the release of Android 4 (or Ice Cream Sandwich) it appears that two opposing philosophies are emerging in mobile UI design.

An interview at fastcodesign.com with Android UX Design Chief Matias Duarte makes interesting reading. Duarte’s design thinking seems to be opposite of Apple’s – while Apple go for a skeuomorphic design heavy on using metaphors, Duarte opts for the opposite. His rational (and I’m para-phrasing here, you can check out his interview here) is that people don’t care for real looking buttons or metaphors – they are a hang up of a 30 year old computer interface design, and over-designed buttons with a 3D effect look great on their own but overwhelming when all put together. In his words: “…when you assemble the individual elements on a screen, each one becomes prominent on its own… Each is very pretty, but when you try to make a wall or a house out of them, all the embellishments fight with the larger building.”

In the fastcodesign.com interview with Duarte, references to Android’s new UI design being ‘like a magazine’ crop up rather a lot – although never directly attributed to Duarte as far as I can tell, the magazine as UI metaphor gets mentioned a few times – on the surface this seems at odds with his design thinking, as a magazine inspired layout, complete with turning pages, is of course… a metaphor. Magazines have been around a lot longer than computer interfaces, and can hardly be called a current and modern interaction model.

And then there is that problem of the ‘Pictures Under Glass’ technology, a phrase nicked from the very insightful Bret Victor. In this great blog post, Victor rants (his word) that “Pictures Under Glass is an interaction paradigm of permanent numbness.” – we can’t ‘feel’ the pages of a magazine through the interface of a touch screen device. Using ‘real’ objects as interactive elements within an interface helps a little with this problem – buttons under the glass of a touch screen will never be tactile, but they can have the appearance of being tactile, which can only help.

I am not a huge fan of using metaphors but I often find myself encouraging their use. I have found them useful for quickly communicating functionality – the one great advantage of using metaphors and skeuomorphic design is that you already know how something is going to work – if there is a dial, I know that I have to turn up or down. A toggle? I can toggle it. The big downside is that we tie ourselves to the limitations of the objects we are basing our metaphors on, we lose the chance to innovate or create new methods of interaction.

I would like to think that the average smart phone user is capable of learning new interactive conventions and can get by without the blatant signposting of metaphors, and that decent UI design can be accomplished with new interaction conventions; but to make sure a UI is understandable quickly, without instruction and by a broad demographic I will choose a metaphor. This piece of advice I have lifted from http://developer.android.com sums it up: “Real objects are more fun than buttons and menus: Allow people to directly touch and manipulate objects in your app. It reduces the cognitive effort needed to perform a task while making it more emotionally satisfying.”

Android 4 is promising a much more refined and improved user experience. As more people upgrade and as Android’s market penetration continues to grow it will be interesting to see how Apple reacts.

West Sussex Literary Trail

Owen — Tue, 15 Nov 2011 12:06:13 +0000

Last month, while the weather was still bright and sunny, we had a days walking and one nights camping along the West Sussex Literary Trail. We met at Christ’s Church railway station and walked along the trail till we got to Amberly, were we set up camp for the night. The days walk was about 15 miles and we had the customary late pub lunch at the White Horse Inn in Pulborough along the way…

…

Photos above taken with a Pentax K1000 using 400 ISO Fujifilm. The pic below taken on a HTC mobile.

The campsite near Amberly:

…

op / gh / dl

Perry :: sweet pears and their lovely juice.

Mon, 26 Sep 2011 09:05:48 +0000

It’s that time of year again. It’s pressing time! And this year I had the great fortune to be given a crop of perry pears.

Last year I bought a workshop press with a 12 tonne hydrolic bottle jack to use as a press for making cider. I managed to make some ok cider, and it gave me more confidence to experiment this year. As said, I have been given some lovely perry pears (variety unknown). So over the weekend I embarked on pressing them to get the lovely juice out.

The process of pressing I find incredibly enjoyable. It involves firstly sorting the pears and disgarding any that are way beyond their best; washing them; mashing them; then pressing them. Below shows the set up I have.

Once the pessing starts the juice collects in the plastic tray at the bottom.

I’ve managed to get around 4 gallons of juice, which when measured had a gravity of 1.065 which works out to be a potential alcohol content of around 8% if the fermentation process is allowed to run its course, and no additional sugar is added. I plan to allow this perry to be as natural as possible, so I will be relying on natural yeast rather than adding any years to the juice. When I’ve done this in the past with cider I’ve had a good result. I don’t wish to have a perry that is 8% as that would mean all the natural sugars have been converted into alcohol, and I’d like some sweetness to the flavour. So I will more than likely bottle early on and allow but will allow fermentation to continue in the bottle, which will give the perry a fizz!

Above is the perry. There is a weeks difference between the two on the left and on the right. As can be seen the colouration changes as the sediment drops to the bottom. Once the fermentation has got to the stage I am happy with I will syphon off the perry and put into smaller bottles.

I’ll report back once the whole process has had time to do it’s thing!

No related posts.

Design process for mobile devices: Part 1

Owen — Tue, 06 Sep 2011 18:46:55 +0000

At Kerb, the digital agency I work for, we have been doing a lot of mobile work. Most recently we have been commissioned by a large multi-national entertainment brand to produce a multi-lingual ‘match 3′ type game that has to be ported across 33 Android devices and the iphone 4 and iphone 3Gs.

As there is currently no standardized methodology for designing across multiple mobile devices (an assumption based on our own research that was confirmed by various speakers at this years dConstruct conference) I thought I would post up some of our design processes.

This first post is about our initial reaction to the task of converting art and design assets for use on multiple mobile devices.

As is with many projects, time-lines were challenging and we had to get a working version on one particular Android device before we ported the game to the other devices – so we went ahead with the one Android version of the game before we went to work porting the game to other handsets.

The challenge for the design team is to take an existing game that has been designed for one particular handset and then make that design look intentional and considered across 33 other devices which all have different screen dimensions and resolutions.

Now, I must point out that I am not talking about amending the functionality of the game to fit with the functionality of different handsets – I am talking about the graphical aspects, the visual language, and in particular how the interface and art assets would scale to fit different aspect ratios. Our overall user experience, in terms of user interaction, is the same across all the devices.

This process is also particular to our game, other apps and games would not necessarily have the same process; our game is a visually rich experience with lots of animation and illustration all based on our clients IP. Visually simple games and apps would not need the same approach.

So, our initial challenge was to simplify the information we had about the different handsets, and then re-present this information to the design team. This information will help us create a clear strategy for amending our art and design assets with the least amount of impact on time and budget.

We simplified the mobile phone specifications with three simple steps.

1.
Firstly we grouped our device list into their respective screen dimensions. We did not worry about screen resolution at this point as we would deal with resolution as part of the export process (a process I will talk about in a later post).

This grouping helps simplify the list, we can quickly see that there are four different screen dimensions from a list of 33 devices – which means we have four different aspect ratios to consider.

2.
Our first comparison of screen sizes – by anchoring the different screens top left we can see the differences in the aspect ratios and how they will impact our design. We have rich illustrated backgrounds to our game levels – What will be the simplest way to amend our assets to fit these different aspect ratios? Can we keep a consistent grid?

3.
Our next comparison of screen sizes gives us the solution. By giving the four different aspect ratios the same fixed height and aligning the screens on a central vertical axis we can further simplify the amends we have to make – we can now see that the differences in the screens can be restricted to width, and the amends to the relationship of elements within the design (art assets and UI) can be restricted to the vertical edges of the device screen. We are now in a position to make decisions on whether to apply a fixed or a relative structure to our design.

By presenting the information in this way solutions arise, and complex looking tasks appear much simpler and far less daunting.

The next step in our process is the physical amending of the art and design assets and their export to sprite sheets and mobile-ready assets, which we do with both off-the-shelf software and bespoke components we write internally. I will write up these next steps in another post with the help of Kerb’s Technical Director, Pete Hobson.

…And for any Brighton/Sussex based developers, Pete is doing a talk at DotBrighton about developing for mobile on the 28th of September.

Dan Drakeford: new ‘Now In Lemon’ Illustrations

Owen — Thu, 01 Sep 2011 09:27:13 +0000

As well as contributing to the Now In Lemon ‘zine, Mr Drakeford has also updated the Now In Lemon site with a load of new work. I have posted a favourite of mine below but please take a look at the rest of his work – his ‘The Park‘ strip is definitely worth checking out.

Designers Don’t Have Influences: Austin Howe

Owen — Fri, 26 Aug 2011 09:08:40 +0000

I had better start by owning up to not having read Designers Don’t Read by Howe – I had seen lots of press for it but never got round to picking up a copy. So I have come to his second book without reading the first, but Designers Don’t Have Influences (Amazon US|CA|UK|DE) is stand-alone and can be picked up without any prior knowledge of Howe or his writing.

Designers Don’t Have Influences is a collection of short essays on people that have influenced Howe throughout his successful career in advertising. Rather than write about people working directly in his field Howe writes about all sorts of people from various disciplines. He writes in the forward:

“My basic premise is that we can often learn more from people in other disciplines than we can from our own”

This really resonated with me. As a designer my own influences are often from beyond my profession and can be divorced from their context. Howe’s introduction had already got me excited about reading on.

“Disclaimer: this book is not an exhaustive compendium of every notable author or artist or inventor or entrepreneur. It’s really more of a random collection of individuals who have impacted me in some way – people I think most designers would probably appreciate knowing a little more about.”

There are no work samples in the book – Howe explains that Designers Don’t Have Influences follows in the “spirit and tradition of Norman Potter’s little gem, What is a designer: Things, Places, Messages” (a book I would also recommend, Potter is a great influence on me). Howe also explains that he wanted to dismiss the idea that designers don’t read – hence the title of his first book.

Each chapter in Designers Don’t Have Influences is a self contained essay. At the start of each chapter is the estimated time it will take to read it – I loved this element (one he uses in Designers Don’t Read), as I could pick up the book in my lunch time, waiting for a tube, sitting on Brighton beach, and flick to a chapter which I knew I would be able to read in the time I had. I felt I was carrying round a bunch of observations and ideas I could dip into rather than a book I would have to read from page one onwards. Each chapter has a little nugget of Howe thinking, seemingly designed to make you think a little, question a little and maybe re-evaluate your position and approach to your design work.

Some of the chapters are simply Howe’s observations of the experiences of working with others in and around his industry – the chapter on Bill Cahan gives a great insight into the processes of an innovative and successful design agency and those that run it. Many of Howe’s other subjects will be familiar to designers, the ubiquitous Ayn Rand gets a chapter, as do the Saatchis, Julian Schnabel, Josef Müller-Brockman and Damien Hirst, but it is the people I had never heard of that interested me the most – a great example is the chapter on François Allaire, a Canadian Hockey goalie coach. As a Yorkshireman who grew up with only a passing interest in football (my trips to Elland Road were on the whim of friends, I was never a committed football fan), there was no way I was going to have heard of a Canadian Hockey coach. Within this chapter Howe explains how Allaire re-invented goalie coaching from the ground up, and coached some of the most successful goalies in Hockey history. Howe writes about how Allaire can be an influence to someone working in the field of design:

“First of all he teaches us that it can be done, wherever and whenever it is actually attempted. That by questioning the conventions of how something has been done for years, we can find new ways of approaching it, simply by being aware, observant, ambitious.”

At the back of the book, once the essays are over, there’s a collection of doodle style portraits of the chapters subjects (along side a quote), credited to Aaron James. – my favourite is the starey scary disembodied Damien Hirst, but Maurice Saatchi’s portrait is worth a mention. I also liked the book design and typography credited to Fredrik Averin – a seemingly modernist design subverted with bold lines striking through the words, a treatment carried through from the cover to the chapters headings.

Maurice Saatchi

The best accolade I can give this book is that I already have bought his first book on the back of this one – and I will be keeping an eye on out for further publications and writing by Howe.

This review also features on The Designer’s Review of Books.

Now in Lemon: lo-fi art & illustration

Owen — Mon, 01 Aug 2011 18:33:03 +0000

Now In Lemon is a 40 page black and white zine produced by Dan Drakeford and myself. I won’t try to describe it, you can see it all here.

Available for the majestic price of £3.00 plus postage at the Now in Lemon website.

Now in Lemon was printed by those nice people at Footprint Workers co-operative.

Beware the cloud!

Wed, 01 Jun 2011 08:52:23 +0000

The Cloud – the latest buzz word in technology circles. What does it really mean? Well essentially it means remote storage and using the “internet” as a means to run applications, using your computer – and quite often – a web browser as a means to run these applications. With the rise in mobile devices, this all seems like a logical thing to do. Keep your data in one central place so that you can retrieve it where ever you are. This is very similar to the old mainframe model that was used in the past, with a users having a dumb terminal and all data and applications running off of a central computer. The difference being that these days the device you connect to the “cloud” isn’t as dumb.

At first I felt that the concept was quite interesting, although straight away I realised it’s similarities with the old mainframe / dumb terminal way of thinking. But over the last year or so of thinking about it, I’ve come to the conclusion that it’s some what sinister from a privacy / personal level. Personally the hardware is not what I feel is important when it comes to computing. It’s the tool for me to do my work, and create. The real important aspect is the Data. As such I feel it’s important that I have full control over my data, and that I don’t hand over my rights to a third party company. From a legal point of view you get into situations where a government agency (the Police for example) would need a search warrant to obtain your data if on your personal computer, but if your data is held on a server owned by a third party organisation then it might be the case that due to legislation and company policy you find that your data is no longer protected by such a basic right.

I feel that slowly people are allowing their personal data and personal lives to become open to all levels of intrusion. A lot of it seems innocent at first, but when you start to look at incidents such as that of the iPhone logging location data (with out the user knowing) and then ponder the usages of this data (which would most probably be for marketing reasons), I have to start to become more wary of what I allow to be stored, and by whom.

On a separate level, a lot of Cloud computing concepts also go against the Free Software Definition. This is due to the fact that the applications that you are using are not running on your machine (as it were) and you are unable to see exactly what is going on with regards to the programming. Many online apps (Google Docs for example) are free to use, but they are not FREE. Also you are overly relying on the services of a third party, and if those services for what ever reason is not available then you are no longer able to continue using it.

I am all for technological advancement, but I have always felt that technology should be there to empower us as individuals and groups. It should be there so we are able to use it as we please, and use it for a positive reason. I find the continued expansion of the “cloud” as a means to lock people into services, and essentially hold their data to ransom. A careful look at all terms and conditions is important when using these services, as it’s not uncommon to find that the data you presume is yours, when stored on these third party servers, actually becomes someone else.

Not all clouds have a silver lining.

No related posts.

Tankboys: Manifesto project 2010

Owen — Fri, 20 May 2011 15:26:08 +0000

Tankboys are an independent design studio based in Venice. I recently got hold of their book: Manifesto. Information about this project from their site:

To say that the end result is what counts is just not true. Especially in design. Rather, a good designer is more concerned with the process; that winding, potholed road he embarks upon every time he gets a new job.

“Manifesto.” is an ongoing project that leaves the final result to one side so as to focus on the creative process. It brings together under one roof the personal manifestos of some of today’s smartest and most renowned international designers.

Whilst some of these statements are very well known, others have been prepared exclusively for the project: some are programmatic pieces of writing, some are detailed work manuals, all are passionate tributes to graphic design, creativity and the design culture.

Reading these manifestos without the authors work shown alongside is an interesting set up as the reality of the finished product does not interfere with the readers interpretation of the words and ideas. Although I am aware of many of the designers work it was still novel to read the words and not see the work – the ideas on process and ‘design philosophy’ can then be taken at their face value and I can imagine more easily applying those ideas to my own work and design processes.

Going back about seven years, when 20three was a working studio, I toyed with the idea of writing a manifesto, or a statement of intent. It never materialized and looking back I think I was lacking the clarity of purpose that is needed to put such concise thoughts to paper. Reading these collected manifestos is inspiring and has given me the motivation to look again at seeing if I can sum up my own design philosophy in a short manifesto.

I wanted to re-produce a couple of the manifestos so readers of this blog get a taste of the book – there are a few I could have chosen but The cult of Done by Bre Pettis and Kio Stark is definitely one of my favorites, possibly as it made me smile the most.

The cult of Done Manifesto

01 There are three states of being. Not knowing, action and completion.

02 Accept that everything is a draft. It helps to get done.

03 There is no editing stage.

04 Pretending you know what you’re doing is almost the same as knowing what you are doing, so just accept that you know what you’re doing even if you don’t and do it.

05 Banish procrastination. If you wait more than a week to get an idea done, abandon it.

06 The point of being done is not to finish but to get other things done.

07 Once you’re done you can throw it away.

08 Laugh at perfection. It’s boring and keeps you from being done.

09 People without dirty hands are wrong. Doing something makes you right.

10 Failure counts as done. So do mistakes.

11 Destruction is a variant of done.

12 If you have an idea and publish it on the internet, that counts as a ghost of done.

13 Done is the engine of more.

Although the book is now sold out, you can read the manifesto’s here: http://www.manifestoproject.it