Learn more about creating a low-fidelity prototype in Adobe XD
Your instructor, Dave, has been showing you some of the steps for building low-fidelity prototypes for your responsive website using Adobe XD. You’ll have the chance to create your own low-fidelity prototypes in an upcoming activity, so it’s a good idea to familiarize yourself with the overall process now.
Check out Adobe’s article Create interactive prototypes for guidance on turning a design into a working prototype. You’ll learn to set up the website flow by defining what happens when a user interacts with the website features. Some of these topics are also covered in this series of videos from Adobe. With a little guidance and practice, you’ll be able to create a low-fidelity prototype in Adobe XD in no time!
If you want a full review of the fundamentals of wireframes and prototypes, this article from Adobe XD can help refresh your memory.
Check a low-fidelity prototype in Adobe XD
You should now have a fully-functional low-fidelity prototype for your responsive website. How exciting! In the next part of the course, you’ll share this prototype with real users and get feedback through a usability study.
But before you share your designs with the world, use this quick checklist to make sure that your prototype is ready to test:
- Does the prototype connect at least four pages?
- Are pages of the prototype connected in the order of the main user flow?
- Can users navigate forward and backward through pages of the main user flow?
- Are there any dead ends that you need to address?
- Can users easily navigate back to the home page from any screen of the design?
- Do the designs contain cues that orient users about where they are in the flow, like a progress bar?
- When users reach the final page of the prototype, is there a completion message or are they navigated back to the home page?
If you answered yes to all these questions, you’re officially ready to share your low-fidelity prototype!
To learn how to share your prototype with others, check out Get Started with Adobe XD: Collaboration for a quick tutorial with practice files. When you’re ready, continue on to the next part of the course, where you’ll plan and conduct a usability study to gather feedback about your designs.
Sources: Google UX Design Professional Certificate
Coursera | Responsive Web Design in Adobe XD
