Welcome back. We've learned a lot about wireframing and why paper wireframes are a great starting point for your actual UX designs. By now, you should have created a pretty solid paper wireframe yourself. Be sure to hang on to your paper wireframes for your portfolio so you can showcase your full design process.
In this video, you'll learn how to know if you're ready to convert your paper wireframes to a digital version and the most important elements to focus on as you get started. Let's do it. After you've explored multiple ideas for wireframes on paper, and you understand which wireframe elements will provide the best user experience, it's time to bring your paper wireframe to life digitally.
While drawing wireframes on paper is fast and inexpensive, things get a little trickier when we move to digital wireframes. So make sure you feel good about your paper wireframes before you move on to the next step. There are a few questions you can ask yourself to decide if you're ready to move on to a digital wireframe.
One, is my paper wireframe complete? As we know, a wireframe isn't anywhere close to a finished product, so complete means you have an idea of the structure that you want to use in your wireframe. Two, have I received feedback on my paper wireframe?
Hopefully by this point you've received feedback from peers or your manager on your wireframes. And three, am I ready to consider basic visual cues? Remember, color and images don't come into play until much later.
But at this point in the design process, you might vary the kind of text you include in your wireframes. We'll discuss this more soon. If you can answer yes to these three questions, you're probably ready to transition from a paper wireframe to a digital wireframe. If not, that's okay.
Keep working on your paper wireframes until they meet this criteria. As you move forward with your wireframes and make the transition from paper to digital, there are a few things you should keep in mind. First, use actual content for important pieces of text instead of all placeholder text.
For example, for different sections of the screen, I might want to call out what that section is called. In the dog walking app, right above the list of dog walkers, I'll write out available dog walkers near you to make that clear. Another example is in a bottom bar, you might list the actual text label below the icons to make it clear what each icon will do.
But for large chunks of body copy, use a placeholder text like lorem ipsum. If you're not familiar with it, lorem ipsum is meaningless placeholder text written in Latin that you can use to show where content will go. and how a page will be laid out.
The use of Latin text to simulate words without actual meaning started in the printing industry, where it was used to lay out a printed page before the real text had been written. The 69-word Lorem Ipsum text block originally appeared in an ethics book written in 45 BC by the Roman scholar Cicero, and it was first used for fake text in the 1960s. While manual printing is pretty much extinct, designers still rely on Lorem Ipsum to simulate text in a layout. Using Lorem Ipsum allows designers to present the structure of the wireframe without the distraction of actual words.
You'll see Lorem Ipsum used a lot and will use it frequently yourself throughout your UX design career. The second thing to keep in mind when transitioning from paper to digital wireframes is that you should hold back on adding expressive content like color or images into your wireframe for now. Your wireframe should still focus on functionality.
Wait until you start working on prototypes before adding expressive visual details. So why do UX designers create wireframes digitally? Digital wireframes allow you to pay more attention to the details. The goal of paper wireframes was to get all of your ideas out on paper, and it was okay to be messy. But now with digital wireframes, it's important to get the structure right, and that means making your design cleaner.
Digital wireframes are also easier to share than paper wireframes, because many digital tools, like the ones we'll use, allow you to collaborate. Sharing a link to your digital design is a lot easier than making photocopies and mailing them to each of your stakeholders. All right, using what you just learned, you should be able to get your paper wire frames in a good enough state that you're ready to start translating them into a digital format.
And coming up, we'll do that as we transition from a paper wire frame to a digital wire frame in Figma. Keep up the great work.