Benefits of Wireframing4:16 with Hope Armstrong
In this video, we will delve into why wireframes are a critically helpful step in the design process.
Now that you're familiar with wireframes, I'll explain more about why they 0:00 are a critically helpful step in the design process. 0:03 You already know the guiding principle of wireframing is to 0:07 focus on the structure and the functionality. 0:10 The next concept is iteration. 0:13 Imagine you want to build a ridesharing app. 0:16 There are so many different potential screens, a login page, 0:19 a map, account settings, billing, support, and so on. 0:23 On top of that there are so many ways these screens could look and interact. 0:28 It's overwhelming to think about designing all those perfectly right away. 0:32 However, iterating on low fidelity wireframes is less intimidating and 0:37 quickly generates the best ideas. 0:41 Wireframing is an iterative process. 0:45 The goal isn't to make one wireframe and move on, the goal is to make so 0:47 many you can't even dream of another scenario. 0:51 Then you go to sleep and wake up the next day with a few more ideas. 0:55 And then you repeat it again until you realize 0:59 the project deadline is approaching and you need to make decisions. 1:02 There are a lot of ways to design a screen, and 1:06 it's beneficial to try many options to uncover the best solution. 1:08 Since wireframes are quick to produce, 1:13 we don't have to sacrifice precious time to explore our options. 1:15 In addition, wireframing produces a deliverable that enables your teammates to 1:20 give direction and feedback early on. 1:25 You and your team will have a lot of ideas about the design of the experience. 1:28 Stakeholders from different departments have their own business goals and 1:33 expertise, so it's important to design with their goals and concerns in mind. 1:37 Product managers, marketers, sales people and other business types will need 1:41 to verify that design aligns with the product vision and customer needs. 1:46 Developers will need to confirm the design is feasible from a technical standpoint 1:51 within the allotted timeline. 1:55 And they often have their own awesome ideas for how to simplify the design and 1:57 make it more efficient. 2:01 Other designers will be able to catch usability issues and 2:03 inconsistencies with interaction patterns across the entire product ecosystem. 2:06 This is why wireframing is so powerful. 2:11 You can address all these concerns early, before development starts. 2:14 It's much harder to fix them later. 2:18 Imagine a marketer on your team is responsible for 2:21 increasing the subscription sign-up rates, and 2:24 therefore wants prominent promotion of a discount code. 2:26 Simultaneously, a product manager may be motivated to increase early adoption 2:30 of a new product feature, and she wants a product tour to show upon login. 2:35 As you can imagine, these two priorities conflict, 2:40 because they're both competing for the attention of the user. 2:43 Of course, creating a positive user experience is paramount. 2:46 So, wireframing different scenarios and 2:50 pitching it to stakeholders early allows for consensus. 2:53 Wireframing lets your team get involved in the ideation phase, 2:57 helps them understand the goals, and sets their expectations. 3:00 This prevents costly pivots later in the process, such as in the mock-up or 3:04 prototyping phase. 3:09 The best way to sort through ideas is to start brainstorming. 3:11 Wireframes are a visual artifact of this brainstorming and 3:15 the goal is to make them with minimal effort. 3:18 We want to encourage ideation and 3:21 to minimize unnecessary exertion on a sub-par idea. 3:23 Wireframes allow you to communicate your own ideas, 3:27 and feedback from your team allows you to continuously refine those ideas, 3:30 until you come to a consensus on the final solution. 3:34 Let's review, here are the benefits of wireframing. 3:37 You can quickly brainstorm ideas before polishing and refining the visual design. 3:42 You can get feedback on the concept, without the visual design creating bias. 3:47 You can get feedback and stakeholder approval early on, and it saves you time. 3:52 Instead of dedicating too much time taking an idea through the pixel perfecting 3:57 stage, you find out sooner if the idea isn't going to work. 4:02 Also, it's low pressure. 4:06 It communicates to stakeholders and 4:08 teammates that this is very much wet paint, and 4:09 they can fee free to give feedback that changes the direction of the project. 4:12
You need to sign up for Treehouse in order to download course files.Sign up