• Pompeu Fabra logo

3D Graphics for Web Developers

Use WebGL to develop high-quality, interactive 3D graphics applications that run natively in browsers.

18,096 enrolled on this course

3D graphics using WebGLStudio
  • Duration

    5 weeks
  • Weekly study

    6 hours

Start programming 3D graphics applications for the web

This free online course will provide web developers, who have existing knowledge of JavaScript, with the theoretical and practical knowledge to start programming 3D graphics applications for the web.

Most graphics courses start with the very basics. In this course, we take a top-down approach, starting with very high-level scene-editing tools, before drilling down and creating applications with increasing levels of complexity.

Download video: standard or HD

Skip to 0 minutes and 11 seconds The world of 3D graphics is amazing. Whether if it’s in the latest blockbuster videogame, a new animated film from a big Hollywood studio, or simply a new interactive experience, that lets you view information in a new way. It seems that the amount and variety of amazing 3D applications, and their uses, is growing exponentially.

Skip to 0 minutes and 38 seconds Until recently, the web was a mere “hanger-on” in this world, because if you wanted to embed any 3D graphics on a given page, you needed to rely on a third party plugin, and hope that your user didn’t mind installing it. But no longer. The advent of WebGL, and its now almost complete support across all devices means that we, web-developers, can write 3D code which can be executed directly by the web-browser, with no plugins, and no installations whatsoever.

Skip to 1 minute and 11 seconds So, if you’re a web developer, who wants to know how to get started in the world of browser based 3D graphics, this course is for you. We’ll start with a high-level overview of the basics of 3D graphics, using browser-based tools to explain core concepts in a simple and logical way. Then, we’ll type some code, and start creating some applications, starting slow and simple, before going a bit deeper, and using some pre-created 3D assets, to make some great web-based applications.

Skip to 1 minute and 46 seconds If all that sounds good to you, then sign up now, to take your first steps on the journey of 3D web graphics.

What topics will you cover?

  • 3D Scene creation using web-based tools
  • Visual appearance using WebGL
  • Introduction to Three.js
  • Textures, Controls and Materials
  • Apply advanced settings to a 3D scene

Learning on this course

On every step of the course you can meet other learners, share your ideas and join in with active discussions in the comments.

What will you achieve?

By the end of the course, you‘ll be able to...

  • Describe basics of the 3D graphics
  • Explore how WebGL applications can be built in conjunction with standard web technologies
  • Develop an intermediate-level 3D scene
  • Apply an intermediate-level 3D scene on the web
  • Evaluate an intermediate-level 3D scene

Who is the course for?

This course is designed for existing web developers who have little or no previous experience in creating 3D graphics applications. You should be capable of manipulating the DOM using JavaScript or JQuery, and familiar with the concepts of AJAX. You should also have at least intermediate-level programming skills and be comfortable manipulating arrays and objects.

Who will you learn with?

A professor at the Department of ICT at UPF and the coordinator of 3D graphics team in Interactive Technologies Group. His research interests are Character Animation, Serious Games and 3D Graphics.

3D programmer and researcher at Universitat Pompeu Fabra. My expertise is in 3D Graphics and Videogames for the Web using standard Technologies. I had coded several 3D engines using Javascript.

Who developed the course?

Pompeu Fabra University Barcelona

Universitat Pompeu Fabra (UPF) is a public, international and research-intensive university in Barcelona. In just 25 years, it has earned a place for itself among the best universities in Europe.

Learning on FutureLearn

Your learning, your rules

  • Courses are split into weeks, activities, and steps to help you keep track of your learning
  • Learn through a mix of bite-sized videos, long- and short-form articles, audio, and practical activities
  • Stay motivated by using the Progress page to keep track of your step completion and assessment scores

Join a global classroom

  • Experience the power of social learning, and get inspired by an international network of learners
  • Share ideas with your peers and course educators on every step of the course
  • Join the conversation by reading, @ing, liking, bookmarking, and replying to comments from others

Map your progress

  • As you work through the course, use notifications and the Progress page to guide your learning
  • Whenever you’re ready, mark each step as complete, you’re in control
  • Complete 90% of course steps and all of the assessments to earn your certificate

Want to know more about learning on FutureLearn? Using FutureLearn

Do you know someone who'd love this course? Tell them about it...

You can use the hashtag #FL3Dgraphics to talk about this course on social media.