Modul ini membahas tentang transformasi dan animasi objek 2D. Terdapat empat kompetensi dasar yang meliputi pemahaman fungsi transformasi, pembuatan multi objek, pemahaman prinsip animasi objek 2D, dan pembuatan animasi objek 2D. Materi yang dibahas meliputi transformasi objek 2D melalui translasi, rotasi, dan skala serta pembuatan animasi menggunakan timer function. Praktikum meliputi latihan transformasi dan animasi objek 2D dengan menggunakan fun

1. MODUL 3
Transformasi dan Animasi Objek 2D
A. KOMPETENSI DASAR
• Memahami fungsi-fungsi transformasi (translasi, rotasi, skala).
• Memahami dan dapat membuat multi objek menggunakan fungsi transformasi.
• Memahami prinsip-prinsip pembuatan animasi objek 2D.
• Membuat animasi objek 2D.
B. ALOKASI WAKTU
2 js (2x50 menit)
C. PETUNJUK
Awali setiap aktivitas dengan do’a, semoga berkah dan mendapat kemudahan.
Pahami Tujuan, dasar teori, dan latihan-latihan praktikum dengan baik dan benar.
Kerjakan tugas-tugas dengan baik, sabar, dan jujur.
Tanyakan kepada asisten/dosen apabila ada hal-hal yang kurang jelas.
D. DASAR TEORI
TRANSFORMASI OBJEK 2 D
Transformasi Objek 2D, terbagi menjadi 3 jenis perubahan, yaitu translasi (perubahan posisi), rotasi
(perputaran) dan skala (perubahan ukuran).
1. Fungsi dasar untuk Translasi (perubahan Posisi) objek
GLAPI void APIENTRY glTranslated(GLdouble x, GLdouble y, GLdouble z);
GLAPI void APIENTRY glTranslatef(GLfloat x, GLfloat y, GLfloat z);
2. Fungsi dasar untuk Rotasi objek
GLAPI void APIENTRY glRotated(GLdouble angle, GLdouble x, GLdouble y, GLdouble z);
GLAPI void APIENTRY glRotatef(GLfloat angle, GLfloat x, GLfloat y, GLfloat z);
3. Fungsi dasar untuk skala (perubahan ukuran) objek
void APIENTRY glScaled( GLdouble x, GLdouble y, GLdouble z );
GLAPI void APIENTRY glScalef( GLfloat x, GLfloat y, GLfloat z );

2. ANIMASI OBJECT 2D
1. Fungsi dasar pembuatan animasi dengan menggunakan TimerFunction
GLUTAPI void APIENTRY glutTimerFunc(unsigned int millis, void
(GLUTCALLBACK *func)(int value), int value);
Dalam penggunaan glutTimerFunc dimungkinkan untuk membuat sebuah animasi yang
dikontrol oleh waktu.
2. Inisialisasi dalam penggunaan Timer Function
Fungsi dari glutPostRedisplay adalah mengirimkan perintah untuk mengaktifkan
display secara berkala (looping).
Kemudian pada main program perlu menambahkan fungsi untuk mengaktifkan timer function
C. JOB SHEET PRAKTIKUM
TRANSFORMASI OBJECT 2D
1. Berikut adalah script dasar untuk kegiatan praktikum transformasi objek 2D
glutInitWindowPosition(100,100);
glutInitWindowSize(480,480);
dan
gluOrtho2D(-320.,320.,-320.,320.);
2. Buatlah project baru pada Visual Studio dengan nama prak3-translasi. Fungsi drawQuad adalah
callback function glDisplayFunc();. Tambahkan fungsi glTranslatef(50,0,0) pada
posisi [a], [b], [c], dan [d]. Tampilkan hasil eksekusi a, b, c, dan d berupa screenshot. Beri
kesimpulan dari kegiatan 1 ini.

3. 3. Tetap pada projek yang sedang aktif, hilangkan semua fungsi glTranslatef(x, y,z) dari a,
b, c, d sehingga fungsi menjadi:
Tambahkan fungsi callback untuk glutDisplayFunc(render);
Pada fungsi render tersebut terdapat 2 fungsi drawQuad yang dipanggil, dimana masing-
masing merupakan objek terpisah. Terdapat pula fungsi –fungsi yang belum diaktifkan (dalam
comment), lakukan perubahan nilai RGB pada 2 warna sehingga menjadi merah untuk fungsi
glColor3f pertama dan putih untuk fungsi glColor3f yang kedua. Ubahlah nilai x,y,z pada fungsi
glTranslatef(x,y,z) sehingga tampilan menjadi bendera Indonesia. Tampilkan screenshotnya dan
program.
4. Pada fungsi render tersebut ubahlah fungsi glTranslatef(…) menjadi fungsi glRotatef(45,1,0,0);
Ubahlah parameter sudut, x,y,z dan tampilkan screenshot tiap perubahan (x,y,z)yang dilakukan,
gambarkan bagaimana rotasi (x,y,z) diberlakukan pada koordinat 3 dimensi glut.
5. Pada fungsi render tersebut ubahlah fungsi glRotatef(…) menjadi fungsi glScalef(x,y,z);
Ubahlah parameter x,y,z satu per satu dan tampilkan screenshot tiap perubahan (x,y,z) yang
dilakukan, gambarkan bagaimana skala (x,y,z) diberlakukan pada koordinat 3 dimensi glut.

