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 |
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
Responsive Web Design in Adobe XD at Coursera Course details
- 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.
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