• Tidak ada hasil yang ditemukan

ANALISIS DAN PERANCANGAN

3.2 Perancangan Sistem

3.2.1 Use Case Diagram

Use case diagram digunakan untuk menggambarkan hubungan antara pengguna dengan sistem. Gambar 3.2 merupakan use case diagram yang akan dibangun.

Gambar 3.2 Use case diagram sistem

Setiap use case dijelaskan dalam use case narrative. Tabel 3.1 sampai dengan tabel 3.6 merupakan use case narrative dari setiap use case yang ada di gambar 3.2.

Tabel 3.1 Use case narrative pengirim

Name Pengirim

Actors Pengguna

Trigger Pengguna memilih tab “Pengirim”

Preconditions Aplikasi telah berhasil dijalankan dan pengguna sudah menekan tombol “MASUK” pada jendela utama

Basic Flow of Events

1. Use case dimulai ketika pengguna menekan tab “Pengirim”

2. Sistem menampilkan halaman tab “Pengirim”

3. Pengguna melakukan inputan plainimage

4. Sistem menampilkan plainimage beserta nama file dan ukurannya

5. Pengguna melakukan inputan kunci 6. Sistem melakukan proses enkripsi

7. Sistem menampilkan hasil proses enkripsi dan waktu proses enkripsi

8. Pengguna menyimpan hasil proses enkripsi 9. Pengguna melakukan inputan cipherimage II

10. Sistem menampilkan cipherimage II beserta nama file dan ukurannya

11. Sistem melakukan proses dekripsi

12. Sistem menampilkan hasil proses dekripsi dan waktu proses dekripsi

13. Pengguna menyimpan hasil proses dekripsi Alternative

Pengguna dapat melihat dan menyimpan hasil enkripsi dan dekripsi citra dengan menggunakan algoritma Vigenere Cipher

Tabel 3.2 Use case narrative enkripsi Vigenere Name Enkripsi Vigenere

Actors Pengguna

Trigger Pengguna menekan tombol “ENKRIPSI”

Preconditions Terdapat plainimage dalam form dan kunci telah diinputkan ke dalam sistem

Basic Flow of Events

1. Use case dimulai ketika pengguna menekan tombol

“ENKRIPSI”

2. Sistem melakukan proses enkripsi

3. Sistem menampilkan hasil proses enkripsi dan waktu proses

Sistem menampilkan hasil proses enkripsi dan waktu proses enkripsi

Tabel 3.3 Use case narrative dekripsi Vigenere Name Dekripsi Vigenere

Actors Pengguna

Trigger Pengguna menekan tombol “DEKRIPSI”

Preconditions Terdapat cipherimage II dalam form Basic Flow of

Events

1. Use case dimulai ketika pengguna menekan tombol

“DEKRIPSI”

2. Sistem melakukan proses dekripsi

3. Sistem menampilkan hasil proses edekripsi dan waktu proses

Sistem menampilkan hasil proses dekripsi dan waktu proses enkripsi

Tabel 3.4 Use case narrative penerima

Name Penerima

Actors Pengguna

Trigger Pengguna memilih tab “Penerima”

Preconditions Aplikasi telah berhasil dijalankan dan pengguna sudah menekan tombol “MASUK” pada jendela utama

Basic Flow of Events

1. Use case dimulai ketika pengguna menekan tab “Penerima”

2. Sistem menampilkan halaman tab “Penerima”

3. Pengguna melakukan inputan cipherimage I

4. Sistem menampilkan cipherimage I beserta nama file dan ukurannya

5. Pengguna membangkitkan kunci

6. Sistem menampilkan kunci yang sudah dibangkitkan 7. Sistem melakukan proses enkripsi

8. Sistem menampilkan hasil proses enkripsi dan waktu proses enkripsi

9. Pengguna menyimpan hasil proses enkripsi 10. Pengguna melakukan inputan cipherimage III

11. Sistem menampilkan cipherimage III beserta nama file dan ukurannya

