Introduction to Wireframing Flashcards

1
Q

A drawing which visualizes the elements of a website or mobile app.

A

Wireframing

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

The main reason for wireframing is to focus on the

A

structure and the functionality

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Why is wireframing useful?

A
  1. Lets your team get involved in ideation
  2. Helps the team understand the goals
  3. Sets expectations
  4. You can quickly brainstorm ideas before polishing and refining the visual design
  5. You can get feedback on the concept, without the visual design creating bias
  6. You can get feedback and stakeholder approval early on
  7. It saves you time. Instead of dedicating too much time taking an idea through the pixel perfecting stage, you can find out sooner if the idea isn’t going to work
  8. It’s low pressure. It communicates to stakeholders and teammates that this is very much wet paint and they can feel free to give feedback that changes the direction of the project.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

an early stage, barebones drawing with minimal polish. It is typically more loosely drawn and hints at the specific elements on the page.

A

Low-fidelity wireframe

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Fidelity in design

A

how much detail goes into a design

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

more polished and displays more specific or realistic renderings of content.

A

High-fidelity wireframe

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

small representations of a screen. They allow you to quickly try out different layout ideas and visualize the hierarchy of content without getting too involved in a larger, more detailed wireframe

A

Thumbnail wireframes

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

How should you use wireframes with your users?

A
  1. Meet users and test in-person
  2. Emphasize that this is early exploration and users should ignore the visual design
  3. Ask for feedback and users’ expectations
  4. Have users talk through how they interpret the content and navigate the app
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

The Best Case Scenario for User testing with wireframes

A
  1. Review the user research and business goals
  2. Iterate on low-fidelity wireframes
  3. Get internal feedback
  4. Iterate on low-fidelity wireframes
  5. Polish the selected low-fidelity wireframe into a high-fidelity wireframe
  6. Get internal feedback(Again)
  7. Get user feedback
  8. Continue along in the design process: a. Create a mockup and start implementing it with code. b. Start over with a new set of wireframes
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What is the benefit of using a low fidelity wireframe?

A

You can explore different layout options quickly

How well did you know this?
1
Not at all
2
3
4
5
Perfectly