2. Choose an App to Make Your Wireframe
In this video, you will choose three screens of an existing app to be the subject of your wireframe.
Then you will add slides, title them, and rename your presentation.
Most apps begin as a wireframe, or a simple collection of shapes and lines that represent the parts of a screen.
In the brainstorming stage of building an app, UX designers create wireframes to outline the skeleton of the design.
One purpose of creating wireframes is to test different versions of a product with potential users.
Even across various apps, the locations of the buttons and text are often based on existing standards and expectations for similar products.
Those buttons are located in places that make sense to people, based on their experiences with other apps.
Users should have an idea of how buttons work without thinking too much about it.
When sketching a wireframe, UX designers also consider how often a user will need a button or what the user will do first in the app.
For example, when a user opens a streaming app to watch a specific movie, it should be easy for them to search by title.
A UX designer might choose to sketch an easy-to-find search bar on the opening screen.
Before the final design for an app is reached, the UX designers make a lot of decisions about the structure and functionality of the screens.
In other words, they decide where to put each button, menu, and other element to create a good user experience.
Normally, the wireframe is part of the early stage of the design process.
However, to complete this project, you will create a wireframe for an app you are already familiar with.
Working backwards from an app you already know will help you understand how to build a wireframe.
You will create the wireframe in Google Slides by inserting shapes and lines to represent the text, images, and buttons on the app.
To begin, choose an app to create a wireframe for, like a social networking app, a streaming service, or an email app.
Then, open the app you chose.
The introductory screen of an app is the home screen.
Often, home screens have a main menu, a search field, and other navigation options for easy use.
Take some time to observe the home screen of the app you chose.
Tap the buttons, open a menu, or use the search bar to observe what happens with each action.
Next, choose two more screens you’d like to create wireframes for.
Each screen of an app is drawn out as an individual wireframe.
On a streaming service app you might choose to create a wireframe of a screen for watching a movie and a screen showing the search results for a specific movie.
Or in a social media app you might choose screens to write a new post, respond to someone’s post, or send someone a direct message.
If you choose an email app, you might focus on the screens for reading an email, replying to an email, and composing a new email.
After you’ve chosen which screens you want to create wireframes for, return to your presentation.
Change the layout of the first slide to a “Title Only” slide.
Then, duplicate the first slide twice so you have a total of three identical slides.
Creating each screen of your wireframe on a separate slide will mimic advancing through the app to get to the next screen.
Next, add a title to each slide.
Title the first one as the home screen.
Title slides two and three with the other types of screens you chose.
Resize the text box of each title to make it smaller.
Finally, rename your slide presentation according to your topic.
Include your name and the type of app you will design.
Now, it’s your turn: choose an existing app to create a wireframe for, change the layout of the first slide in your presentation, duplicate the first slide twice for a total of three slides, title your slides, and rename your presentation.