12. Sistem melakukan proses dekripsi

13. Sistem menampilkan hasil proses dekripsi dan waktu proses dekripsi

14. Pengguna menyimpan hasil proses dekripsi Alternative

Flows

Tidak ada

Post Conditions

Pengguna dapat melihat dan menyimpan hasil enkripsi dan dekripsi citra dengan menggunakan algoritma One Time Pad

Tabel 3.5 Use case narrative enkripsi One Time Pad Name Enkripsi One Time Pad

Actors Pengguna

Trigger Pengguna menekan tombol “ENKRIPSI”

Preconditions Terdapat cipherimage I dalam form dan kunci telah diinputkan ke dalam sistem

Basic Flow of Events

1. Use case dimulai ketika pengguna menekan tombol

“ENKRIPSI”

2. Sistem melakukan proses enkripsi

3. Sistem menampilkan hasil proses enkripsi dan waktu proses enkripsi

Alternative Flows

Tidak ada

Post Conditions

Sistem menampilkan hasil proses enkripsi dan waktu proses enkripsi

Tabel 3.6 Use case narrative dekripsi One Time Pad Name Dekripsi One Time Pad

Actors Pengguna

Trigger Pengguna menekan tombol “DEKRIPSI”

Preconditions Terdapat cipherimage III dalam form Basic Flow of

Events

1. Use case dimulai ketika pengguna menekan tombol

“DEKRIPSI”

2. Sistem melakukan proses dekripsi

3. Sistem menampilkan hasil proses edekripsi dan waktu proses dekripsi

Alternative Flows

Tidak ada

Post Conditions

Sistem menampilkan hasil proses dekripsi dan waktu proses enkripsi

3.2.2 Activity Diagram

Activity diagram digunakan untuk menggambarkan secara grafis berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi dan bagaimana berhenti. Gambar 3.3 merupakan activity diagram untuk use case pengirim dan penerima.

Gambar 3.3 Activity diagram sistem

3.2.3 Sequence Diagram

Sequence diagram merupakan diagram yang menggambarkan interaksi antara pengguna dan sistem untuk skenario use case. Sequence diagram membantu untuk menggambarkan data yang masuk dan data yang keluar. Gambar 3.4 merupakan sequence diagram sistem yang akan dibangun untuk use case pengirim dan penerima.

Gambar 3.4 Sequence diagram sistem 3.2.4 Pseudocode

Pseudocode merupakan kode yang menyerupai instruksi kode program yang sebenarnya sesuai dengan bahasa pemrograman yang akan digunakan.

a. Algoritma Vigenere Cipher

Algoritma Vigenere Cipher terdiri dari dua fungsi, yaitu fungsi enkripsi dan fungsi dekripsi. Pseudocode untuk masing-masing fungsi ditunjukkan pada tabel 3.7 dan tabel 3.8.

Tabel 3.7 Pseudocode enkripsi Vigenere Cipher

Tabel 3.8 Pseudocode dekripsi Vigenere Cipher

Keterangan pseudocode enkripsi dan dekripsi Vigenere Cipher:

1. i sebagai indeks dari tinggi (height) citra yang diurutkan.

2. j sebagai indeks dari lebar (width) citra yang diurutkan

Function enkripsivigenere()

3. r adalah variabel untuk menampung nilai red pada piksel yang ditunjuk oleh indeks j, i

4. g adalah variabel untuk menampung nilai green pada piksel yang ditunjuk oleh indeks j, i

5. b adalah variabel untuk menampung nilai blue pada piksel yang ditunjuk oleh indeks j, i

6. Variabel indeks fungsinya adalah sebagai indeks untuk kunci Vigenere.

b. Algoritma One Time Pad

Algoritma One Time Pad juga terdiri dari dua fungsi, yaitu fungsi enkripsi dan fungsi dekripsi. Pseudocode untuk masing-masing fungsi ditunjukkan pada tabel 3.9 dan tabel 3.10.

Tabel 3.9 Pseudocode enkripsi One Time Pad

