30
Universitas Sumatera Utara
Gambar 3.13 Pseudocode Dekripsi Vigenere
3.3. Perancangan Antarmuka Interface
Perancangan antarmuka interface merupakan
bagian yang penting dalam membangun sebuah sistem. Antarmuka yang dirancang harus memperhatikan
kenyamanan dan kemudahan pengguna dalam menjalankan sistem.
3.3.1. Screen launcher Screen launcher merupakan gambar yang muncul saat sistem dibuka pertama kali.
Screen launcher akan digunakan untuk menampilkan logo aplikasi saat sistem sedang melakukan proses untuk menampilkan halaman pengamanan. Rancangan screen
launcher dapat dilihat pada Gambar 3.14.
Kamus : ciphertext1, key1, key, plaintext : string
pesan, i, j, k : integer
Algoritma : Input ciphertext1
Input key1 For i=0; iciphertext1.length; i++
j = i key1.length key += key1.charAtj
EndFor For i=0; iciphertext1.length; i++
j = int ciphertext1.charAti k = {int} key.charAti
If j = k pesan = j-32 - k-32 95
Else pesan = j-32 + 95 – k-32 95
EndIf EndFor
pesan += 32 ciphertext += char pesan
EndFor return plaintext
Universitas Sumatera Utara
31
Universitas Sumatera Utara
Gambar 3.14 Rancangan Screen Launcher
3.3.2. Halaman pengamanan Halaman pengamanan merupakan halaman yang ditampilkan setelah screen launcher.
Halaman ini akan digunakan untuk memasukkan plaintext, key1 dan key2, melakukan proses enkripsi, serta menampilkan ciphertext2. Rancangan halaman Pengamanan
dapat dilihat pada Gambar 3.15.
Universitas Sumatera Utara
32
Universitas Sumatera Utara
Gambar 3.15 Rancangan Halaman Pengamanan
Pada Gambar 3.15 ditunjukkan bahwa halaman pengamanan terdiri dari beberapa komponen, yaitu Tab, Button, CheckBox, EditText dan TextView.
Keterangan komponen tersebut dapat dilihat pada Tabel 3.3.
Tabel 3.3 Keterangan Gambar Rancangan Halaman Pengamanan
No Keterangan
1 Tab Pengamanan untuk menampilkan halaman pengamanan
2 Tab Pengungkapan untuk menampilkan halaman pengungkapan
3 Button Bantuan untuk menampilkan halaman bantuan
4 Button Tentang untuk menampilkan halaman tentang
5 Button Reset untuk mengosongkan semua kolom masukkan
6 Button Enkripsi untuk memulai proses enkripsi
7 CheckBox Lihat Kunci 1 untuk menampilkan atau menyembunyikan key1
8 CheckBox Lihat Kunci 2 untuk menampilkan atau menyembunyikan key2
9 EditText Kunci 1 untuk memasukkan key1
10 EditText Kunci 2 untuk memasukkan key2
11 EditText Plaintext untuk memasukkan plaintext
12 TextView Ciphertext untuk menampilkan ciphertext2
Universitas Sumatera Utara
33
Universitas Sumatera Utara
3.3.3. Halaman pengungkapan Halaman pengungkapan merupakan halaman yang ditampilkan saat pengguna
menekan Tab Pengungkapan. Halaman ini akan digunakan untuk memasukkan ciphertext2, key1 dan key2, melakukan proses dekripsi serta menampilkan plaintext.
Rancangan halaman pengungkapan dapat dilihat pada Gambar 3.16
Gambar 3.16 Rancangan Halaman Pengungkapan
Pada Gambar 3.16 ditunjukkan bahwa halaman pengungkapan terdiri dari beberapa komponen, yaitu Tab, Button, CheckBox, EditText dan TextView.
Keterangan komponen tersebut dapat dilihat pada Tabel 3.4.
Universitas Sumatera Utara
34
Universitas Sumatera Utara
Tabel 3.4 Keterangan Gambar Rancangan Halaman Pengungkapan
No Keterangan
1 Tab Pengamanan untuk menampilkan halaman pengamanan
2 Tab Pengungkapan untuk menampilkan halaman pengungkapan
3 Button Bantuan untuk menampilkan halaman bantuan
4 Button Tentang untuk menampilkan halaman tentang
5 Button Reset untuk mengosongkan semua kolom masukkan
6 Button Dekripsi untuk memulai proses dekripsi
7 CheckBox Lihat Kunci 1 untuk menampilkan atau menyembunyikan key1
8 CheckBox Lihat Kunci 2 untuk menampilkan atau menyembunyikan key2
9 EditText Kunci 1 untuk memasukkan key1
10 EditText Kunci 2 untuk memasukkan key2
11 EditText Ciphertext untuk memasukkan ciphertext2
12 TextView Plaintext untuk menampilkan plaintext
3.3.4. Halaman bantuan Halaman bantuan merupakan halaman yang ditampilkan saat pengguna menekan
Button Bantuan. Halaman ini akan digunakan untuk membantu pengguna dalam menjalankan sistem. Rancangan halaman bantuan dapat dilihat pada Gambar 3.17.
Universitas Sumatera Utara
35
Universitas Sumatera Utara
Gambar 3.17 Rancangan Halaman Bantuan
Pada Gambar 3.17 ditunjukkan bahwa halaman bantuan terdiri dari beberapa komponen, yaitu Button, TextView dan FrameLayout. Keterangan komponen tersebut
dapat dilihat pada Tabel 3.5.
Tabel 3.5 Keterangan Gambar Rancangan Halaman Bantuan
No Keterangan
1 Button Kembali untuk kembali ke halaman pengamanan
2 Button Penggunaan untuk memberikan informasi penggunaan aplikasi
3 Button Algoritma untuk memberikan informasi algoritma yang digunakan
4 TextView Judul untuk menampilkan judul halaman
5 TextView Bantuan untuk menampilkan informasi yang dipilih
6 FrameLayout Komponen untuk menampilkan informasi komponen pada
halaman pengamanan atau pengungkapan
3.3.5. Halaman tentang Halaman tentang merupakan halaman yang ditampilkan saat pengguna menekan
Button Tentang. Halaman ini akan digunakan untuk menampilkan informasi tentang pembuat sistem. Rancangan halaman tentang dapat dilihat pada Gambar 3.18.
Universitas Sumatera Utara
36
Universitas Sumatera Utara
Gambar 3.18 Rancangan Halaman Tentang
Pada Gambar 3.17 ditunjukkan bahwa halaman tentang terdiri dari beberapa komponen seperti Button, TextView dan ImageView. Keterangan komponen tersebut
dapat dilihat pada Tabel 3.6.
Tabel 3.6 Keterangan Gambar Rancangan Halaman Tentang
No Keterangan
1 Button Kembali untuk kembali ke halaman pengamanan
2 TextView Judul untuk menampilkan judul halaman
3 ImageView untuk menampilkan informasi pembuat aplikasi
Universitas Sumatera Utara
Universitas Sumatera Utara
BAB 4 IMPLEMENTASI DAN PENGUJIAN