Creating a Wireframe

Objectives and Overview

The core objective of this project is to continue to build your wireframing skills by creating one for the main page of your personal website. Wireframing is a skill that requires active practice, and the more relevant you can make the activity the better. One way to do this is to practice while working on a personal project. For this activity, you are the client!

Lesson Objectives

• Create a wireframe for the main page of your About Me site
• Create variations on your basic layout idea

---

Think about a basic page layout that you’re going to build over the next few lessons.

If you’re wondering how much detail you should include, or what types of drawings to use, here’s a video from Jesse Showalter showing insight into his process:

One of the core takeaways from his video is that you don’t need to use detailed symbols in your wireframes. Remember, the focus is on solving problems, visually representing content and ideas, and creating a roadmap with some variations.

Project Requirements

This project is the first item you’ll be submitting for the Future of Work Web Pathway.

The goal of this project is to create a wireframe for your own site. The previous lesson activity had you create a wireframe from an existing site, which is an effective method for practicing. However, it’s crucial to be able to wireframe a project from scratch.

When you’re working with a client, there are questions that you’d want to ask to help identify what their needs are. An important part of this process is understanding what they need through a series of questions.

While it may seem strange, try to practice asking these questions to yourself. After you do that, create a wireframe based on your answers.

Project Prompt

Create a low fidelity wireframe for the main page of your personal site. After creating the initial wireframe, create two variations on it.

Refer to the video in the previous lesson for an effective overview of the entire process. That video contains solid insights into the entire process.

Here are some questions to ask:

• What is the main purpose of the site?
  • For example, is your site a portfolio? Is it a blog?
• Who is the audience of the site?
• What is my voice?

When you go through this process with a client, you’ll want to ask other questions as well. Use this activity to start building these skills and building your comfort level.

One way to build your creativity with this is to create several variations of your wireframe. After you make a few, choose the one that you like best.

Be sure to keep your wireframes!