Outcome: Create your own unique blender like animation with the power of voxels, JavaScript and Three.js, that remind you of those minecraft animations that you watched as a child. This jam is different to other animations workshops because it focuses more on world and story design because there is a restriction to only use Voxels. Further more the every member will need to create their own scene that will be animated and created from scratch.
Requirements: Replit Access and basic JavaScript knowledge
Language used: JavaScript
Customization opportunity: Create your own voxel based, blender like animation. You are able to customize the camera motion and even each individual voxel to create your dream animation. Each voxel can be customized with different colors and even textures making each voxel unique!
Platform Limitations: Browser-based Replit Development, so available on all platforms
Time estimation: 1 Hour
- Set up: Fork a replit starter with necessary materials. ( approx. 2-7 minutes, let's say 5 )
- Part 1: Create a
Play
button so you can play the animation. ( approx. 5 minutes since it is a simple html button ) - Part 2: Implement a basic renderer using ThreeJS ( approx. 6 minutes )
- Part 3: Add the functionality for the animation to be recorded ( approx. 4 minutes, calls 3 library functions )
- Part 4: Create the map that the animation will live in ( approx. 40 minutes+ should be enought to create a low detail scene )
- Success!!! Now you've got an animation.
Make sure your proposal (similar to the one above) answer these questions about your Jam idea:
- How will you ensure that every outcome of the workshop varies (i.e. how will you give jammers a sense of ownership over their project)?
Every animation should physically be impossible to be replicated unknowingly. As such every jammer will have their own unique and lovely animation.
Each person would be encouraged to create a unique animation that is totally different to each other, animations can be fun or even wacky! Each member could think of a basic animation idea to create or we can provide a "pool of idea" that members are encouraged to use but it will have a system in place to allow one idea per person. This will encourage simplicity as to not waste that much time on details but the animation itself to make it fun. At the end the animation should be something simple. Some ideas that come to mind are: Simple house animation, A rectangle earth with "meteors" coming down to it, A stable name with the camera zooming out, A cube that expands - Why should Hack Clubbers care about this project? Hack Clubbers should care about this project because it gives them JavaScript experience in a lovely and fun way. Moreover it gives them an entry to the world of game development and animation that is currently seeing a rapid increase.
- General outline of a club meet doing the Jam
- The club leader will show initial setup
- The club leader will showcase how to add the play button, record, renderer functionality
- Each member will create their own scene and animation.
- The club leader uploads their animations to the gallery
- What Club Members will walk away with (both in terms of knowledge and in terms of product) Club members will walk away with a better understanding of JavaScript and 3D space in general.
- What makes this workshop fun or interesting for Club Members? This workshop will be fun, interesting and exciting for all Club members because they will have fun coding unique animations. Moreover they will gain insight to the exciting world of Game development and 3D Animations.
- What platforms will be supported (i.e. MacOS, Windows, Chromebook, Mobile, Browser, etc)? All platforms that support replit will be supported but Desktop is preferred.
- How will you allow Club Leaders to add their own project to the Jam presentation (giving them a sense of ownership over the meeting)? I will create a gallery of animations that all leaders will be able to submit their members animations.