4. ANIMASI OBJECT 2D
Berikut adalah script dasar untuk kegiatan praktikum animasi objek 2D.
dan
Berikut adalah fungsi untuk glutTimerFunc(int millis, *function, int value);
1. Buatlah project baru pada Visual Studio dengan nama prak3-timerRotasiZ. Gunakan fungsi
Quads untuk membuat segi empat. fungsi display sebagai callback function yang di dalamnya
berisi transformasi rotasi.
void Persegi(){
glBegin(GL_QUADS);
glVertex2i(x0,y0);
glVertex2i(x1,y1);
glVertex2i(x2,y2);
glVertex2i(x3,y3);
glEnd();
}
Fungsi display sebagai callback function yang di dalamnya berisi transformasi translasi. Ubah
variabel agar dapar berputar pada sumbu z unclockwise.
void display (){
glClear(GL_COLOR_BUFFER_BIT);
glRotatef(angle,x,y,z);
Persegi();
glFlush();
}
Tambahkan fungsi timer sebagai Inisialisasi dalam penggunaan Timer Function. Terakhir
panggil fungsi timer pada main program. Set unsign millis=100. Jelaskan apa yang terjadi!
Tampilkan source codenya. Berikan kesimpulan!

5. 2. Modifikasi kode program pada latihan 1, kemudian atur objek untuk berotasi terhadap sumbu y
clockwise. Ubahlah parameter unsign millis menjadi lebih besar dari sebelumnya. Tampilkan
source codenya. Berikan kesimpulan!
3. Modifikasi kode program pada latihan 2, kemudian atur objek untuk berotasi terhadap sumbu x
clockwise. Ubahlah parameter unsign millis menjadi lebih kecil dari sebelumnya. Tampilkan
source codenya. Berikan kesimpulan!
4. Buatlah project baru pada Visual Studio dengan nama prak3-timerTranslasiX. Gunakan fungsi
drawQuad untuk membuat segi empat.
Fungsi display sebagai callback function yang di dalamnya berisi transformasi translasi. Untuk
membuat animasi, tambahkan fungsi counter berikut:
if (x<200){
x += 4; }
void renderScene(){
glClear(GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(x,0,0);
Draw();
glPopMatrix();
glFlush();
}
Ubahlah statement di atas sehingga segi empat dapat berjalan mengikuti sumbu x
positif.Tampilkan source codenya. Berikan kesimpulan!
Note: Inisialisasikan terlebih dahulu variabel x, y, z.
5. Modifikasi program pada latihan 4. Ubahlah parameternya sehingga segi empat dapat berjalan ke
arah sumbu y negatif. Tampilkan source codenya. Berikan kesimpulan!
6. Modifikasi program pada latihan 5. Ubahlah parameternya sehingga segi empat dapat berjalan ke
arah sumbu z positif. Tampilkan sorce codenya. Berikan kesimpulan!

6. D. TUGAS ASISTENSI
1. Buatlah tampilan dimana akan menghasilkan tampilan seperti di bawah ini. Sajikan screenshot
hasil dan program.
Note : hanya menggunakan satu fungsi bangun 2D, modifikasi menggunakan fungsi tranlasi,
rotasi, dan skala.
2. Buatlah suatu bangun persegi, kemudian terletak tepat di tengah pop up windows. Kemudian
bangun bergerak berputar dengan lintasan belah ketupat dengan gerakan yang simetris. Sajikan
sintaks dan screenshootnya.

7. 3. Buatlah sebuah bentuk jam analog sederhana dengan minimal empat tempat petunjuk angka dan
menggunakan 3 jarum. Jarum jam berbutar sesuai dengan timer per detik waktu nyata. Sajikan
sintaks dan screenshootnya.
4. Buatlah bintang-bintang kecil dengan berbagai macam warna dan ukuran, yang bertebaran
sepanjang salah satu diagonal window (harus ada translasi, rotasi, dan skala). Jumlah minimal
bintang-bintang adalah 10. Sajikan sintaks dan screenshootnya.