Designing for the iPad is hard, let's go shopping

Like many developers I know, I believe in the iPad. I believe that's going to be a great platform for some kinds of uses. Not everyday coding in XCode or Coda, not editing text with Latex, TextMate or another powerful text editor. No, a more casual kind of use. So I have a project I want to do on the iPad which I think could be both fun and successful. I' ll let you know later what this project is about. What I' m about to talk about today is the critical part of the project: design. You know what they say. In most environments, you want to spend 10% of your project time on design the User Interface (UI) or the User eXperience (UX). Like an afterthought. On the Cocoa Touch platforms, you have to spend over 60% of your time on that part of the whole project. That's what I do: before getting really involved in the project, I checked that I could work with a graphic designer to exchange thoughts, detail behaviors, ideas, etc. I'm still the project manager and creator. She gets to play the hard part of being candid about the project. I made sure she knew well the products on the Cocoa Touch platforms that have reached the level of UI and nice design that I hope to find in my products. I made a list of apps to buy and use, another list of apps to look at. I made sure she got to read the Human Interface Guidelines, and saw the great videos by Apple. But know comes the hard part: putting the ideas into perspective and moving on from a "application statement" to real screens. And this I am the only one who can do it. Over the months, I have become quite confident over my ability to do it on the iPhone. My products have not yet reached the level of candy I would hope, but their structure is now well balanced, clean, lean, and I 'get' the device. I have started with all the stencils you could find, and still use some. But for the most part I have a moleskine notebook (before) or a Field Notes notebook. And a pencil: a 0.9mm mitsubishi uni. Allows me to write down the different screens of an app quickly wherever I am, even on a sunday night at 2:00 am. I know the iPhone UI at my disposal, and the screen is the right size for a notebook. I also use the Sketch book I bought on Amazon several months ago, when I need to explain the UI to someone else. I have plenty of room around the UI to describe the UX. Then I make photos and send them over. But the iPad is HUGE… At first, I used the stencil made by Andy Warwick which he showed as a mockup during the most excellent NSConference UK 2010. I made myself the same mockup to try to get a feel of the beast. image\ _Matt Gemmell holding Andy's mockup_ Because it is big, and small at the same time. And the Simulator doesn't reflect exactly the size of the stuff. Like for the iPhone and the simulator: the density of the screen is not the same on a Mac and an iPad, so the beast appears bigger on a Mac screen. Like Andy, I taped my cardboards to have a nice back. But I was quite unhappy with it because the damn thing wouldn't work. Nothing on the screen ever. And it didn't help me design anything. I discovered several notepads or stencils for the iPad. I have ordered the stencil from Design Commission, and the notepod. But deliveries from Australia to France are a bit slow. So this saturday I took the opportunity of some errands to get into a graphic shop, and bought myself a cutting mat, a cardboard, a pvc sheet and some transparent drawing paper (papier calque). I used the pvc sheet for my mockup and now I have a 'glass screen'. I can put things under that glass screen (it 's more comfortable and less dangerous than the one nikf did too). And I cut my cardboard sheet to make myself two small iPads. The screen itself seems to be 20cmx15cm, if you wanna know. the other specs are on Apple's website. On these cardboard, recto-verso, I made the lines of the status bar, made some lines too for popovers, split views etc. I used screenshots I made from the Simulator to reproduce as well as I could the size, position etc. I can now use my drawing paper like a (last century's) cartoon drawer would do: I add levels of UI to my basic view, and put everything in the iPad mockup to 'feel' how it is. Having all these tools and these limits to the UI I want and I know I can make helped me get over the white sheet problem, and I started really designing something real which I can 'test'. Total cost must've been over 40 euros, but I have many stencils now ;-) I even did some more for my iPhone stuff. Here are some pictures: IMG_4727IMG_4725IMG_4723IMG_4720IMG_4718IMG_4715 I am not totally bad at using my hands, but I am no wizard too, so if I did you can probably do it too.

Publié le 28 Feb 2010
Écrit par Cyril