Gambar 4.37 Storyboard
Layar Peta Rute
4.5 Merancang Grafik
Dalam merancang grafik, peneliti mambuat rancangan terpisah dengan menggunakan
software
yang berbeda, rancangan tersebut terdiri atas: Rancangan gambar, rancangan tombol dan pembuatan aplikasi.
4.5.1 Rancangan Gambar
Dalam membuat
background
dan merancang gambar yang diperlukan dalam membuat aplikasi ini, peneliti menggunakan
software
Adobe Photoshop CS3.
Software
ini baik digunakan untuk pengolahan gambar atau
image
. Hal pertama yang dilakukan untuk memulai rancangan adalah membuka
file
baru dengan cara memilih tombol
file
pada
toolbar
kemudian pilih
new,
atur
width, height
dan
resolution
yang dipakai kemudian ok.
Gambar 4.38
. Membuat
file
baru pada
Adobe Photoshop CS3
110
Kemudian buka
file
gambar yang digunakan untuk
background
, gambar peta rute
busway
. Setelah kedua gambar sudah pada kolom
layer
, ubah gambar menjadi
layer
.
Gambar 4.39
Mengubah
Layer Image
Kemudian tarik gambar tersebut ke
layer file
baru yang buat untuk menjadi
background
. Atur
colour balance
dan
curve
pada masing-masing gambar tersebut hingga menjadi transparan dari gambar awal. Setelah rancangan
background
selesai dibuat simpan dengan menekan tombol
file – save
pada
toolbar
, kemudian atur dengan format penyimpanan adalah .jpeg dengan
quality
12 kemudian tekan ok. 110
Gambar 4.40
Menyimpan
File
pada Adobe Photoshop CS3
Hasil rancangan
background
aplikasi : 110
Gambar 4.41
. Rancangan
Background
Aplikasi
4.5.2 Rancangan Tombol
Pembuatan animasi
button
atau tombol dalam membuat aplikasi ini menggunakan
software
Macromedia Firework 8. Animasi tombol ini dibuat dengan tujuan agar tampilan aplikasi terlihat lebih menarik dan untuk
mempermudah
user
dalam menggunakan aplikasi nantinya karena dengan animasi
link
yang berbeda. Pertama atur kanvas
size
yang diperlukan untuk membuat aplikasi.
Gambar 4.42
Mengatur Canvas Size Macromedia Fireworks 8
Kemudian
import file
, setelah
file
berada pada kanvas gunakan
rectangular marquee tool
lalu crop gambar yang digunakan. Atur
effect
pada
properties
antara
contrass
dan
brightness
dan gunakan
text tool
yang terdapat pada
toolbar
untuk menuliskan nama-nama tombol.
Gambar 4.43
Pengaturan
Properties
Setelah pembuatan tombol selesai, langkah berikutnya adalah dengan menyimpannya dengan formaf .jpeg caranya dengan memilih
file
pada
toolbar
110
kemudian pilih
export
dengan format
“image only”
Gambar 4.44
Menympan
File
pada Macromedia Fireworks 8
Dan sebelum di
import
ke dalan aplikasi ukuran tombol dapat dikecilkan jika ternyata terlalu besar dengan menggunakan
Microsoft Paint.
110
110
Gambar 4.45
Mengatur
Canvas Size
Macromedia Fireworks 8
Kemudian pilih i
mage
pada item pilihan. Lalu atur
strech or ckew
sesuai ukuran yang diinginkan. Di sini peneliti menggunakan ukuran
horizontal
10 dan
vertical
10.
Gambar 4.46
Pengaturan
Strech or Skew
Setelah selesai, langkah berikutnya adalah dengan mengimpannya dengan formaf .jpeg caranya dengan memilih
file
pada
toolbar
kemudian pilih
save as
dengan format “jpeg”. 110
110
110
Gambar 4.47
Simpan
File
Hasil rancangan tombol aplikasi :
Gambar 4.48
Tampilan Tombol
4.6 Memproduksi Sistem
Kategori