Department of Computer Science and Software Engineering

CITS3003 Graphics & Animation 2022 — Lab1

Unit Coordinator & Lecturer

Dr. Naeha Sharif

 

Lab Facilitators

David Charkey

Jasper Paterson

 

Consultation Time

Thursdays, 3:00-4:00pm.

Where: Room 1.05 in CSSE
and online (active in consultation hour)

 

News:

  • [28 Feb'22] Welcome to CITS3003

Getting Started with OpenGL and 2D graphics

Objectives:

In this lab's exercises, you will
  • need to download and extract the libraries and OpenGL examples associated with the recommended text,
  • learn how to compile and execute some 2D examples,
  • make some small changes to the code of these examples,
  • build an "absolutely minimal scene editor" (you won't believe how minimal!)

You are expected to complete this lab using the machines provided in one of the CSSE labs. For the online students, we are using Linux (Red hat) on the lab machines (but ubuntu should also be fine on your machines).

  1. Downloading and extracting

    1. Create a directory (folder) in your home directory (e.g. cits3003) to keep all your work for this unit.
    2. Download labs-examples.zip to this directory.
    3. Extract the files from the zip file, either via the right-click menu in the folder or the terminal command:
        unzip labs-examples.zip
    4. Check that you now have a folder with all the examples for the various chapters of the recommended text.
  2. Building via make and executing

    1. Open a terminal window. Type in the terminal window:
      cd cits3003/labs-examples/CHAPTER02_CODE/LINUX_VERSIONS
      The command above would change the working directory to the specified directory name. In the terminal window, type: ls. You should see a number of sample C++ programs (.cpp files) and a file with the name Makefile.
    2. Build the first example from example1.cpp via the command:
      make example1
    3. Execute the first example via the command:
      ./example1
    4. Check that an OpenGL window like the following opens with many points drawn from the Sierpinski Gasket, and close it by presing Escape.

    5. Build and execute also example2 (and other examples if you wish).
    6. Useful make commands:
      make example1
      builds example1 (or other examples similarly) or rebuilds it if any files it depends on have changed, including example1.cpp.
      make makes all programs in the current directory from their cpp files.
      make clean removes various intermediate and backup files.
      make clobber removes the built executables and various intermediate and backup files.
  3. Instantiating, building and executing your own OpenGL program

    1. Because of the way the Makefile works, you'll need to put your program in a similar place alongside the examples (due to, e.g., ../../Common/InitShader.cpp).


      There's a few ways to do this -- Recommended is copying the entire labs-examples/CHAPTER02_CODE directory to labs-examples/lab1 via:

      cd ~/cits3003/labs-examples
      cp -r CHAPTER02_CODE lab1
      cd lab1/LINUX_VERSIONS
      make clobber
    2. Copy example1.cpp to q1circle.cpp by typing: cp example1.cpp q1circle.cpp.
    3. Edit q1circle.cpp with your favourite Linux editor - if you don't have a favourite yet, just double click for the default or right click to select one.
    4. Read through the code. For now, don't worry too much about all the OpenGL commands, you will encounter those in the lectures.
    5. Your goal is to modify this program (i.e., the q1circle.cpp file) so that it generates the same number of points, but when a point is not inside a circle of radius 1.0 centred at the origin, i.e, (0.0,0.0), it skips it and chooses another point.

      Hints:

      • the function length(p) will return the distance from a point p to the origin.
      • you can do this just by adding two lines of code.

    6. If you need hints on geometry or programming, just ask in the lab.
    7. Build your program via make, execute and test it, and verify that produces something similar to the following.


  4. Building an "absolutely minimal scene editor"

    1. Similarly make a second copy q2pointsScene.cpp from example1.cpp and modify it to implement an "absolutely minimal scene editor" that simply allows you to directly specify a "scene" of 2D points in the points array similarly to the way the vertices array is specified in the original code.

      Hint: you really don't need to write any code here, just list the coordinates that points is initialized with, and remove the code that previously set the coordinates.

    2. Arrange some points in a scene. Here's a sample arrangement (with glutInitWindowSize( 256, 256 );):



      (Now all we need is solid shapes, colours, 3D, rotations, camera movement, complex shapes, perspective, lighting, materials, textures and animation. Oh, and editing without having to change the program.)

  5. Building an "almost absolutely minimal scene editor"

    1. Similarly make a copy q3triangleScene.cpp from example2.cpp and modify it to implement an "almost absolutely minimal scene editor" that simply allows you to directly specify a "scene" of 2D triangles in the points array.
    2. Arrange some triangles in a scene. Here's a sample arrangement:



      (Now all we need is colours, 3D, rotations, camera movement, complex shapes, perspective, lighting, materials, textures and animation. Oh, and editing without having to change the program.)

  6. Building a "mostly absolutely minimal scene editor" (optional)

    • Use the remaining Chapter 2 examples to help you add colour and simple 3D to your triangle scene editor.

  7. Sample Solutions


Department of Computer Science and Software Engineering

This Page

Website Feedback:
naeha(dot)sharif(at)uwa(dot)edu(dot)au