Mockups: Coding vs Drawing?

This isn’t about web design but about interface design in general. Is better to code Interface Mockups or “draw” them in a graphics program, like GIMP, Photoshop, etc.?


Ask yourself these questions:

  • How many UI layouts/options can you explore in 30 minutes by coding? How many can you explore by sketching?

  • How often do you get a UI design exactly right on the very first try? If not very often, how quick/easy is it to change a sketch versus a coded mockup?

  • Can you instantly identify a color just by looking at its hex/rgb code (not just a ballpark guess, but the exact shade/color)? When you picture a color in your mind, can you immediately translate that to hex? How fast can you pick out a color scheme by typing in hex codes versus using a real color picker?

The fact that you’re asking this question tells me that you’re most-likely a programmer, not a designer, by training. If you were a designer, then it would be as absurd as developing an application without planning out the class structure, database design, application architecture, etc. and just jumping right into coding—and if you’re an experienced developer, then you know what kind of problems this sort of bottom-up development causes.

Similarly, if you jump straight to code without actually designing your UI first, then the results aren’t going to be pretty, if only because it’s impractical to perfect a good design by coding blindly.

Source : Link , Question Author : Christopher , Answer Author : Lèse majesté

Leave a Comment