Principles of UX/UI Design
Learn the fundamentals of User Experience (UX) research and design. Become immersed in the UX process of identifying problems and iterating and testing designs to find appropriate solutions. You’ll learn how to empathize with users through best-practice research approaches, and create common UX artifacts such as user personas. And you’ll use UX insights to make appropriate design decisions. By utilizing the User Interface (UI) design process, you will be able to create wireframes for features in Figma, and turn them into Minimum Viable Product (MVP) style prototypes from your mockups.
Monthly Subscription Starting at AED 99 + VAT
- Level Foundation
- Duration 22 hours
- Course by Meta
-
Offered by
About
Learn the fundamentals of User Experience (UX) research and design. Become immersed in the UX process of identifying problems and iterating and testing designs to find appropriate solutions. You’ll learn how to empathize with users through best-practice research approaches, and create common UX artifacts such as user personas. And you’ll use UX insights to make appropriate design decisions. By utilizing the User Interface (UI) design process, you will be able to create wireframes for features in Figma, and turn them into Minimum Viable Product (MVP) style prototypes from your mockups. You’ll also learn the core principles of design such as hierarchy and the use of grids. By the end of this course you will be able to: • Design digital products that create value and solve a user's problems in meaningful ways. • Recognize what constitutes successful UX UI and evaluate existing interfaces for design consistency and quality. • Identify best practice interaction design methods and evaluate and improve your own and others' designs. • Create, share and test your UX UI designs following best practice guidelines. This is a beginner course for learners who would like to prepare themselves for a career in UX UI development. To succeed in this course, you do not need prior development experience, only basic internet navigation skills and an eagerness to learn.Modules
Course introduction
-
5
Videos
-
2
Readings
-
1
Discussion
1
Discussions
- What do you hope to learn?
5
Videos
- Introduction to the principles of UX and UI design
- A day in the life of a Meta product designer
- Introduction to UX and UI
- A day in the life of a Meta product manager
- Final project overview
2
Readings
- UX UI Course syllabus
- How to be successful in this course
What is UX?
-
3
Videos
-
2
Readings
-
1
Assignment
1
Assignment
- Knowledge check: What is UX?
3
Videos
- What is UX?
- UX goals + Quality components
- Overview of the UX process
2
Readings
- Empathy tools: Artifacts in the UX process
- Additional resources
What is UI?
-
2
Videos
-
3
Readings
-
1
Assignment
1
Assignment
- Knowledge check: What is UI?
2
Videos
- What is UI?
- Getting started with Figma
3
Readings
- Types of digital design
- Set up a Figma account
- Additional resources
User-centered design
-
4
Videos
-
4
Readings
-
1
Discussion
-
2
Assignment
2
Assignment
- Self-review: Create a persona
- Module quiz: Introduction to UX and UI
1
Discussions
- Share your persona!
4
Videos
- Who is your user?
- Empathy tools
- Case Study: User research in the real world
- Module summary: Introduction to UX and UI
4
Readings
- Little Lemon scenario
- Exercise: Create a persona
- Solution: Create a persona
- Additional resources
Evaluation methodologies
-
2
Videos
-
5
Readings
-
2
Assignment
2
Assignment
- Self-Review: Heuristic evaluation
- Knowledge check: Evaluation methods
2
Videos
- Evaluating design
- Case Study: Accessibility at Meta
5
Readings
- Evaluation cheat sheets
- Designing for accessibility
- Exercise: Heuristic evaluation
- Solution: Heuristic evaluation
- Additional resources
Best practice principles
-
2
Videos
-
2
Readings
-
1
Discussion
-
1
Assignment
1
Assignment
- Knowledge check: Best practice principles
1
Discussions
- Bad forms!
2
Videos
- Form design
- Components in UI design
2
Readings
- Form design best practice
- Additional resources
Evaluate Little Lemon website
-
3
Videos
-
3
Readings
-
2
Assignment
2
Assignment
- Knowledge check: Navigation and form design
- Module quiz: Evaluating interactive design
3
Videos
- Little Lemon evaluation
- Navigation best practices
- Module summary: Evaluating interactive design
3
Readings
- Little Lemon form breakdown
- Use of menu icons in navigation
- Additional resources
Figma Fundamentals
-
5
Videos
-
8
Readings
-
2
Assignment
2
Assignment
- Self-review: Design: Text hierarchy and grid
- Knowledge check: Type and text design
5
Videos
- Frames, layers and basic shapes
- Type and text
- Grids and constraints
- Manipulating elements
- Working with images
8
Readings
- Layers, groups and frames
- Typography and best practice
- Creating grids for tablets and mobile
- Grid systems
- How to save and import Figma files
- Exercise: Design - Text hierarchy and grid
- Solution: Design - Text and hierarchy grid
- Additional resources
Iterative design
-
3
Videos
-
7
Readings
-
3
Assignment
3
Assignment
- Self-Review: Create wireframe in Figma
- Self-review: Write a usability test
- Module quiz: Design and test
3
Videos
- Wireframing
- Usability testing
- Module summary: Applied design fundamentals
7
Readings
- Rapid prototyping
- Exercise: Create wireframe in Figma
- Solution: Create wireframe in Figma
- Usability test cheat sheet and template
- Exercise: Write a usability test
- Solution: Write a usability test
- Additional Resources
Enhancing your design
-
2
Videos
-
5
Readings
-
1
Discussion
-
2
Assignment
2
Assignment
- Self-review: Component Design
- Knowledge check: Enhancing your design
1
Discussions
- Share Component!
2
Videos
- Make it beautiful
- Stylize High-fidelity design
5
Readings
- Design elements principles
- Exercise: Design a component in Figma
- Solution: Design a component in Figma
- Mood boards in design
- Additional resources
Design Systems
-
2
Videos
-
4
Readings
-
2
Assignment
2
Assignment
- Self-review: Interactive component design
- Knowledge check: Design Systems
2
Videos
- What are design systems?
- Design systems in Figma
4
Readings
- Design systems
- Exercise: Interactive component design
- Solution: Interactive component design
- Additional resources
Prototyping, Sharing and testing your designs
-
4
Videos
-
4
Readings
-
1
Discussion
-
2
Assignment
2
Assignment
- Self-review: High-fidelity design prototype
- Module quiz: Design and test
1
Discussions
- Share your prototype
4
Videos
- Moving from design to prototyping
- Animate and test your prototype
- Case Study: How Meta uses micro interactions
- Module summary: Designing your UI
4
Readings
- Micro-interactions and micro-animations
- Exercise: High-fidelity design prototype
- Solution: High-fidelity design prototype
- Additional resources
Graded Assessment
-
1
Videos
-
3
Readings
-
1
PeerReview
-
1
Assignment
1
Assignment
- Final course quiz: Principles of UX and UI
1
Peer Review
- Booking a table on the Little Lemon website
1
Videos
- Course Recap for Principles of UX and UI
3
Readings
- About the final assessment
- Exercise: Booking a table on the Little Lemon website
- Solution: Booking a table on the Little Lemon website
Course wrap up
-
1
Videos
-
1
Readings
-
1
Discussion
1
Discussions
- Reflect on learning: What did you find most valuable in the course?
1
Videos
- Congratulations, you have completed Principles of UX UI design
1
Readings
- Next steps after Principles of UX UI design
Auto Summary
"Principles of UX/UI Design" is a foundational course in IT & Computer Science offered by Coursera. Taught by industry experts, it covers UX research, design, UI processes, and core design principles. Over 1320 minutes, learners will create user personas, wireframes in Figma, and MVP prototypes. Ideal for beginners with basic internet skills, the course prepares students for a career in UX/UI development. Subscription options include Starter and Professional.
Taught by Meta Staff