Creating a 360 Viewer Desktop App with Electron.js, Three.js and Materialize

0 ratings
I want this!

Creating a 360 Viewer Desktop App with Electron.js, Three.js and Materialize

Quinston Pimenta
0 ratings

Watch the full video at https://youtu.be/RDYbom9WkMk

Hey there, my name is Quinston and I am the CTO and Co-Founder of QuarkExp, a 360 / VR company based in Pune. We have been creating beautiful 360 / VR experiences for our clients since 2016 and I am eager to share what I have learned with as many people as possible. 

In this ebook, we shall learn about how to Create a 360 Image Viewing Desktop App with Electron.js, Three.js and Materialize from writing the first line of code to actually packaging and distributing the application. The app will run on both Mac and Windows and we will be covering how to write platform-specific code.

Use the app we will be building...

Windows App (.exe file)

Mac App (.dmg file)

Libraries Used

Electron.js is a library that allows us to build cross-platform applications with HTML, CSS and Javascript a lot of popular companies like Slack, Twitch.tv and my personal favorite, Visual Studio Code use.

Three.js allows us to add 3D Graphics to our application. It abstracts the complexities of WebGL and allows us to focus on the things that actually matter.

Materialize is a library that lets us use Material Design Components that are designed according to the specifications of Google’s Material Design Spec.

Key points

  •     Literally starting from Scratch (no boilerplate code used).
  •     Detailed explanations of every Concept.
  •     Focusing on User Experience.
  •     Writing Platform-specific code.
  •     Modifying OrbitControls.js for Keyboard Support.
  •     Implementing Right Click to Open Image (Mac and Windows).
  •     Using electron-builder to package code to .exe or .dmg.
  •     Access to the full codebase!

This is not for you if...

  •     You do not know what is console.log(); in Javascript.

This is for you if...

  •     You want to learn a new skillset.
  •     You want to learn how to build a desktop app from scratch.
  •     You want to learn how to use 3D graphics in Electron.js with Three.js.
  •     You want full access to the codebase.

I hope this product provides you with as much value as I believe it will.

This product is created in association with Quark Experiences Pvt. Ltd. 

You can find us at https://quarkexp.com

This product is not currently for sale.
246 KB
56 pages
Powered by