WebGL is a JavaScript API for rendering interactive 2D and 3D graphics within any compatible web browser. Using vertex shader, fragment shader that creates a program to draw objects.
In this project, students are needed to develop a photoshop/figma-like program, a shape editor program that uses the Web Development Framework and WebGL API.
Developed for the fulfillment of IF3260 Computer Graphics Project 1
This program allows users to create, edit, and visualize various 2D models interactively on a canvas. Users can draw lines, squares, rectangles, and polygons, as well as apply geometric transformations such as translation, rotation, and dilation to the objects.
There are also several features for each model, such as changing the color of vertices, moving vertices using drag-and-drop, and saving and reloading models. Additionally, some advanced features implemented in the program include Convex Hull for polygons, Animation, and implicit Vertex Locking.
To develop this program, pure WebGL is used without any external libraries for WebGL, but the use of other libraries to build the UI or other visual aspects is allowed.
Ensure that pnpm is installed
- Execute
pnpm install
- Execute
pnpm dev
The program is now running on localhost at the port displayed in the terminal
NIM | Name |
---|---|
13521060 | Fatih Nararya R.I. |
13521089 | Kenneth Ezekiel S. |
13521101 | Arsa Izdihar I. |