Coursera
Coursera Logo

Responsive Web Design in Adobe XD 

  • Offered byCoursera

Responsive Web Design in Adobe XD
 at 
Coursera 
Overview

Duration

40 hours

Start from

Start Now

Total fee

Free

Mode of learning

Online

Difficulty level

Beginner

Official Website

Explore Free Course External Link Icon

Credential

Certificate

Responsive Web Design in Adobe XD
 at 
Coursera 
Highlights

  • Shareable Certificate Earn a Certificate upon completion
  • 100% online Start instantly and learn at your own schedule.
  • Course 6 of 7 in the Google UX Design
  • Flexible deadlines Reset deadlines in accordance to your schedule.
  • Beginner Level
  • Approx. 40 hours to complete
  • English Subtitles: English
Read more
Details Icon

Responsive Web Design in Adobe XD
 at 
Coursera 
Course details

Skills you will learn
More about this course
  • Responsive Web Design in Adobe XD is the sixth course in a program that will equip you with the skills you need to apply to entry-level jobs in user experience (UX) design. In this course, you will design a responsive website using Adobe XD, a popular design tool. You will complete the design process from beginning to end: empathizing with users, defining their pain points, coming up with ideas for design solutions, creating wireframes and prototypes, and testing designs to get feedback. By the end of this course, you will have a new design project to include in your professional UX portfolio.
  • In addition, you?ll learn how to search for entry-level UX design jobs, create a resume that highlights your skills and accomplishments, and build your professional portfolio website.
  • Current UX designers and researchers at Google will serve as your instructors, and you will complete hands-on activities that simulate real-world UX design scenarios. Learners who complete the seven courses in this certificate program should be equipped to apply for entry-level jobs as UX designers.
  • By the end of this course, you will be able to:
  • - Apply each step of the UX design process (empathize, define, ideate, prototype, test) to create a responsive website.
  • - Develop designs in a popular design tool, Adobe XD.
  • - Plan information architecture and create sitemaps for website designs.
  • - Apply common layouts for web pages.
  • - Plan and conduct a usability study to gather feedback about designs.
  • - Iterate on designs based on research insights.
  • - Work with design systems in Adobe XD.
  • - Add a new design project to your professional UX portfolio.
  • - [Optional] Create or update a UX-focused resume.
  • - [Optional] Learn how to search for and apply to introductory-level jobs in the field of UX.
  • This course is suitable for beginner-level UX designers who have completed the previous five courses of the Google UX Design Certificate. Alternatively, learners need to have a strong foundational understanding of the design process; experience creating wireframes, mockups, and prototypes; and the ability to conduct usability studies. No previous experience with Adobe XD is required.
Read more

Responsive Web Design in Adobe XD
 at 
Coursera 
Curriculum

Starting the UX design process: Empathize and define

Introduction to Course 6: Responsive Web Design in Adobe XD

Dave - My journey to UX

Welcome to week 1

Understand responsive websites

Introduction to Adobe XD

Start a project in Adobe XD

Jennifer - Use digital design tools

Empathize with users and understand pain points

Create personas

Create user stories

Build a user journey map

Develop a problem statement

Wrap-up: Starting the UX design process: Empathize and define

Welcome to Course 6

Introduction to second portfolio project

Get started with Adobe XD

Optional - Get started with Figma

Learn more about empathizing with users

Conduct interviews for empathy maps

Create empathy maps

Activity Exemplar: Create an empathy map

Learn more about personas

Activity Exemplar: Create personas

Learn more about user stories

Learn more about user journey maps

Activity Exemplar: Create a user story and user journey map

Learn more about problem statements

Glossary

Activity: Submit your choice of portfolio project prompt

Test your knowledge on responsive website design

Test your knowledge on the basics of Adobe XD

Test your knowledge on empathizing with users

Activity: Create an empathy map

Activity: Create personas

Activity: Create a user story and user journey map

Test your knowledge on problem statements

Continuing the UX design process: Ideate

Welcome to week 2

Conduct a competitive audit

Come up with ideas using How Might We

Come up with ideas using Crazy Eights

Plan information architecture for a website

Explore common website structures

Explore sitemaps

Build a sitemap for your website

Wrap-up: Continuing the UX design process: Ideate

Learn more about competitive audits

Activity Exemplar: Conduct a competitive audit for your website

Learn more about using competitive audits to ideate

Learn more about How Might We and Crazy Eights

Activity Exemplar: Come up with ideas for your website

Learn more about information architecture

Learn more about building a sitemap

Glossary

Activity: Conduct a competitive audit for your website

Self-Reflection: Use competitive research to inform designs

Test your knowledge on ideation techniques

Activity: Come up with ideas for your website

Test your knowledge on website structures

Creating wireframes for a responsive website

Welcome to week 3

Explore common layouts for website home pages

The basics of wireframes

Plot a responsive layout

Adjust page layouts based on screen size

Transition from paper to digital wireframes

Create digital wireframes in Adobe XD

Create wireframes for additional screen sizes in Adobe XD

Jay - Design with Adobe XD

Refine wireframes to enhance accessibility

Evaluate wireframes using Gestalt Principles

Wrap-up: Creating wireframes for a responsive website

Learn more about common website layouts

Learn more about wireframes

Activity Exemplar: Begin paper wireframes for your website

