ANALISA DAN PERANCANGAN 3.1 Analisa Sistem Dalam tahap ini penulis menganalisa kebutuhan dasar sistem. Analisa dilakukan terhadap data-data yang merepresentasikan masalah, sehingga dapat diketahui spesifikasi kebutuhan sistem yang akan dibangun. Agar aplikasi dapat berjalan dengan baik, maka diperlukan rancangan algoritma. Secara garis besar algoritma dari perancangan aplikasi image to text akan ditunjukkankan pada Gambar 3.1. Keterangan: Gambar 3.1. Diagram alir apikasi image to text 25
1) Buka gambar, bertujuan untuk menampilkan gambar (jpg, bmp dan gif) yang nantinya akan di convert menjadi gambar teks 2) Atur gambar teks, user dapat mengganti teks dan dapat mengatur besar kecilnya gambar teks 3) Image to text, proses mengubah gambar asli menjadi gambar teks yang terdiri dari beberapa proses lain 4) Simpan, user dapat menyimpan gambar teks hasil proses tesebut Image to text, merupakan kumpulan dari proses yang digunakan untuk dapat mengubah gambar (Jpg, Bmp dan Gif) menjadi gambar teks (gambar yang dibuat dari sekumpulan karakter), proses image to text akan menggunakan proses Grayscaling. Gambar 3.2. Diagram alir proses image to text
Proses Grayscaling adalah proses untuk mengubah gambar yang memiliki warna (true color) menjadi gambar yang memiliki tingkat warna abu-abu (graylevel). Gambar yang akan dilakukan grayscaling nilai tiap titiknya akan disamakan, nilai Red, Green, dan Blue sehingga tiap titik hanya memiliki 1 nilai yang disebut nilai gray-level. Gambar 3.3. Diagram alir proses Grayscaling 3.2 Perancangan Sistem Perancangan dapat didenifisikan sebagai penggambaran, perencanaan dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah ke dalam satu kesatuan yang utuh dan berfungsi. Dalam perancangan suatu sistem tidak lepas dari hasil analisis sistem, karena setelah mendapatkan hasil analisis baru dapat dibuat suatu rancangan sistem.
Dalam tahap ini akan dijelaskan secara rinci perancang aplikasi yang dengan mengunakan pemodelan use case diagram, sequence diagram dan activity diagram. 3.2.1 Pemodelan Diagram Use Case Use case merupakan suatu gambaran atau konstruksi dari sistem yang akan dibuat. Pada Aplikasi image to text menggunakan Visual Basic 6.0, dapat diidentifikasi bahwa aktor utamanya adalah user (pengguna). Dari identifikasi aktor tersebut, maka akan didapatkan satu diagram use case dan beberapa skenario yang memperlihatkan interaksi-interaksi use case dengan aktor. Use case diagram aplikasi ini dapat dilihat pada gambar 3.4. Gambar 3.4. Diagram use case aplikasi image to text Berikut adalah deskripsi use case yang telah digambarkan di atas : Tabel 3.2. Use case Buka Gambar Nama Aktor Deskripsi Buka Gambar User User dapat memilih gambar dengan format (jpg,bmp dan gif) yang akan dibuka.
Tabel 3.3. Use case Buka Gambar (Lanjutan) Skenario 1. User Memilih Menu File 2. Sistem menampilkan menu File 3. User memilih submenu Open 4. Sistem menampilkan Dialog Open 5. User memilih direktori yang ada 6. Sistem menampilkan pilihan gambar yang ada pada direktori tersebut 7. User memilih gambar untuk di buka 8. Sistem menampilkan gambar yang sudah dipilih ke Main Form Kondisi Awal 1. User menerima tampilan main form yang berisi menu menu File, submenu Open, submenu Exit dan menu Help 2. User menerima Dialog Open Picture Kondisi Akhir 1. User memilih gambar yang akan dibuka Tabel 3.4. Use case Merubah Gambar Nama Aktor Deskripsi Merubah Gambar User User mengatur ukuran dan mengisi teks sesuai dengan keinginannya. 1. User mengatur besar kecil gambar teks dengan menggeser Size 2. Sistem menampilkan sizebar untuk mengatur ukuran gambar teks Tabel 3.5. Use case Merubah Gambar (Lanjutan)
Skenario Kondisi Awal Kondisi Akhir 3. User mengatur Size gambar teks 4. Sistem menampilkan size bar untuk mengatur besar kecilnya ukuran pada gambar teks 5. User menginput karakter teks pada kotak Input 6. Sistem menampilkan teks yang di input oleh user 7. User mengklik tombol convert 8. Sistem menampilkan gambar teks yang telah diatur oleh user 1. User menerima tampilan main form yang berisi menu menu File dan Help 2. User menerima tampilan size bar, text box dan tombol convert 1. User mengatur size bar 2. User mengisi text box 3. User mengklik tombol convert Tabel 3.6. Use case Menyimpan Gambar Nama Menyimpan Gambar Aktor User Deskripsi User dapat menyimpan gambar yang sudah di buka kedalam format Txt atau Rtf Skenario 1. User Memilih Menu File 2. Sistem menampilkan menu File 3. User memilih submenu Save Tabel 3.7. Use case Menyimpan Gambar (Lanjutan) 4. Sistem menampilkan Dialog Save 5. User memilih penyimpanan gambar teks
dengan format Txt atau Rtf 6. Sistem menampilkan format file untuk menyimpan gambar teks pilihan user 7. User memilih direktori yang ada untuk menyimpan gambar 8. Sistem menyimpan pilihan gambar yang ada pada direktori tersebut dan kembali ke main form Kondisi Awal 1. User menerima tampilan main form yang berisi menu menu File, submenu Open, Save dan Exit dan menu Help 2. User menerima tampilan size bar, Input dan tombol Convert 3. User menerima form save Kondisi Akhir 1. User mengklik submenu Save 2. User memilih penyimpanan gambar teks dengan format Txt atau Rtf 3. User memilih direktori penyimpanan gambar teks 3.2.2 Perancangan Peta Navigasi Peta navigasi dibuat untuk memudahkan dalam merancang sebuah aplikasi yang akan dibuat dengan cara menentukan lokasi pada setiap form yang ada dalam aplikasi yang akan dibangun. Pada gambar 3.5 merupakan peta navigasi dari aplikasi image to text menggunakan Visual Basic 6.0.
Gambar 3.5. Perancangan peta navigasi aplikasi image to text 3.2.3 Pemodelan Sequence Diagram Untuk melihat interaksi antara obyek yang dibutuhkan untuk menjalankan sebuah use case diperlukan sebuah pemodelan interaksi. Pemodelan interaksi antar objek-objek dilakukan dengan pemodelan sequence diagram. Gambar 3.6. Sequence diagram Buka Gambar
Gambar 3.7. Sequence diagram Merubah Gambar Gambar 3.8. Sequence diagram Menyimpan Gambar
3.2.4 Pemodelan Activity Diagram Menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Activity diagram juga dapat menggambarkan proses paralel yang mungkin terjadi pada beberapa eksekusi. Activity diagram adalah teknik untuk menggambarkan logika procedural, proses bisnis, dan jalur kerja. Dalam beberapa hal, diagram ini memainkan peran mirip sebuah diagram alir, tetapi perbedaan prinsip antar diagram ini dan notasi diagram alir adalah diagram ini mendukung behavior parallel. (Fowler, 2005). Berikut ini adalah activity diagram dari sistem yang akan dibuat. Gambar 3.9. Activity diagram Buka Gambar
Gambar 3.10. Activity diagram Merubah Gambar Gambar 3.11. Activity diagram Menyimpan Gambar
3.2.5 Perancangan Antar Muka Perancangan antarmuka bertujuan untuk memberikan gambaran tentang aplikasi yang akan dibangun, dimana letak tombol satu dan lainnya untuk memulai aplikasi. Sehingga akan mempermudah dalam mengimplementasikan aplikasi yang user friendly. Berikut ini adalah rancangan antarmuka aplikasi yang akan dibuat. 1. Perancangan Antarmuka Main Form Main Form adalah tampilan halaman utama dimana terdapat tombol menu File, menu Help.PictureBox untuk menampilkan gambar yang dibuka, RchTextBox untuk menampilkan gambar teks, SizeBar untuk mengatur ukuran gambar teks, TextBox untuk menginput text dan CommandButton Convert untuk memulai proses. Apabila mengklik tombol menu File maka tautan dari tombol tersebut akan menampilkan Submenu Open, Save dan Exit dan tautan dari menu Help akan menampilkan Submenu About Me. Gambar 3.9. Rancang antarmuka Main Form
2. Perancangan Antarmuka Menu Editor Didalam menu File terdapat tiga buah submenu yaitu menu Open, menu Save dan menu Exit. Apabila mengklik tombol menu Open maka tautan dari tombol tersebut maka akan menampilkan Dialog Open Picture. Jika mengklik tombol menu Save maka tautan dari tombol tersebut maka akan menampilkan Dialog Save File dan apabila mengklik menu Exit maka akan keluar dari aplikasi. Pada Menu Help akan menampilkan Submenu About Me Gambar 3.10. Rancang antarmuka Menu Editor 3. Perancangan Antarmuka Form About Me Form About Me bertujuan untuk memberi informasi kepada user nama aplikasi dan nama pembuat aplikasi, atau yang lainnya. CommmandButton OK bertujuan untuk keluar dari Form AboutMe Gambar 3.11. Rancang antarmuka Form About Me