Skip to content

JA2. Learning Journal 2

1. Discuss the week’s activities and your observations. Be sure to cite references using APA format

I started this week by topping up the first week’s reading as I did not have a chance to finish. I then started reading this week’s material while creating example files trying the reading’s examples myself through simple HTML/JS files, which I created a dozen of them.

The topics of this week (and what was left from the previous week) included picture transformations (translation, scaling, and rotation), viewing pipelines, OpenGL fundamentals: OpenGL pipeline, event listening, clipping, and viewport mappings (Mbise, 2017). It also included Three.js topics such as geometry, materials, lighting, and other features such as shadows, textures, and raycasting (Eck, 2018).

Did anything surprise you?

I was surprised that the triangle is the most basic shape in the mesh’s structure; I expected it to be the point; but building complex shapes from triangles takes much less computation than points, as each triangle can be rendered as a unit skipping the processing of every point in the triangle which in turn saves a lot of computations (Dunn, 2024).

I was also surprised by how powerful the Indexed Face Set (IFS) data structure is in representing complex shapes with simple primitives. It is helpful in structuring complex shapes such as curves and uneven surfaces by assembling a large number of small faces into a single mesh (Eck, 2018).

Did you face any challenges in this Unit? If so, how did you overcome them?

The first challenge was the typeless nature of HTML/JS files which makes linting and debugging harder and time consuming; that is, I had to visit Three.js documentation to know the types of the parameters and return values of the functions I was using, and what are the properties that are available for each object or class. I solved this issue by using TypeScript which provides type checking and autocompletion. Setting up the project was a bit challenging, but I managed to do it; I am hosting my code here: https://github.com/ahmad-ali14/AY2025-T2-CS4406.

The second challenge was the difficulty in imagining 3D shapes while creating them; that is, to come up with the right coordinates for the vertices and faces to create the desired shape. The first solution was that I manually change the values and see the changes in the browser and adjust. Later, I learned more about the Three.js debugging techniques such as showing grids, axes, wireframes, and labels which helped me making sense of what I see. I also learned about event listeners such as OrbitControls and listening to user input to control thimgs like light, rotation, and other aspects of the scene. I created a useful control panel in my base scene that visible in the sidebar of my first assignment: https://ahmad-ali14.github.io/AY2025-T2-CS4406/unit2/

2. Discuss where Computer Graphics are being used in everyday aspects of your life

Computer Graphics (CG) is a field that is widely used in many industries to create and consume visual content. CG is in the heart of many industries such as entertainment (movies and shows), advertising, gaming, education, medical, engineering, user interfaces, and many more (Thomas, 2024). The text will discuss some of these industries.

In the entertainment industry, CG is used to add visual effects to movies and shows such as explosions, increasing number of actors (huge armies), etc; some of the most popular movies include Avatar and Jurassic Park. Gaming industry relies completely on GC to create worlds, characters in the games, etc. Advertising industry uses CG to create eye-catching, logos, leaflets, etc.

In the medical industry, CG is used in medical imaging and scanning, surgery simulations, and many more. In many fields of engineering such as architecture, interior design, and civil engineering, CG is used to create 3D models of buildings and designs; in fact, many engineering fields rely on Computer Aided Design (CAD) software to create and simulate designs. In the education industry, CG is used to create interactive learning materials, charts, and other visual aids.

In my opinion, the most important use of CG is in user interfaces; let be the web, mobile, desktop, or even virtual reality; we use this technology every day to interact our screens. Every mouse movement, click, or touch that interact with the screen will result in every pixel on the screen reevaluated, and then redrawn to reflect the new state.

References

‌