Learn more about plotting responsive layouts

Common elements used in responsive design

Activity Exemplar: Create variations of your paper wireframes

Learn more about creating digital wireframes in Adobe XD

Optional - Create digital wireframes in Figma

Activity Exemplar: Create digital wireframes for a desktop screen size

Optional - Create wireframes for additional screen sizes in Figma

Activity Exemplar: Create digital wireframes for additional screen sizes

Learn more about Gestalt Principles in wireframes

Glossary

Activity: Begin paper wireframes for your website

Activity: Create variations of your paper wireframes

Activity: Create digital wireframes for a desktop screen size

Activity: Create digital wireframes for additional screen sizes

Creating and testing low-fidelity prototypes

Welcome to week 4

Understand low-fidelity prototypes

Create a low-fidelity prototype in Adobe XD

Plan a UX research study

Conduct a usability study

Reduce bias in a usability study

Analyze and synthesize research results

Iterate on low-fidelity designs based on research findings

Wrap-up: Creating and testing low-fidelity prototypes

Learn more about creating a low-fidelity prototype in Adobe XD

Optional - Create a low-fidelity prototype in Figma

Activity Exemplar: Create a low-fidelity prototype for your responsive website

Check a low-fidelity prototype

Learn more about planning a UX research study

Activity Exemplar: Plan a UX research study

Learn more about conducting a usability study

Activity Exemplar: Conduct a usability study for a low-fidelity prototype

Learn more about analyzing and synthesizing research results

Activity Exemplar: Analyze and synthesize the results of a usability study

Learn more about iterating on low-fidelity designs

Glossary

Test your knowledge on wireframes versus prototypes

Activity: Create a low-fidelity prototype for your responsive website

Activity: Plan a UX research study

Self-Reflection: Determine how to reduce bias in your own studies

Activity: Conduct a usability study for a low-fidelity prototype

Activity: Analyze and synthesize the results of a usability study

Test your knowledge on modifying designs based on research findings

Creating and testing high-fidelity designs

Welcome to week 5

Begin to design mockups

Start creating mockups for a website homepage in Adobe XD

Continue creating mockups for a website homepage in Adobe XD

Create mockups for a mobile website in Adobe XD

Work with design systems

Use external design systems in Adobe XD

Create a high-fidelity prototype in Adobe XD

Annotate prototypes for web accessibility

Wrap-up: Creating and testing high-fidelity designs

Optional - Test your high-fidelity prototype

Review foundational elements of visual design

Review how to arrange elements in mockups

Review visual design principles

Optional - Start creating website mockups in Figma

Add images and logos to mockups in Adobe XD

Use repeat grids to design in Adobe XD

Activity Exemplar: Create mockups for a website

Learn more about hidden navigation menus

Optional - Create mockups for a mobile website in Figma

Activity Exemplar: Create a mockup for the homepage of a mobile website

Learn more about design systems

Optional - Activity Exemplar: Create a sticker sheet in Figma

Learn more about web accessibility

Glossary

Optional - Review how to plan and conduct a usability study

Test your knowledge on the basics of mockups

Test your knowledge on creating a homepage in Adobe XD

Activity: Create mockups for a website

Activity: Create a mockup for the homepage of a mobile website

Test your knowledge on working with design systems

Activity: Document your design decisions

Optional - Activity: Create a sticker sheet in Figma

Test your knowledge on web accessibility

Test your knowledge on usability studies

Documenting design work and searching for jobs

Welcome to week 6

Collaborate with engineering teams

Hand off design specs in Adobe XD

Add a project to your portfolio

Understand common jobs for UX designers

Explore types of companies that UX designers work at

Identify where to apply for UX design jobs

Scan job descriptions for key words

Understand UX design resumes

Dane - My advice for UX design resumes

Tim - A recruiter's advice for UX design resumes

Update a resume based on job descriptions

Wrap-up: Documenting design work and searching for jobs

Congratulations on completing Course 6: Responsive Web Design in Adobe XD

Collaborate remotely with Adobe XD

Learn more about portfolio case studies

Learn more about jobs in the field of user experience

Uncover UX design job opportunities

Activity Exemplar: Begin searching for UX jobs using a tracker

Activity Exemplar: Highlight key words and requirements in job descriptions

Elements in a typical UX design resume

Activity Exemplar: Draft a UX design resume

Glossary

Start the next course

Test your knowledge on handing off designs

Test your knowledge on portfolio case studies

Self-Reflection: Share your professional goals and interests

Activity: Begin searching for UX jobs using a tracker

Activity: Highlight key words and requirements in job descriptions

Self-Reflection: Think about the information to include in your resume

Activity: Draft a UX design resume

Weekly challenge 6: Document design work and search for jobs

Responsive Web Design in Adobe XD
 at 
Coursera 
Admission Process

    Important Dates

    May 25, 2024
    Course Commencement Date

    Other courses offered by Coursera

    – / –
    3 months
    Beginner
    – / –
    20 hours
    Beginner
    – / –
    2 months
    Beginner
    – / –
    3 months
    Beginner
    View Other 6715 CoursesRight Arrow Icon
    qna

    Responsive Web Design in Adobe XD
     at 
    Coursera 

    Student Forum

    chatAnything you would want to ask experts?
    Write here...