Build a Lo-Fi Responsive Website Prototype with Adobe XD

Offered By
Coursera Project Network
In this Guided Project, you will:

The basics of laying out objects in Adobe XD

How to make a low-fidelity prototypes responsive with Adobe XD

Clock2 hours
CloudNo download needed
VideoSplit-screen video
Comment DotsEnglish
LaptopDesktop only

In this 1.5 hour guided project, you will learn how to create a low-fidelity responsive website prototype using Adobe XD. Low fidelity prototypes focus on the workflow and content rather than typographic details. Website prototypes in particular also pay attention to displaying on a wide variety of device screen sizes and set clear examples and expectations of the overall picture for users and development teams. A free trial (or subscribed) Adobe account is required. Please create an account or prepare to log in prior to starting the project.

Skills you will develop

Adobe XDUIwebsitePrototypeUser Experience (UX)

Learn step-by-step

In a video that plays in a split-screen with your work area, your instructor will walk you through these steps:

  1. Introduction and overview

  2. Set up the wireframe layout of our website

  3. Set up the images and text

  4. Make Adobe XD responsive resize work for us as much as possible

  5. Make a 1076 pixels version

  6. Make a 768 pixels version

  7. Make a 380 pixels version

How Guided Projects work

Your workspace is a cloud desktop right in your browser, no download required

In a split-screen video, your instructor guides you step-by-step

Frequently asked questions

Frequently Asked Questions

More questions? Visit the Learner Help Center.