c. Pengacakan Kunci

Function enkripsionetimepad() r=0

g=0 b=0 indeks=0

For (i=0; i<h; i++){

For(j=0; j<w; j++){

r=(R piksel citra_c1(j,i)+kunciotp[indeks])%256 g=(G piksel citra_c1(j,i)+kunciotp[indeks])%256 b=(B piksel citra_c1(j,i)+kunciotp[indeks])%256

atur warna piksel citra_c1(j,i) }

}

Tabel 3.10 Pseudocode dekripsi One Time Pad

Keterangan pseudocode enkripsi dan dekripsi One Time Pad:

1. i sebagai indeks dari tinggi (height) citra yang diurutkan.

2. j sebagai indeks dari lebar (width) citra yang diurutkan

3. r adalah variabel untuk menampung nilai red pada piksel yang ditunjuk oleh indeks j, i

4. g adalah variabel untuk menampung nilai green pada piksel yang ditunjuk oleh indeks j, i

5. b adalah variabel untuk menampung nilai blue pada piksel yang ditunjuk oleh indeks j, i

6. Variabel indeks fungsinya adalah sebagai indeks untuk kunci One Time Pad.

c. Pengacakan kunci

Pseudocode untuk pengacakan kunci One Time Pad dilihat pada tabel 3.11.

Tabel 3.11 Pseudocode acak kunci One Time Pad

Function dekripsionetimepad()

Keterangan pseudocode acak kunci One Time Pad:

1. kunci_otp sebagai variabel array yang menampung nilai dalam jumlah banyak 2. kunci sebagai variabel yang membantu menampung nilai hasil acak

3. i sebagai indeks dari panjang piksel suatu citra yang diproses secara berurut 4. rndotp.Next(0,256) sebagai fungsi untuk mengacak nilai di antara 0 sampai

dengan 256

3.2.5 Flowchart

Flowchart atau diagram alir merupakan gambar atau bagan yang memperlihatkan hubungan antar proses dan pernyataanya.

a. Flowchart algoritma Vigenere Cipher

Flowchart untuk enkripsi dan dekripsi pada algoritma Vigenere Cipher di tunjukkan pada gambar 3.5.

Gambar 3.5 Flowchart algoritma Vigenere Cipher Mulai

Plainimage, Kunci

Cipherimage

Plainimage

Selesai P = (C - K) mod n C = (P + K) mod n

b. Flowchart algoritma One Time Pad

Flowchart untuk enkripsi dan dekripsi pada algoritma One Time Pad ditunjukkan pada gambar 3.6.

Gambar 3.6 Flowchart algoritma One Time Pad c. Flowchart pengacakan kunci

Flowchart untuk pengacakan kunci Vigenere Cipher dan One Time Pad dilihat pada gambar 3.7.

Mulai

Plainimage, Kunci

Cipherimage

Plainimage

Selesai P = (C - K) mod n C = (P + K) mod n

Gambar 3.7 Flowchart acak kunci One Time Pad c. Flowchart Sistem

Secara umum, sistem memiliki tiga halaman utama yang dipilih oleh pengguna, yaitu pengirim, penerima dan tentang. Flowchart sistem yang menunjukkan alur kerja sistem secara sistematis ditunjukkan pada gambar 3.8, berikut ini.

Mulai

Bilangan acak

Selesai

Acak bilangan sebanyak jumlah piksel pada citra

Citra

Gambar 3.8 Flowchart sistem

Mulai

Lanjut

Pengirim Plainimage,

Kunci Vigenere

Ukuran plainimage

sesuai

Cipherimage I Enkripsi Vigenere

Penerima Cipherimage I,

Kunci OTP Enkripsi

OTP Cipherimage II

Pengirim

Cipherimage II

Dekripsi Vigenere

Cipherimage III

Penerima Cipherimage III Dekripsi

OTP Plainimage

Tentang Informasi tentang aplikasi

Selesai

3.2.6 Perancangan Antarmuka (Interface)

