How I Design for iOS

iphoneBlog

As a developer, designing is a big challenge. My process is a lot different than “normal designers”. I design much like I code: trial and error.

When I’m programming, it’s constantly running the tests to see what failed, trying a fix, and then repeating. It’s finding a bug, trying a fix, and repeating. You get the idea. That’s how I work. It’s constantly iterating on ideas to see if they work.

When I was first starting out, I’d find myself reading entire source files to try to understand everything that was happening and only running the code very rarely. It’s no surprise that were lots of bugs in my code. Letting the computer do the work for you is the whole point, so it’s a good idea to let the computer help you out.

So, here is a look at how I design.

Sketching

Sometimes I start by sketching on paper or on an iPad. I only do this if I have no idea what I’m trying to do. If I can’t picture what I’m trying to make in my head, I sketch. There’s something about sketching that really helps me visualize the end result. Scribbling down idea after idea is where most of the actual “designing” takes place for me.

Again, it’s an iterative process.

So once I have a rough idea of the structure and layout, I jump into code. I don’t use Interface Builder at all (on iOS anyway—Mac is a different story). I haven’t used Interface Builder since my very first application (unless it was removing other people’s NIBs). We’ll save the why for another article.

Prototype Early

On iOS, it’s so easy to just get something you can use. Just throw together some UINavigationControllers, etc. A lot of developers confuse “design” with “visual design.” They think it’s only pretty pixels. The flow is the most important part. If your app is super pretty but no one can use it, it’s pretty useless.

I like to just get something I can use on my phone with all system controls. If things feel good, then I move onto designing at the pixel level. Most of the time, my first take is terrible and I go back to sketching. Again, I look to iterate.

Pixel Time

For pixels, I work the same way. Once I have the layout, it dictates what needs some extra love. If I can’t picture what I’m doing, I’ll open Photoshop and mess around until I see something I like. A lot of the time, I don’t save my PSDs. They are just pixel sketches. Once I know what I’m doing, I start implementing in code.

I often try to implement as much as I can in code instead of using images, but sometimes it’s a lot easier to just use an image asset. I have an “asset farm” PSD with all of the assets I need. I keep this one around for when I inevitably need to change something.

Go

So there’s no secret to getting into design. Just do it. Go get a piece of paper and start scribbling down your ideas. If you want to get better as a designer, go browse Dribbble or the App Store for inspiration. All you need is inspiration, iteration and to start.

Sam Soffes

Sam Soffes is an iOS and Ruby Developer. He is the co-creator of Roon and the VP of Engineering at Seesaw. Follow him on Twitter: @soffes.

Comments

11 comments on “How I Design for iOS

  1. Sam, you are one of the people in the industry that I truly look up to, for a few reasons: being down to earth, and you were a person that learned Ruby just to be able to make something that was an idea in your head.
    I like how you pointed out that design isn’t just pretty pixels, but being able to flow. Like Mihaly, or perhaps KRS-One.
    I guess there is no real secret except to start, and to not fall in love with any design if tests say something else works better. Mad respect.

  2. Same here, except I use Fireworks instead of Photoshop and I research on Pintest to get some ideas.

    • Good stuff. The tools don’t matter that much. I find Fireworks’ color picker maddening, so I still use Photoshop. I like the idea of everything being vector though. Sketch is also really neat. I’m really slow in it though.

  3. Oh yeah design is just that easy. Never mind my 4 year degree in Interaction and Communication design, anyone can do it rignt. #LOL to this post.

    • Well you could easily be a good programmer without any degree, look at Sam. Same thing goes for Design. A big part of it is actually something learnable. You don’t necessarily need an instructor for this. A good ‘eye’ might help though. There are awesome people with a degree of course, but I’ve also seen people with a degree that honestly totally sucked. So Don’t judge on degrees, awards, whatever. Judge on actual work. If it’s good, it’s probably a good designer/developer etc.

  4. Sam, do you have any suggestions where to go for finding examples of pure code apps for iOS. I have had enough trying to figure out what IB is doing that I can’t see. I have never used any visual builder for any other platform and never had anything like the same kinds of problems debugging things that I have when using IB.

    Thanks