Threejs, Andreas
Workshop overview
This workshop intro is split in 2 parts.
1.) An introduction to the tools:
- 3D Alloy Extension in Wiki
- Scetchfab
- Mozilla HUBS/SPOKE
2.) A pratical part where you have time to apply the tools for your projects:
- Upload a 3D model to Scetchfab and use the
<a href="https://sketchfab.com/3d-models/kitchen-dining-set-4eeb76a3151f4de0a2fc08060c74cbbd?utm_medium=embed&utm_source=website&utm_campaign=share-popup" target="_blank" style="font-weight: bold; color: #1CAAD9;">Kitchen Dining Set</a> by <a href="https://sketchfab.com/steelefrau?utm_medium=embed&utm_source=website&utm_campaign=share-popup" target="_blank" style="font-weight: bold; color: #1CAAD9;">Steele</a> on <a href="https://sketchfab.com?utm_medium=embed&utm_source=website&utm_campaign=share-popup" target="_blank" style="font-weight: bold; color: #1CAAD9;">Sketchfab</a>
</html>
- Another example:
<html>
<div class="sketchfab-embed-wrapper">
<iframe title="A 3D model" width="640" height="480" src="https://sketchfab.com/models/5c4a12f4bd8f43c89849bc60fc1eb81b/embed?autospin=0.2&camera=0&preload=1&ui_controls=1&ui_infos=1&ui_inspector=1&ui_stop=1&ui_watermark=1&ui_watermark_link=1" frameborder="0" allow="autoplay; fullscreen; vr" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
<p style="font-size: 13px; font-weight: normal; margin: 5px; color: #4A4A4A;">
<a href="https://sketchfab.com/3d-models/coffe-table-5c4a12f4bd8f43c89849bc60fc1eb81b?utm_medium=embed&utm_source=website&utm_campaign=share-popup" target="_blank" style="font-weight: bold; color: #1CAAD9;">Coffe table</a>
by <a href="https://sketchfab.com/Oldfarmer?utm_medium=embed&utm_source=website&utm_campaign=share-popup" target="_blank" style="font-weight: bold; color: #1CAAD9;">Oldfarmer</a>
on <a href="https://sketchfab.com?utm_medium=embed&utm_source=website&utm_campaign=share-popup" target="_blank" style="font-weight: bold; color: #1CAAD9;">Sketchfab</a>
</p>
</div>
</html>
Further Links
- Sketchfab Forum: https://forum.sketchfab.com/
Mozilla SPOKE
Create 3D social scenes for Mozilla Hubs. Hubs is a social VR platform that runs right in your browser. With Hubs you can create your own virtual space with a single click and invite others to join using a URL. No installation process or app store required. Spoke is the built-in scene editor for creating environments that can be used in Hubs rooms. The editor runs entirely in the browser, and allows you to upload your own 3D models, images, and files to use in your projects. Spoke also contains building kits and integrations with various content providers to help you build.
How to use it
- Create account on HUBS: https://hubs.mozilla.com/#/
- Access SPOKE: https://hubs.mozilla.com/spoke/
- Create your scene in SPOKE
- Save it and access it in HUBS, share it with others by sharing the room-link
Further Links
- Detailed Documentation: https://hubs.mozilla.com/docs/spoke-creating-projects.html