Key Concepts

Review core concepts you need to learn to master this subject


A wireframe is a low-fidelity representation of a digital interface that defines the content layout and page elements.

Lesson 1 of 1
  1. 1
    Wait a second… information architecture?! Didn’t I click on the wireframes lesson? Yup, you sure did! Welcome to our Wireframes Lesson! Here we will discover what wireframes are, why wireframes …
  2. 2
    For one moment, let’s imagine the most elegant website ever created. The website has a font that’s oh-so-perfect, has intuitive and accessible navigation, and has a world-class interface design. Pa…
  3. 3
    Before constructing a house, an architect creates a detailed blueprint. Builders then use that detailed blueprint as a guiding reference during the construction process. Without the blueprint, buil…
  4. 4
    A wireframe is constructed with simple, low-fidelity wireframe elements that can help communicate ideas during the wireframing process. Low-fidelity wireframe elements act as placeholders for hig…
  5. 5
    As a reminder, we know that through effective user research, we can have a better understanding of: * User goals and tasks for the application * User pain points, behaviors, and desires * Current …
  6. 6
    We have discovered that sketching can be an excellent method toward establishing content layout in a fast, efficient, and iterative manner. Sketching can be achieved through pen and paper and is pr…
  7. 7
    Wireframing is a foundational skill for UI designers across all levels of experience. Now that we are equipped with the knowledge and skills associated with wireframing and understand the role of w…
  8. 8
    Congratulations! This concludes our introductory lesson on wireframes. Before we wrap things up, let’s go over some key topics we discussed in this lesson: * Information architecture is the organ…

What you'll create

Portfolio projects that showcase your new skills

Pro Logo

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Pro Logo