Skip to main content

Website Planning and Wireframing

Lesson 4 of 9

Defining The Problem To Solve

Alexandra Moran

Website Planning and Wireframing

Alexandra Moran

Starting under


Get access to this class +2000 more taught by the world's top experts

  • 24/7 access via desktop, mobile, or TV
  • New classes added every month
  • Download lessons for offline viewing
  • Exclusive content for subscribers

Lesson Info

4. Defining The Problem To Solve


  Class Trailer
Now Playing
1 Introduction to Wireframing Duration:06:41
2 What is Wireframing? Duration:04:21
6 Overview of Sketch Software Duration:09:13
7 Create a Wireframe in Sketch Duration:17:31

Lesson Info

Defining The Problem To Solve

So then, the next piece once you have all that is defining the problem. So, the best and easiest way to do that is to ask questions. Ask questions to all of those stakeholders. Ask even more questions to all of those stakeholders. They're gonna be different for every project and it's definitely better to air on the side of asking too many questions instead of too little because you don't want to be left wondering in a moment of decision. With thinking about your user constantly and being empathetic, you want to have a bulk, a wealth of knowledge at your hands at all times. So, even when you're making small decisions of should this be your drop down or should I have all of my options for this visible? Asking questions of your stakeholders about what the goals are of the project and what you're trying to achieve, and then what specifically the stakeholders goals are, but the users goals are, that is what is going to help you. And also, asking one question often answers another question o...

r a question you didn't ask. And there is always good stuff that you can get out of people you're working with. And so then some of those specific questions get into are things around brand voice. So, who is your client? What are they about? Do they have a branding guideline document? Do they have that defined for them as a company? Or are those things that you're gonna need to discuss with them to pull it out? A lot of that can really be filled in with just basic keywords. So, if your client doesn't necessarily have a branding document or an understanding of sort of who they are, try and work with them to narrow down to maybe five keywords, like traditional, modern, trustworthy. The more specific those adjectives can be, the more helpful it will be to you later because what you can do is have those five words and when you have them, and you're working on your wireframe and you're trying to solve a problem, you think you've gotten to a good solution and then you can stop and say, okay, what are my five words? Does this design feel trustworthy? If you're going through a checkout flow, does it feel like entering my credit card information is secured and is safe? If it's a, I don't know, a fashion brand or something, is this modern? Am I using a really traditional pattern of like how my UI elements are? Or is there something I can do that's a little more unusual, a little bit newer, fresher take on something? So, those five words as benchmarks through almost any step of the process are gonna be super, super helpful. And with that, user personas are an amazing and excellent tool that should be in any designers tool belt. There's lots of examples of these online. Templates that you can look to to help you figure out how to build a user persona. But essentially what it is is who is using the thing that you're building? If you're building a website, who is coming to it? What are they like? Do you know their age, their gender, their habits, their income, their location, their interests? Almost any piece of data that you can be confident that you know about your users is gonna be useful to you. The more you know about them, the more you can think like them, the more better you can design for them. By thinking about them and for them, that's gonna help you solve the problems. Defining the problems is another important step. So, there's the clients goals. More conversions, easier website to use. Maybe it's a restaurant and they want people to stop calling to ask how late they're open because it's taking up the hosts time and they want people to just go to the website and know that information. So, just ask your stakeholders, what are you solving for? What are you trying to figure out with this website? What are you trying to achieve? And then its your job, our job as designers, to think through all the possible steps or the possible ways that we can get to that goal. And with those things, the problems that you're solving for, your user personas and the sort of brand voice of your client. That's the stuff that should give you clear understanding of the problems you're solving and what you're trying to achieve and somewhat of a clearer vision on how you might do it.

Class Description

Wireframing streamlines the process of designing and prototyping by stripping a website or app down to its most practical, feature-based foundations. Alexandra Moran is a web/UX industry expert, with experience addressing the design needs of clients both large and small. 

Join this class, and you’ll learn:

  • The fundamentals of Sketch software
  • How to separate your site’s content from its visual design
  • How to anticipate the needs of the end user and make a website that will engage them
After taking this class, you’ll be able to map out the functionality and layout of your website. You’ll be able to communicate the flow and importance of various features and use your wireframes as a reference for developers. Join Alexandra to grow your skillset and add a powerful new tool to your design arsenal.


Lisa Brink

Great information. Would have been nice if she had a large pad or dry erase boards for the sketching so both online and people in the room could see better - as opposed to the 8.5 x 11 laying on the desk.

China Rose

Alexandra shares useful specific ideas to build confidence in website planning and shares her clever techniques for wire framing.