On May 5, 2024, I saw a tweet from Alex Widua , who created a SwiftUI prototype that I really liked.
So, I decided to reproduce it using Svelte and WebGL. For the challenge, I didn’t want to use any external libraries, I did everything from scratch, which helped me better understand WebGL & GLSL.
Overview
- Making the controls
- Setup the scene with WebGL
- Building the shader with GLSL
- Implementing the motion blur effect
- Enjoying the result
Before diving into anything else, I recognized my aversion to the standard operating system inputs. To address this, I set out to create aesthetically pleasing Apple-style controls. My first endeavor was implementing a Range Slider.
Subsequently, I developed a knob component specifically designed to manipulate the direction of the motion blur effect.
These are not perfect i admit it but actually they work! i’m happy with the result. i’m planning to improve them in the future. i’m open to any suggestions and feedbacks. i hope you like them. thank you for reading
… more to come !