How to Sketch a UI for Non-Designers


A lot of times in ideation sessions
non-designers will say, “I can’t draw so I can’t help with ideation.” But ideation
happens in the early stages of design and is meant to be messy. You can use
basic shapes to convey UI elements and a layout. For example, I’m gonna draw a UI
layout on this post-it pad using very simple shapes. I’ll start with a big
rectangle which represents my browser window. To define the navigation, I’m
going to draw a line across the top and add in smaller lines for links. I’ll add
a rectangle with an arrow to represent a button that leads to another page for
the title of this page. For the title of this page, I’ll make a thick line to represent the heading and then smaller lines to represent the body copy. I’ll add an image by drawing a rectangle
with an X through it and start to create form fields by drawing long rectangles.
I can add a carrot in one of the small rectangles to signify a drop-down and
then I’ll add one more button to submit the form. And in a short amount of time
without any special tools besides this marker I’ve created a layout! You don’t
need detailed drawings or complicated software to convey an idea. A fun way to
start an ideation session is with a warm-up activity to get everyone
comfortable. One way you can do this is to start out by drawing a simple object
that everyone knows — like a cat — for one minute. After the one minute is up everyone
shows their drawing. This gets the team comfortable by making the first
show-and-tell drawing low pressure and it demonstrates how one concept can be
conveyed in many different ways. It’s quick, it’s fun, and it gets everyone ready to focus on ideation without feeling like they
can’t draw. Next time you’re in an ideation session start with basic shapes
and feel confident that you can contribute to design ideas without a
comprehensive art background. you

Leave a Reply

Your email address will not be published. Required fields are marked *