All courses

Développement

Design a Mock-up for Web Development With Figma

Discover how to design the visual aspect of a web page. In this course, you’ll draw a layout with paper and pencil first, and then create it in Figma!
Easy
6 hours
Interested in this free-access course?

As a developer, you might think that you only need to take care of code. But you’d be wrong! To be a good developer, you also need to know how to collaborate effectively. When creating a product, everyone involved needs to be able to agree on a visual design.

The good news is that mock-ups are here to help you with this! They help improve coordination between everyone involved in creating a website—users, developers, and designers. Learn to use mock-ups, and you’ll reap the rewards! 

In this course, you’ll learn how to make mock-ups work for you! At this stage, you won’t always have access to a perfectly designed mock-up for coding, so we'll learn the basics of creating mock-ups together to help you be more independent

So, if you want to learn to use mock-ups to make professional collaboration easier and save time when developing, join me now on this course!

Learning outcomes

  • Draw a wireframe on paper
  • Build a wireframe in Figma
  • Create your first mock-up in Figma

Requirements

Prerequisites:

None! This course is accessible to all.

Tools Required:

  • Paper and pencil
  • The free version of Figma

Contributors

Instructors

Mike Miello

I make websites to help businesses look pro, be found, and grow online - Learn more at my website: Webodew.com

Alexia Toulmet

Développeuse frontend passionnée par l'enseignement 👩‍💻

Created by

Last updated: 1/23/2025
License

Développement

Design a Mock-up for Web Development With Figma

Easy
6 hours
Free-access course