Antarmuka merupakan sarana interaksi antara pengguna dengan sistem. Tujuan perancangan antarmuka adalah untuk mempermudah dalam implementasi.

1. Halaman utama

Halaman utama merupakan tampilan awal sistem saat pertama kali dijalankan.

Rancangan halaman utama ditunjukkan pada gambar 3.9.

Gambar 3.9 Rancangan antarmuka halaman utama Keterangan gambar:

1. Label digunakan untuk judul sistem.

2. Picture box digunakan untuk logo universitas.

3. Button digunakan untuk masuk ke dalam sistem.

2. Halaman tentang

Halaman tentang memberkan informasi umum mengenai sistem ini. Gambar 3.10 merupakan rancangan antarmuka halaman tentang.

Gambar 3.10 Rancangan antarmuka halaman tentang Keterangan gambar:

1. TabControl berfungsi untuk menunjukkan halaman-halaman yang tersedia pada sistem.

2. RichTextBox berguna untuk menampilkan informasi umum sistem.

3. PictureBox berguna untuk menampilkan logo universitas.

4. PictureBox berguna untuk menampilkan foto penulis.

3. Halaman pengirim

Halaman pengirim merupakan halaman yang digunakan untuk mengenkripsi dan mendekripsi pesan dengan menggunakan algoritma Vigenere Cipher. Pesan yang sudah dienkripsi di halaman ini disimpan dahulu kemudian dienkripsi kembali di halaman

penerima. Lalu, hasil enkripsi dari halaman penerima didekripsi di halaman pengirim.

Gambar 3.11 merupakan rancangan antarmuka halaman pengirim.

Gambar 3.11 Rancangan antarmuka halaman pengirim Keterangan gambar:

1. TabControl berfungsi untuk menunjukkan halaman-halaman yang tersedia pada sistem

2. GroupBox berguna untuk mengelompokkan form untuk lebih teratur.

3. RichTextBox berguna untuk memasukkan kunci Vigenere Cipher.

4. Button digunakan untuk memasukkan kunci Vigenere Cipher.

5. Button digunakan untuk mereset halaman pengirim dan penerima.

6. Label digunakan untuk menampilkan kata “Plainimage”.

7. PictureBox digunakan untuk menampung plainimage.

8. Button digunakan untuk mengunggah plainimage.

9. Label digunakan untuk menampilkan kata “Nama File”.

10. TextBox digunakan untuk menampilkan nama file plainimage.

11. Label digunakan untuk menampilkan kata “Ukuran Gambar”.

12. TextBox digunakan untuk menampilkan lebar dari plainimage.

13. Label digunakan untuk menampilkan huruf “x”.

14. TextBox digunakan untuk menampilkan panjang dari plainimage.

15. Label digunakan untuk menampilkan kata “piksel”.

16. Label digunakan untuk menampilkan kata “Cipherimage I”.

17. PictureBox digunakan untuk menampung cipherimage I.

18. Button digunakan untuk memulai proses enkripsi menggunakan algoritma Vigenere Cipher.

19. Button digunakan untuk menyimpan cipherimage I.

20. Label untuk menampilkan kata “Running time”.

21. TextBox digunakan untuk menampilkan waktu proses enkripsi Vigenere Cipher.

22. Label digunakan untuk menampilkan kata “ms”.

23. Label digunakan untuk menampilkan kata “Cipherimage II”.

24. PictureBox digunakan untuk menampung cipherimage II.

25. Button digunakan untuk mengunggah cipherimage II.

26. Label digunakan untuk menampilkan kata “Nama File”.

27. TextBox digunakan untuk menampilkan nama file cipherimage II.

28. Label digunakan untuk menampilkan kata “Ukuran Gambar”.

29. TextBox digunakan untuk menampilkan lebar dari cipherimage II.

30. Label digunakan untuk menampilkan huruf “x”.

31. TextBox digunakan untuk menampilkan panjang dari cipherimage II.

