3.5. Perancangan Sistem dan Antarmuka Pemakai
Perancangan perangkat lunak keamanan pesan teks pada email terdiri dari penggambaran atau perencanaan dari beberapa elemen dalam pengembangan aplikasi.
Aplikasi ini digunakan untuk mengamankan enkripsi pesan teks lewat email. Aplikasi ini menerapkan algoritma RSA dan TTVC untuk mengamankan pesan teks.
3.5.1. Perancangan Database
Database pada aplikasi ini berfungsi untuk tempat penyimpanan data-data antara lain tabel pesan dan table tabeluser.
a. Tabel pesan Tabel ini berfungsi sebagai penyimpanan pesan antar user. Struktur tabel ini dapat
dilihat pada Tabel 3.1
Table 3.1 Tabel pesan
No Nama Field
Tipe Ukuran
Keterangan
1. Idpeasan Int
20 Nomor Id Pesan primary
key 2. Userid
Varchar 20
Nomor Id User 3. Kepada
Varchar 50
Email Tujuan 4. Subject
Varchar 50
Subject pesan 5. Encrypted
Text -
Pesan yang dienkripsi 6. Ekey1
Int 3
Kunci transposisi 1 7. Ekey2
Int 3
Kunci transposisi 2 8. Ekey3
Int 3
Kunci transposisi 3 9. Esubs1
Text -
Kunci subsitusi 1
Universitas Sumatera Utara
10. Esubs2 Text
- Kunci subsitusi 2
11. Esubs3 Text
- Kunci subsitusi 3
b. Tabel table user Tabel ini berfungsi sebagai tempat penyimpanan daftar user pada sistem. Struktur
tabel ini dapat dilihat pada Tabel 3.2
Table 3.2 Tabel table user
No Nama Field
Tipe Ukuran
Keterangan
1. User_id Varchar
20 Nomor Id User
2. Name Varchar
50 Nama User
3. Password Varchar
50 Password User
4. Email Varchar
50 Nama email user
5. Level Varchar
15 Membedakan User
3.5.2. Perancangan Relasi Antar Tabel
Rancangan relasi antar tabel berfungsi untuk menampilakn informasi relasi dependence antara tabel pada database. Rancangan relasi antar tabel dapat dilihat
seperti Gambar 3.3
Universitas Sumatera Utara
pesan PK
idpesan
userid kepada
subject encrypted
ekey1 ekey2
ekey3 esubs1
esubs2 esubs3
tabeluser
PK userid
name password
email level
FK1 idpesan
Gambar 3.4 Relasi Database
3.5.3. Rancangan Halaman Login
Rancangan halaman login berfungsi sebagai halaman utama untuk masuk ke sistem. Bentuk rancangan halaman login dapat dilihat seperti pada Gambar 3.4 berikut.
Gambar 3.5 Rancangan Halaman Login
1. password
2. username
3. enter
4. daftar
Universitas Sumatera Utara
Rancangan halaman login pada Gambar 3.4 terdapat empat komponen penting pada antarmuka, yaitu input form 1 dan 2 yang berfungsi untuk menampung
username dan password dari pengguna, tombol masuk 3 yang menunjukkan ke halaman home jika proses validasi username dan password benar, dan link daftar 4
yang berfungsi menunjukkan halaman daftar untuk user yang belum terdaftar.
3.5.4. Rancangan Halaman Daftar
Rancangan halaman daftar berfungsi untuk menampilkan input form untuk mendaftar pada sistem. Bentuk rancangan Home terlihat seperti pada Gambar 3.5.
Gambar 3.6 Rancangan Halaman Daftar
Rancangan halaman daftar pada Gambar 3.5 terdapat tujuh komponen penting pada antarmuka, yaitu input form1 sampai 5 yang menggambarkan sistem
menampung informasi seperti nama, user id, password, konfirmasi password, dan email sebagai parameter yang akan disimpan kedalam sistem, tombol
“daftar”6
1. Name
6. daftar 7. cancel
2. User Id 3. Password
4. Konfirmasi Password 5. Email
Universitas Sumatera Utara
untuk melakukan proses daftar, tombol ”cancel” 7 untuk membatalkan proses
pendaftaran.
3.5.5. Rancangan Halaman Home
Rancangan halaman home berfungsi sebagai halaman utama untuk masuk ke sistem. Bentuk rancangan halaman login dapat dilihat seperti pada Gambar 3.6 berikut.
Gambar 3.7 Rancangan Halaman Home
Rancangan halaman home pada Gambar 3.6 pada halaman home terdapat 7 komponen penting pada antarmuka, yaitu 1 header berfungsi sebagai nama dari
sistem, 2 tombol home untuk melakukan proses kembali ke halaman utama, 3 tombol compose untuk melakukan proses pengisian email, 4 tombol inbox untuk
melakukan proses pesan yang masuk, 5 tombol sent email untuk melakukan proses
1.Header
2.Home 3.Compose
4.Inbox 5.Sent Email
6.Log out 7.view
Universitas Sumatera Utara
laporan surat yang terkirim. 6 tombol log out untuk melakukan proses keluar dari sistem.7 view kotak untuk menampilkan proses keseluruhan proses tombol sistem.
3.5.6. Rancangan Halaman Compose
Rancangan halaman compose berfungsi sebagai halaman untuk membuat pesan teks yang akan diproses menjadi teks yang telah terenkripsi. Bentuk rancangan halaman
compose dapat dilihat seperti pada Gambar 3.7 berikut.
Gambar 3.8 Rancangan Halaman Compose
12.send 11.proses
2.to 3.subject
4.isi email
5.kunci transposisi 1 6.subsititusi vigenere 1
7.kunci transposisi 2 8.subsititusi vigenere 2
9.kunci transposisi 3 1.compose
10. subsititusi vigenere 3
Universitas Sumatera Utara
Rancangan halaman home pada Gambar 3.7 pada halaman compose terdapat 12 komponen penting pada antarmuka, yaitu 1 tombol compose untuk melakukan
proses pengisian email, 2 field tujuan berfungsi untuk mengisi alamat yang dituju, 3 field subject berfungsi untuk menulis subject surat, 4 field teks email berfungi
untuk menampung pesan teks, 5 field kunci transposisi pertama berfungsi untuk memasukkan kunci pertama . 6 field substitusi vigenere pertama berfungsi untuk
menampilkan hasil dari transposisi pertama . 7 field kunci transposisi kedua berfungsi untuk memasukkan kunci kedua.8 field substitusi vigenere kedua
berfungsi untuk menampilkan hasil dari transposisi kedua .9 field kunci transposisi ketiga berfungsi untuk memasukkan kunci ketiga.10 field substitusi vigenere ketiga
berfungsi untuk menampilkan hasil dari transposisi tiga. 11 tombol proses berfungsi untuk melakukan proses teks asli asli menjadi teks yag terenkripsi. 12 tombol send
berfungsi untuk mengirim pesan.
3.5.7. Rancangan Halaman inbox
Rancangan halaman inbox berfungsi sebagai halaman untuk melihat pesan yamg ada di dalam sistem. Bentuk rancangan halaman compose dapat dilihat seperti pada
Gambar 3.8 berikut.
Gambar 3.9 Rancangan Halaman Inbox
1.Inbox 2.No
3.Dari 4.Subject
5.Isi Email
Universitas Sumatera Utara
Rancangan halaman home pada Gambar 3.8 pada halaman inbox terdapat 5 komponen penting pada antarmuka, yaitu 1 tombol inbox untuk melakukan proses
pesan yang ada didalam sistem, 2 field No berfungsi untuk melihat urutan pesan yang ada didalam inbox, 3 field Dari berfungsi untuk memberikan informasi asal
pesan, 4 field subject berfungsi untuk menulis subject surat. 5 field isi email berfungsi untuk melihat pesan teks yang ada didalam email.
3.5.8. Rancangan Halaman Sent Email
Rancangan halaman inbox berfungsi sebagai halaman untuk melihat sent email yamg ada di dalam sistem. Bentuk rancangan halaman compose dapat dilihat seperti pada
Gambar 3.9 berikut.
Gambar 3.10 Rancangan Halaman Sent Email
Rancangan halaman home pada Gambar 3.9 pada halaman sent email terdapat 4 komponen penting pada antarmuka, yaitu 1 tombol sent email untuk melakukan
proses laporan surat yang terkirim, 2 field No berfungsi untuk melihat urutan pesan yang ada didalam inbox, 3 field To berfungsi untuk memberikan informasi tujuan
pesan z, 4 field subject berfungsi untuk menulis subject surat. 5 field isi email berfungsi untuk melihat pesan teks yang ada didalam email
1.Sent Email 2.No
3.To 3.Subject
4.Isi Email
Universitas Sumatera Utara
3.5.9. Rancangan Halaman Log Out
Gambar 3.11 Rancangan Halaman Log Out
Rancangan halaman home pada Gambar 3.10 pada halaman Log Out terdapat 1 komponen penting pada antarmuka, yaitu tombol log out untuk melakukan proses
keluar dari sistem. 1.Log Out
Universitas Sumatera Utara
BAB 4
IMPLEMENTASI DAN PENGUJIAN SISTEM
Pada bab ini akan dijelaskan tahapan selanjutnya dalam pengembangan aplikasi yaitu tahap implementasi dan pengujian sistem. Di sini akan dijelaskan tentang proses
pengimplementasian algoritma ke dalam sistem dan melakukan pengujian dari sistem yang dikembangkan.
4.1. Spesifikasi Perangkat Keras dan Perangkat Lunak