3.4 Perancangan Interface
Perancangan ini merupakan rancang bangun dari percakapan antar pemakai dengan komputer. Proses ini terdiri dari proses pemasukan data kesistem, menampilkan output
informasi . Inilah tampilan dari aplikasi EnglishForKid yang penulis buat :
6. Form Menu Utama
Gambar 3.6 Rancangan Form Utama
Gambar diatas merupakan tampilan awal program yang penulis buat menggunakan aplikasi visual basic 6.0. Pada menu
Category, Let’s Sing, Quiz, About merupakan label yang sudah terhubung dengan form lain.
Category English For Kid
Quiz Let’s Sing
About
Menu
Universitas Sumatera Utara
7. Form Category
Gambar 3.7 Rancangan Form Category
Tampilan diatas merupakan form kategori yang berisi 16 gambar beserta nama dan arti dari gambar tersebut. Jika gambar di klik maka akan menampilkan suara
ejaan gari nama gambar yang sudah tertera.
8. Form Quiz
Gambar 3.8 Rancangan form utama quiz Play
Back Layout Flash
Back
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Name Meaning
Image
Universitas Sumatera Utara
Gambar diatas merupakan tampilan form quiz. Tampilan ini merupakan form dari visual basic yang disisipi dengan layout macromedia flash 8 dengan
menggunakan shockwave flash.
Cara mengambil shockwave file : a.
klik kanan pada toolbar visual basic 6.0 b.
klik component c.
Cari komponen shockwave flash dan Beri tanda centang d.
Maka toolbar shockwave flash akan muncul di toolbar. e.
Drag toolbar tersebut dan kemudian drop ke lembar kerja f.
Atur ukuran sesuai dengan yang diinginkan
9. Tampilan Form Let’s Sing
Gambar 3.9 Form Let’s Sing
Gambar diatas merupakan rancangan form visual basic yang disisipi dengan windows
Play Back
Layout Media Player
Universitas Sumatera Utara
media player. Cara insert media player sama seperti shockwave file.
Universitas Sumatera Utara
10. Tampilan form About
Gambar 3.10 Rancangan tentang programmer
Gambar diatas merupakan tampilan form visual basic untuk form about programmer. Terdiri atas bagian:
1. Image : merupakan foto dari penulis.
2. Biodata : beberapa keterangan tentang penulis.
3. Running text : yang berisi tulisan ―Thanks To Allah S.W.T, My Family and
also My Beloved Friends‖. Biodata
image
Running text
Universitas Sumatera Utara
Gambar 3.11 Rancangan tentang program
Gambar diatas merupakan tampilan rancangan dari program yng penulis buat. Terdiri atas :
a. Logo : merupakan gambar logo aplikasi program.
b. Tentang program : Berisi sedikit keterangan mengenai program.
c. Running text : berisi teks ― Dilarang mengkopi atau memyebarkan program
tanpa seizing pembuat‖. Tentang program
Logo
Running text
Universitas Sumatera Utara
BAB 4
IMPLEMENTASI SISTEM
4.1 Defenisi Implementasi Sistem
Kategori