This is a submission for the GitHub Copilot Challenge : Transitions and Transformations
What I Built
This project is a web application that visualizes Perlin noise using a vertex shader in Three.js. The application includes interactive controls for playing and pausing an audio track, reloading the audio, and adjusting various visual parameters such as colors and bloom effects. The project demonstrates the use of Three.js for 3D graphics, shaders for visual effects, and dat.GUI for user interface controls.
Demo
-
Web Deployment
-
Video
Repo
You can find the public GitHub repository for this project here.
Copilot Experience
Throughout the development process, GitHub Copilot was an invaluable tool. I used Copilot for various tasks including:
Prompts: I provided Copilot with specific prompts to generate code for initializing Three.js scenes, creating shaders, and setting up dat.GUI controls.
Edits: Copilot assisted in refining and editing the generated code to ensure it met the project requirements.
Chat: I used the chat feature to ask Copilot for explanations and suggestions on how to implement certain features.
Autocomplete: Copilot's autocomplete feature helped speed up the coding process by suggesting relevant code snippets and completing lines of code.
Model Switcher: I switched between different models to get the best possible suggestions for my code, I find GPT4.0 is the best.
GitHub Models
I use GPT4-0.
Conclusion
This project was a great opportunity to explore the capabilities of GitHub Copilot and Three.js. Copilot's assistance made the development process more efficient and enjoyable. The project showcases how AI-powered tools can enhance the development of interactive web applications with complex visual effects. I look forward to further exploring the potential of Copilot in future projects.
Top comments (1)
Quite cool