66
No Nama
Desain Keterangan
8. Menu Profil
Pada halaman profil berisi identitas
pengembang. Pada pojok kanan atas
terdapat judul menu. Pada pojok kiri atas
terdapat tombol home untuk kembali ke menu
utama. Pada pojok kanan
bawah terdapat tombol exit untuk keluar dari
aplikasi.
4. Tahap Penulisan Kode-kode Program
Tahap implementasi merupakan tahap pembuatan media pembelejaran perakitan komputer berdasarkan desain yang telah dibuat pada tahap
sebelumnnya. Berikut ini beberapa langkah yang dilakukan pada tahap implementasi ini.
a. Pembuatan Desain Interface
Pembuatan desain interface dilakukan dengan mengacu pada tahap
perancangan desain interface. Antarmuka yang dibangun disesuaikan dengan
storyboard yang telah dibuat pada tahap perancangan desain interface. Dalam tahap ini
software yang digunakan adalah Corel Draw X5 dan Abode Photoshop CS6. Corel Draw X5 digunakan untuk mendesain semua
asset dalam media yang meliputi
background, tombol, soal, isi halaman tujuan, isi halaman SK-KD, isi halaman profil, isi halaman tujuan, dan lain-lain. Abode Photoshop CS6
digunakan untuk mengkonversi format file icon tombol dan gambar-gambar komponen komputer pada halaman soal ke dalam bentuk png. Berikut ini desain
67
interface yang ada dalam media pembelajaran perakitan komputer ini yang telah dibuat sesuai dengan
storyboard : 1
Splash screen, merupakan halaman awal yang pertama kali muncul. Halaman ini merupakan halaman branding dari produk Unity 3D. Halaman ini
merupakan halaman asli yang dibuat otomatis oleh software Unity 3D.
Desain halaman ini berisi logo Unity 3D yang muncul beberapa detik. Desain tersebut dapat dilihat pada Gambar 12.
Gambar 13. Halaman Intro 2
Halaman menu utama, merupakan halaman utama dari media pembelajaran ini. Pada halaman ini terdapat beberapa menu yang dapat diakses oleh
pengguna. Menu-menu tersebut antara lain menu SK-KD, menu Tujuan, menu Soal, menu Let’s Begin, menu Bantuan, menu Profil, dan menu Keluar.
Menu SK-KD berfungsi untuk menampilkan halaman SK-KD. Menu Tujuan
68
berfungsi untuk menampilkan halaman tujuan pembelajaran. Menu Soal berfungsi untuk menampilkan halaman latihan soal. Menu Let’s Begin
berfungsi untuk masuk ke dalam materi perakitan komputer. Menu Bantuan berfungsi untuk menampilkan halaman petunjuk penggunaan. Menu Profil
berfungsi untuk menampilkan halaman profil pengembang. Menu keluar berfungsi untuk menutup aplikasi. Desain menu utama dapat dilihat pada
Gambar 13.
Gambar 14. Halaman Menu Utama 3
Halaman SKKD, merupakan halaman yang berisi penyampaian Standar Kompetensi dan Kompetensi Dasar yang memuat materi perakitan
komputer. Standar kompetensi dan kompetensi dasar yang disampaikan dalam halaman ini disesuaikan dengan silabus dari sekolah. Pada halaman ini
juga terdapat tombol home dan tombol keluar. Tombol home berfungsi
69
untuk kembali ke halaman menu utama. Sedangkan tombol keluar berfungsi untuk keluar dari aplikasi. Desain halaman SKKD dapat dilihat pada Gambar
14.
Gambar 15. Halaman SKKD 4
Halaman Tujuan, merupakan halaman yang berisi penyampaian tujuan pembelajaran
yang memuat
materi perakitan
komputer. Tujuan
pembelajaran yang disampaikan dalam halaman ini disesuaikan dengan silabus dari sekolah. Pada halaman ini juga terdapat tombol
home dan tombol keluar. Tombol
home berfungsi untuk kembali ke halaman menu utama. Sedangkan tombol keluar berfungsi untuk keluar dari aplikasi. Desain
halaman tujuan dapat dilihat pada Gambar 15.
70
Gambar 16. Halaman Tujuan Pembelajaran 5
Halaman Let’s Begin, merupakan halaman yang berisi materi perakitan komputer. Halaman ini terdiri dari beberapa tampilan sebelum memasuki
materi. Tampilan tersebut berupa urutan petunjuk dan halaman load kamera.
a Halaman Petunjuk Penggunaan, merupakan halaman yang berisi
pengarahantata cara menggunakan media. Pada halaman ini juga terdapat tombol start yang berfungsi untuk masuk ke halaman selanjutnya. Desain
halaman petunjuk penggunaan dapat dilihat pada Gambar 16.
71
Gambar 17. Halaman Petunjuk Penggunaan Materi b
Halaman Load Kamera, merupakan halaman ketika kamera pada device mulai mencari marker yang cocok dengan yang tertanam pada sistem. Pada
halaman ini juga terdapat tombol home dan tombol keluar. Tombol home
berfungsi untuk kembali ke halaman menu utama. Sedangkan tombol keluar berfungsi untuk keluar dari aplikasi. Desain halaman
load kamera dapat dilihat pada Gambar 17.
72
Gambar 18. Halaman Load Kamera
c Halaman materi 3D, merupakan halaman yang muncul ketika kamera
berhasil mengenali marker. Ilustrasi yang muncul pada halaman ini adalah objek 3D berupa komponen komputer. Desain halaman ini dapat dilihat pada
Gambar 18.
73
Gambar 19. Halaman Materi 3D d
Halaman materi video, merupakan halaman yang muncul ketika kamera berhasil mengenali marker. Ilustrasi yang muncul pada halaman ini adalah
video yang menerang tata cara melakukan perakitan komputer. Desain halaman ini dapat dilihat pada Gambar 19.
74
Gambar 20. Halaman Materi Video e
Halaman pengaturan kamera, merupakan halaman yang berisi pengaturan kamera pada
device. Pengaturan yang dapat dilakukan berupa pengaturan kamera depanbelakang, autofocus, fullscreen, flash, dan lain-lain. Desain
halaman pengaturan kamera dapat dilihat pada Gambar 20.
75
Gambar 21. Halaman Pengaturan Kamera 6
Halaman Soal, merupakan halaman yang berisi latihan soal tentang komponen-komponen motherboard dan port IO. Tampilan dalam halaman
ini berupa tampilan penampang motherboard dan port IO serta input text. Cara mengerjakan soal latihan ini adalah pengguna harus menyebutkan
nama komponen yang ditunjukkan oleh anak panah denga cara mengisi jawaban ke dalam input text. Pada halaman ini terdapat tombol
submit yang berfungsi untuk mengecek halaman dan tombol
next yang berfungsi untuk masuk ke soal selanjutnya. Pada halaman ini juga terdapat tombol
home dan tombol keluar. Tombol
home berfungsi untuk kembali ke halaman menu utama. Sedangkan tombol keluar berfungsi untuk keluar dari aplikasi. Desain
halaman soal dapat dilihat pada Gambar 21.
76
Gambar 22. Halaman Latihan Soal 7
Halaman Bantuan, merupakan halaman yang berisi penjelasan tombol- tombol yang terdapat dalam media serta cara penggunaan media. Pada
halaman ini juga terdapat tombol home dan tombol keluar. Tombol home
berfungsi untuk kembali ke halaman menu utama. Sedangkan tombol keluar berfungsi untuk keluar dari aplikasi. Desain halaman bantuan dapat dilihat
pada Gambar 22.
77
Gambar 23. Halaman Bantuan 8
Halaman Profil, merupakan halaman yang berisi identitas pengembang. Pada halaman ini juga terdapat tombol
home dan tombol keluar. Tombol home berfungsi untuk kembali ke halaman menu utama. Sedangkan tombol keluar
berfungsi untuk keluar dari aplikasi. Desain halaman profil dapat dilihat pada Gambar 23.
78
Gambar 24. Halaman Profil
b. Pembuatan Program