32. Label digunakan untuk menampilkan kata “piksel”.

33. Label digunakan untuk menampilkan kata “Cipherimage III”.

34. PictureBox digunakan untuk menampung cipherimage III.

35. Button digunakan untuk memulai proses dekripsi menggunakan algoritma Vigenere Cipher.

36. Button digunakan untuk menyimpan cipherimage III.

37. Label untuk menampilkan kata “Running time”.

38. TextBox digunakan untuk menampilkan waktu proses dekripsi Vigenere Cipher.

39. Label digunakan untuk menampilkan kata “ms”.

4. Halaman penerima

Halaman penerima merupakan halaman yang digunakan untuk mengenkripsi dan mendekripsi pesan dengan menggunakan algoritma One Time Pad. Pesan yang sudah dienkripsi di halaman pengirim dienkripsi kembali di halaman ini. Hasil enkripsi pada halaman ini didekripsi di halaman pengirim. Kemudian hasil dekripsi pada halaman pengirim didekripsi kembali pada halaman penerima ini. Gambar 3.12 merupakan rancangan antamuka halaman penerima.

Gambar 3.12 Rancangan antarmuka halaman penerima Keterangan gambar:

1. TabControl berfungsi untuk menunjukkan halaman-halaman yang tersedia pada sistem

2. GroupBox berguna untuk mengelompokkan form untuk lebih teratur.

3. RichTextBox berguna untuk menampilkan kunci One Time Pad.

4. Button digunakan untuk mengacak kunci One Time Pad.

5. Button digunakan untuk mereset halaman pengirim dan penerima.

6. Label digunakan untuk menampilkan kata “Cipherimage I”.

7. PictureBox digunakan untuk menampung cipherimage I.

8. Button digunakan untuk mengunggah cipherimage I.

9. Label digunakan untuk menampilkan kata “Nama File”.

10. TextBox digunakan untuk menampilkan nama file cipherimage I.

11. Label digunakan untuk menampilkan kata “Ukuran Gambar”.

12. TextBox digunakan untuk menampilkan lebar dari cipherimage I.

13. Label digunakan untuk menampilkan huruf “x”.

14. TextBox digunakan untuk menampilkan panjang dari cipherimage I.

15. Label digunakan untuk menampilkan kata “piksel”.

16. Label digunakan untuk menampilkan kata “Cipherimage II”.

17. PictureBox digunakan untuk menampung cipherimage II.

18. Button digunakan untuk memulai proses enkripsi menggunakan algoritma One Time Pad.

19. Button digunakan untuk menyimpan cipherimage II.

20. Label untuk menampilkan kata “Running time”.

21. TextBox digunakan untuk menampilkan waktu proses enkripsi One Time Pad.

22. Label digunakan untuk menampilkan kata “ms”.

23. Label digunakan untuk menampilkan kata “Cipherimage III”.

24. PictureBox digunakan untuk menampung cipherimage III.

25. Button digunakan untuk mengunggah cipherimage III.

26. Label digunakan untuk menampilkan kata “Nama File”.

27. TextBox digunakan untuk menampilkan nama file cipherimage III.

28. Label digunakan untuk menampilkan kata “Ukuran Gambar”.

29. TextBox digunakan untuk menampilkan lebar dari cipherimage III.

30. Label digunakan untuk menampilkan huruf “x”.

31. TextBox digunakan untuk menampilkan panjang dari cipherimage III.

32. Label digunakan untuk menampilkan kata “piksel”.

33. Label digunakan untuk menampilkan kata “Plainimage”.

34. PictureBox digunakan untuk menampung plainimage.

35. Button digunakan untuk memulai proses dekripsi menggunakan algoritma One Time Pad.

36. Button digunakan untuk menyimpan plainimage.

37. Label untuk menampilkan kata “Running time”.

38. TextBox digunakan untuk menampilkan waktu proses dekripsi One Time Pad.

39. Label digunakan untuk menampilkan kata “ms”.

BAB IV

Dokumen terkait