diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/.gitignore b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/.gitignore
new file mode 100644
index 00000000..b58b603f
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/code.iml b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/code.iml
new file mode 100644
index 00000000..24643cc3
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/code.iml
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/modules.xml b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/modules.xml
new file mode 100644
index 00000000..23968dc6
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/.idea/modules.xml
@@ -0,0 +1,8 @@
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/index.html b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/index.html
new file mode 100644
index 00000000..027ae1e7
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+ CT404: Assignment 01
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/index.js b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/index.js
new file mode 100644
index 00000000..04bf26ec
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/index.js
@@ -0,0 +1 @@
+console.log('Happy developing ✨')
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/package.json b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/package.json
new file mode 100644
index 00000000..8fc35c5e
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/package.json
@@ -0,0 +1,10 @@
+{
+ "name": "code",
+ "version": "1.0.0",
+ "description": "",
+ "main": "index.js",
+ "scripts": {
+ "test": "echo \"Error: no test specified\" && exit 1"
+ },
+ "private": true
+}
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/script.js b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/script.js
new file mode 100644
index 00000000..3b110658
--- /dev/null
+++ b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/script.js
@@ -0,0 +1,91 @@
+const canvas = document.getElementById('myCanvas');
+const ctx = canvas.getContext('2d');
+
+// set canvas dimensions
+canvas.width = window.innerWidth;
+canvas.height = window.innerHeight;
+
+// draw the stick figures
+draw();
+
+// Draw stick figure function
+function drawStickFigure(x, y) {
+ ctx.lineWidth = 3;
+ ctx.strokeStyle = 'black';
+
+ // draw the stick figure's head
+ ctx.beginPath();
+ ctx.arc(x, y - 30, 20, 0, Math.PI * 2);
+ ctx.stroke();
+
+ // draw the stick figure's left eye
+ ctx.beginPath();
+ ctx.arc(x - 7, y - 33, 1, 0, Math.PI * 2);
+ ctx.stroke();
+
+ // draw the stick figure's right eye
+ ctx.beginPath();
+ ctx.arc(x + 7, y - 33, 1, 0, Math.PI * 2);
+ ctx.stroke();
+
+ // draw the stick figure's mouth
+ ctx.beginPath();
+ ctx.arc(x, y - 25, 6, 0, Math.PI);
+ ctx.stroke();
+
+ // Body
+ ctx.beginPath();
+ ctx.moveTo(x, y - 10);
+ ctx.lineTo(x, y + 50); // Length of body
+ ctx.stroke();
+
+ // Arms
+ ctx.beginPath();
+ ctx.moveTo(x - 30, y + 10); // Left arm
+ ctx.lineTo(x + 30, y + 10); // Right arm
+ ctx.stroke();
+
+ // Legs
+ ctx.beginPath();
+ ctx.moveTo(x, y + 50); // Start at bottom of body
+ ctx.lineTo(x - 20, y + 100); // Left leg
+ ctx.moveTo(x, y + 50);
+ ctx.lineTo(x + 20, y + 100); // Right leg
+ ctx.stroke();
+}
+
+// Animation function
+// function animate() {
+// ctx.clearRect(0, 0, canvas.width, canvas.height); // Clear the canvas
+//
+// drawStickFigure(x, y); // Draw stick figure at current position
+//
+// // Update position
+// x += dx;
+// y += dy;
+//
+// // Check boundaries and reverse direction if necessary
+// if (x + 20 > canvas.width || x - 20 < 0) dx = -dx; // Horizontal boundary check
+// if (y + 100 > canvas.height || y - 50 < 0) dy = -dy; // Vertical boundary check
+//
+// requestAnimationFrame(animate); // Recursive call to keep animation going
+// }
+
+// Start animation
+// animate();
+
+function draw() {
+ // prompt the user to enter a number in a range and not continuing under a number in that range is selected
+ let numberStickFigures = 0;
+ while (numberStickFigures < 1 || numberStickFigures > 5) {
+ numberStickFigures = prompt("Enter an integer between 1 and 5");
+ }
+
+ for (let i = 1; i <= numberStickFigures; i++) {
+ // place the stick figure randomly on the canvas
+ const x = Math.floor(Math.random() * canvas.width);
+ const y = Math.floor(Math.random() * canvas.height);
+
+ drawStickFigure(x, y);
+ }
+}
\ No newline at end of file
diff --git a/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/styles.css b/year4/semester1/CT404: Graphics & Image Processing/assignments/assignment1/code/styles.css
new file mode 100644
index 00000000..e69de29b