I.6 Sistematika Penulisan
Sistematika penulisan yang terdapat dalam penelitian ini adalah:
BAB I PENDAHULUAN
Bab I akan membahas tentang latar belakang permasalahan, mencoba merumuskan inti permasalahan yang dihadapi, menentukan tujuan dan kegunaan
penelitian yang kemudian diikuti dengan pembatasan masalah, asumsi, serta sistematika penulisan.
BAB II TINJAUAN PUSTAKA
Bab II akan membahas berbagai konsep dasar, hal-hal yang mengenai perangkat lunak dodo kids browser dan hal-hal yang berguna dalam proses analisis
pengembangan perangkat lunak dodo kids browser.
BAB III ANALISIS DAN PERANCANGAN SISTEM
Bab III akan membahas tentang analisis sistem yang berjalan pada perangkat lunak dodo kids browser, analisis serta perancangan sistem untuk
pengembangan yang akan dilakukan pada perangkat lunak dodo kids browser.
BAB IV IMPLEMENTASI DAN PENGUJIAN SISTEM
Bab IV akan memaparkan hasil implementasi dari analisis yang dilakukan sebelumnya dan perancangan sistem yang dilakukan, serta hasil pengujian sistem
untuk mengetahui apakah perangkat lunak yang dibangun sudah memenuhi kebutuhan.
BAB V KESIMPULAN DAN SARAN
Bab V berisi kesimpulan dan saran untuk perbaikan dan menindaklanjuti hasil penelitian yang nantinya akan berguna bagi dodo project tim.
7
BAB II TINJAUAN PUSTAKA
II.1. Perangkat Lunak Dodo Kids Browser
Dodo kids browser adalah perangkat lunak untuk mengontrol dan mengawasi anak-anak dalam kegiatan menggunakan internet, dimana anak-anak
dapat mengeksplorasi internet dengan aman dan orang tua tidak merasa khawatir tentang bahaya penggunaan internet yang dilakukan oleh anak.
. Dodo Kids Browser berbentuk Extension yang dipasang pada web browser desktop, hal tersebut digunakan sebagai fungsi tambahan pada aplikasi web browser
untuk melakukan filtering dengan menggunakan algoritma Naïve bayes. Ketika anak melakukan pencarian dengan menggunakan keyword yang mengandung kata
negative, maka aplikasi ini akan melakukan blocking website, sehingga memungkinkan mengamankan aktivitas browsing yang dilakukan anak.
II.1.1 Fitur Dodo Kids Browser
Dodo kids browser memiliki beberapa fitur utama, yaitu : 1.
Surfior Fitur untuk menyaring penggunaan internet anak-anak.
2. Notifior
Fitur untuk memberikan pemberitahuan ketika anak-anak terindikasi mengakses konten yang negatif.
3. Reportior
Fitur reportior berpua laporan tentang penggunaan internet anak-anak, laporan tersebut berupa tabel.
II.2. Landasan Teori
Landasan teori merupakan penjelasan berbagai konsep dasar dan teori-teori yang berkaitan dalam analisis peningkatan akurasi pada perangkat lunak dodo kids
browser.
II.2.1 Web browser
Web browser adalah perangkat yang digunakan untuk mengakses halaman website dan menampilkan informasi yang disediakan server web. Informasi yang
ditampilkan pada Web browser dapat berupa text, gambar, suara maupun video [5]. Web browser biasanya sudah tersedia di sistem operasi yang digunakan, seperti
pada sistem operasi windows, sudah tersedia web browser internet explorer, namun menurut data statistik w3school pada tahun 2015, web browser yang sering
digunakan untuk browsing adalah google chrome, firefox, dan opera [7].
II.2.2 Extension Browser
Extension browser adalah perangkat lunak kecil yang ditanamkan pada web browser untuk menambah fungsionalitas tertentu dari web browser. Extension
browser berinteraksi dengan halaman web yang dibuka melalui skrip tertentu yang dapat digunakan untuk membaca address bar maupun isi dari halaman web.
Beberapa Extension browser ditulis menggunakan teknologi web seperti html, javascript, dan css. Extension browser dapat mengubah antarmuka yang
ditampilkan di web browser melalui proses yang tidak terlihat atau proses yang berjalan dibelakang layar [6].
II.2.3 JSON
JSON kepanjangan dari JavaScript Object Notation adalah format data interchange-ringan yang sangat mudah dibaca dan ditulis. Hal ini didasarkan pada
subset dari bahasa pemrograman JavaScript, Standar ECMA-262 Edisi ke-3 - Desember 1999. JSON merupakan format teks yang benar-benar bahasa
independen tetapi menggunakan konvensi yang akrab bagi programmer dari C, termasuk C , C ++, C , Java, JavaScript, Perl, Python, dan banyak lainnya. Properti
ini membuat JSON menjadi bahasa data interchange yang ideal. JSON dibentuk oleh dua struktur, yaitu collection dari nama atau value
pairs. Dalam berbagai bahasa, ini direalisasikan object, record, struct, dictionary, hash table, keyed list, atau associative array. Selain itu ordered list dari value.
Dalam kebanyakan bahasa, ini dinyatakan sebagai array, vector, list, atau sequence. Berikut merupakan bentuk dari JSON.
Object merupakan unordered set dari nama atau value pairs dimulai dengan {kurung kurawal kiri dan diakhiri dengan} kurung kurawal kanan. Setiap nama
diikuti dengan: titik dua dan nama atau value pairs dipisahkan oleh, koma.
Gambar II.1 Object Pada JSON
Array merupakan ordered list dari value. Array dimulai dengan [kurung siku kiri dan diakhiri dengan] kurung siku kanan. Value dipisahkan oleh, koma.
Gambar II.2 Array Pada JSON
Value dapat menjadi string dalam tanda kutip ganda, number, true, false, null, object, ataupun array. Selain itu struktur ini dapat berupa nested.
Gambar II.3 Value Pada JSON
Sebuah string adalah urutan nol atau lebih karakter Unicode, yang dibungkus dengan tanda kutip ganda, menggunakan escape backslash. Sebuah
karakter yang direpresentasikan sebagai string karakter tunggal. Sebuah string sangat mirip seperti C atau Java string.
Gambar II.4 Unicode Pada JSON
Number sangat mirip C atau Java number, terkecuali format oktal, dan heksadesimal yang tidak digunakan[7].
II.2.4 Web Service
Web Service adalah teknologi yang diisi sekumpulan method. Web service terletak pada server yang terhubung ke internet dan dapat diakses oleh berbagai
piranti dengan menggunakan perantara tertentu. Teknologi tersebut digunakan untuk memudahkan beberapa aplikasi atau komponennya untuk saling
berhubungan dengan aplikasi lain, tanpa terikat bahasa pemrograman yang digunakan [8].
II.2.5 Microsoft Azure
Microsoft Azure merupakan platform cloud computing yang disediakan oleh Microsoft. Microsoft Azure menyediakan berbagai macam layanan yang dapat
digunakan pengembang perangkat lunak untuk menyelesaikan tugas-tugas yang
mungkin tidak sesuai dalam lingkungan lokal. Misalkan komputasi, storage, termasuk web service.
Dengan menggunakan Windows Azure, pengembang dapat membuat aplikasi web, tempat penyimpanan data suatu aplikasi, jembatan koneksi antar
platform, dan melakukan push notification yang disimpan dan diproses di cloud [9].
II.2.6 Preprocessing
Preprocessing adalah tahap yang dilakukan sebelum proses klasifikasi teks. Tujuan preprocessing tersebut adalah untuk lebih memudahkan dan mengefektifkan
proses mining. Tahap yang dilakukan pada preprocessing adalah Cleansing, Case Folding, Tokenizing, Stopping dan Stemming. Berikut ini penjelasan tahap-tahap
yang dilakukan pada preprocessing [11]: 1.
Cleansing Data cleansing adalah proses membersihkan data dari item data yang tidak
memberikan informasi berguna dalam analisis selanjutnya. Selain simbol seperti slash
, “http:www”, domain dan angka akan dihapus, karena hal-hal tersebut dianggap tidak memberikan informasi yang berguna.
2. Case Folding
Case Case Folding disini merupakan tahapan merubah semua inputan huruf menjadi lower case. Hal tersebut dilakukan agar mempermudah dalam
proses langkah-langkah selanjutnya seperti stopping, dan stemming. 3.
Stopping Proses ini adalah proses menghilangkan kata yang tidak relevan, agar tidak
menimbulkan kerancuan dalam proses pengklasifikasian. Proses penghilangan kata dilakukan dengan cara melakukan pencocokan kata yang dimasukan dengan
stoplist. Jika ditemukan kata yang termasuk pada stoplist ,maka kata tersebut akan dihilangkan.
4. Tokenizing
Tokenizing merupakan tahapan melakukan pemecahan suatu gabungan dua kata atau lebih atau dapat disebut juga seperti suatu frasa atau kalimat sehingga
menjadi persatu satu.
5. Stemming
Kata-kata yang muncul pada dalam dokumen sering kali mengandung imbuhan. Oleh karena itu, setiap kata yang tersisa dari proses hasil tahapan
stopword removal dibentuk ke dalam kata dasar dengan cara menghilangkan imbuhannya.
II.2.7 Pembobotan TF-IDF
Pada penelitian yang dilakukan oleh Bruno Trstenjak, Sasa Mikac dan Dzenana Donko pada penelitian “KNN with TF-IDF Based Framework for Text
Categorization” menunjukan, dengan mengkombanasikan algoritma klasifikasi
KNN dan menggunakan metode pembobotan kata TF-IDF, menunjukan hasil klasifikasi yang baik [13].
Metode TF-IDF adalah metode yang dapat digunakan untuk mendapatkan bobot dari data training yang akan menentukan pengklasifikasian pada data testing
[10]. Formula yang digunakan untuk menghitung bobot adalah W
d,t
=Tf
d,t
Idf
t
dengan, W
= bobot dokumen ke-d Tf
= frekuensi dari kemunculan sebuah term Idf
= Nilai invers document frequency Rumus mencari nilai Idf adalah logddf dengan,
Df = banyak term yang muncul pada dokumen ke-d D
= dokumen ke d. Sebagai contoh, Tabel II-1 adalah dokumen-dokumen yang telah memiliki
klasifikasi.
Tabel II-1 Data Training Data
Training Teks
Term Klasifikasi
d1 porn teen fuck sexy porn
porn teen fuck sexy Bad
d2 milf fuck porn fuck learn fuck
milf fuck porn learn Bad
d3 learn physics learn mathematics
learn physics mathematics Good
d4 porn massage hardcore
porn massage sexy Bad
Dari data training pada Tabel II-1 akan dilakukan klasifikasi dokumen baru, sebagai contoh data testing pada Tabel II-2 adalah dokumen yang akan
diklasifikasikan.
Tabel II-2 Data Testing Data Testing
Teks Klasifikasi
t1 learn fuck milf
?
Tahap pertama yang dilakukan adalah menghitung Term frequency tf dan Document frequency df. Term frekuensi adalah frekuensi dari kemunculan sebuah
term dalam yang bersangkutan, dan Document frequency df adalah jumlah file yang mengandung term yang bersangkutan, dimana nilai df selanjutnya digunakan
untuk menghitung Nilai invers document frequency idf dari sebuah term. Proses perhitungan nilai Tf dan Idf dapat dilihat pada Tabel II-3.
Tabel II-3 Proses Perhitungan TfIdf Term
Df Ida
test tf1
tf2 tf3 tf4
Learn 2
0.3010 1
1 2
Fuck 2
0.3010 1
1 3
Milf 1
0.6021 1
1 Porn
3 0.1249
2 1
1 Teen
1 0.6021
1 Sexy
2 0.3010
1 1
Physics 1
0.6021 1
mathematics 1
0.6021 1
Massage 1
0.6021 1
Setelah nilai tf dan idf ditemukan, proses penghitungan bobot dilakukan dengan mengalikan setiap nilai dengan mengalikan masing-masing nilai tf terhadap nilai
idf. Sehingga didapatkan bobot pada masing-masing dokumen seperti pada .
Tabel II-4 Hasil Pembobotan Term
wtest w1
w2 w3
w4
Learn 0.3010
0.3010 0.6021
Fuck 0.3010
0.3010 0.9031
Milf 0.6021
0.6021 Porn
0.2499 0.1249
0.1249 Teen
0.6021 Sexy
0.3010 0.3010
Physics 0.6021
Mathematics 0.6021
Massage 0.6021
II.2.8 Algoritma K-Nearest Neighbor
Algoritma k-nearest neighbor KNN adalah algoritma yang digunakan untuk melakukan klasifikasi terhadap suatu objek, berdasarkan k buah data latih
yang jaraknya paling dekat dengan objek tersebut. Syarat nilai k adalah tidak boleh lebih besar dari jumlah data latih, dan nila k harus ganjil dan lebih dari satu. Dekat
atau jauhnya jarak data latih yang paling dekat dengan objek yang akan diklasifikasi, dapat dihitung dengan menggunkan metode cosine similiarity [11].
Cosine similiarity merupakan salah satu cara atau metode yang dapat digunakan untuk melihat sejauh mana kemiripan isi antar dokumen. Dalam hal ini
cosine similiarity berfungsi untuk menguji ukuran yang dapat digunakan sebagai interpretasi kedekatan jarak berdasarkan kemiripan dokumen.
Berikut ini adalah rumus untuk menghitung jarak pada algoritma KNN dengan metode cosine similiarity:
��� �� = ∑ � �
√∑ � √∑ � Dengan,
��� �� = jarak antara dokumen � dan � � = nilai bobot pada dokumen
k = jumlah tetangga terdekat
Langkah pertama yang dilakukan untuk mengetahui jarak antar dokumen adalah dengan melakukan penghitungan perkalian skalar antara data testing dengan
setiap data training. Setelah perkalian skalar dilakukan, hasil perkalian dari setiap data training dijumlahkan, dan panjang setiap dokumen dapat pun dapat ditentukan
dengan cara menguadratkan bobot setiap term dalam setiap dokumen. Hasil perhitungan perkalian skalar antara data testing dengan setiap data
training dengan menggunakan data yang ada pada Tabel II-4, dapat dilihat pada
Tabel II-5. Hasil perhitungan cosine similiarity untuk menentukan kemiripan antar dokumen pada Tabel II-6.
Tabel II-5 Hasil Perkalian Skalar Data Testing Dengan Data Training td
i
panjang vektor d1
d2 d3
d4 T
d1 d2
d3 d4
0.0000 0.0906
0.1812 0.0000
0.0906 0.0000
0.0906 0.3625
0.0000
0.0906 0.2718
0.0000 0.0000
0.0906 0.0906
0.8156 0.0000
0.0000
0.0000 0.3625
0.0000 0.0000
0.3625 0.0000
0.3625 0.0000
0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0625
0.0156 0.0000
0.0156
0.0000 0.0000
0.0000 0.0000
0.0000 0.3625
0.0000 0.0000
0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0906
0.0000 0.0000
0.0906
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.3625
0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.3625
0.0000
Σ
0.0906 0.7250
0.1812 0.0000
0.5437 0.6062
1.2843 0.3625
0.0156
0.7374 0.7786
1.1333 1.0429
0.6864
Langkah selanjutnya adalah menerapkan rumus cosin similiarity. Rumus tersebut digunakan untuk mendapatkan tingkat kemiripan antara data testing
dengan data training. Cost,d1 =
0.0 0
. ∗ .
= 0.1578 Cosr,d2 =
0.
. ∗ .
= 0.8675 Cosr,d3 =
. .
∗ .
= 0.2357 Cosr,d4 =
. .
∗ .
= 0 Hasil perhitungan pengukuran tingkat kemiripan antara data testing dengan data
training dapat dilihat pada tabel Tabel II-6.
Tabel II-6 Hasil Perhitungan Kemiripan Data Testing Dengan Data Training Data training
Jarak
Klasifikasi
d1 0.1578
Bad
d2 0.8675
Bad
d3 0.2357
Good
d4
Bad
Setelah didapatkan hasil perhitungan pengukuran jarak antara data testing dengan data training, maka langkah selanjutnya adalah mengurutkan data hasil
perhitungan dari yang terbesar hingga yang terkecil. Data yang telah diurutkan dapat dilihat pada Tabel II-7.
Tabel II-7 Hasil Pengurutan Data training
Jarak Klasifikasi
d2 0.8675
Bad d3
0.2357 Bad
d1 0.1578
Good d4
Bad
Langkah yang dilakukan setelah mengurutkan data hasil perhitungan dari yang terbesar hingga yang terkecil, adalah menentukan jumlah tetangga terdekat
atau disimbolkan dengan k. pengambilan nilai k dilakukan secara bebas, asalkan nilai k yang diambil adalah angka ganjil, nilai k lebih dari satu dan nilai k tidak lebih
besar dari data training. [11] sebagai contoh nilai k yang diambil disini adalah 3. Dengan k=3, maka didapat dokumen yang menjadi tetangga terdekat adalah D2
dengan klasifikasi bad, D3 dengan klasifikasi bad, dan D1 dengan klasifikasi good. Setelah diketahui sejumlah k objek yang terdekat dengan data yang diuji.
Nilai kelas yang paling banyak muncul pada sejumlah k objek yang termasuk tetangga terdekat dijadikan hasil klasifikasi pada data testing. Karena data tetangga
terdekat “Dt” memiliki dua buah dokumen yang memiliki kelas bad dan satu buah
yang memiliki kelas good, maka dari itu “Dt” diklasifikasikan sebagai dokumen
dengan kelas bad.
II.2.9 Object Oriented Analysis and Design
Object-Oriented Analysis and Design OOAD adalah suatu metode analisis dalam pembangunan perangkat lunak yang berorientasi pada objek yang saling
berinteraksi satu sama lain untuk menyelesaikan suatu tugas. Analisis dilakukan dengan memeriksa kebutuhan berdasarkan sudut pandang kelas dan objek yang
terdapat pada ruang lingkup permasalahan. OOAD dirancang untuk menutup kelemahan dari pemrograman berorientasi prosedural yang sulit untuk dikelola dan
debug ketika kode yang dibuat telah mencapai beribu-ribu baris. Dengan pendekatan ini kode-kode program dipecah ke dalam beberapa segmen atau biasa
disebut prosedur atau fungsi, sehingga memudahkan analis untuk melakukan analisis dalam membangun suatu perangkat lunak. Dalam memodelkan suatu
analisis yang menggunakan metode OOAD, terdapat tools yang biasa digunakan untuk menggambarkan analisis yang dibuat, yaitu UML Unified Modeling
Languages.
II.2.10 UML
UML Unified Modeling Language merupakan salah satu tools untuk memvisualisasikan pendokumentasian dari sebuah sistem pengembangan
perangkat lunak berbasis OOP Object Oriented Programming. Diagram yang umum dipakai untuk desain suatu sistem adalah sebagai berikut [12]:
1. Diagram Use Case.
Diagram Use case dapat digunakan untuk menggambarkan fungsionalitas dari sebuah sistem. Sebuah Use case diagram dapat merepresentasikan sebuah
interaksi antara aktor dengan sistem. 2.
Diagram Sequence. Diagram Sequence menggambarkan interaksi pada sistem dan digambarkan
terhadap waktu. Oleh karena itu sequence diagram biasa digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang dilakukan
sebagai respons dari sebuah event untuk menghasilkan keluaran tertentu. 3.
Diagram aktivitas. Diagram aktivitas menggambarkan berbagai alur aktivitas suatu sistem,
bagaimana masing-masing aliran berawal, decision yang mungkin terjadi, dan bagaimana akhir dari alur suatu aktivitas. Diagram aktivitas dapat dibagi
menjadi beberapa object swimlane untuk menggambarkan objek mana yang melakukan aktivitas tertentu
4. Diagram kelas.
Diagram kelas adalah sebuah diagram yang menggambarkan objek, atribut, dan method pada suatu sistem. Diagram kelas juga digunakan untuk
menggambarkan keseluruhan hubungan objek.
II.2.11
Confusion Matrix
Confusion Matrix berisi informasi tentang klasifikasi aktual dan klasifikasi dari diprediksi.
Metode ini menggunakan tabel matriks seperti pada Tabel II-8, jika data set hanya terdiri dari dua kelas, misalkan kelas yang satu dianggap sebagai good dan
yang lainnya bad.
Tabel II-8 Confusion Matrix
Diklasifikasikan sebagai Predicted Class
Good Bad
Klasifikasi yang benar Actual Class
Good True
Good False
Bad Bad
False Good
True Bad
2 True Good adalah jumlah record Good yang diklasifikasikan sebagai Good,
false Good adalah jumlah record Bad yang diklasifikasikan sebagai Good, false Bad adalah jumlah record Bad yang diklasifikasikan sebagai Good, true Bad adalah
jumlah record Bad yang diklasifikasikan sebagai Bad. Setiap kolom dari confusion matrix merupakan contoh di kelas yang telah diprediksi, sedangkan setiap baris
mewakili contoh di kelas yang sebenarnya. Setelah didapat true Good, false Good, true Bad dan false Bad, selanjutnya hitung untuk menghitung nilai akurasinya.
Berikut persamaan untuk menghitung akurasi.
Accuracy =
FalseBad TrueBad
FalseGood TrueGood
TrueBad TrueGood
19
BAB III ANALISIS DAN PERANCANGAN SISTEM
III.1 Analisis Sistem
Analisis sistem di sini adalah tahap untuk mengidentifikasi permasalahan yang terjadi pada perangkat lunak dodo kids browser, dan menerapkan solusi yang
dapat dimungkinkan untuk diterapkan.
III.1.1 Analisis Masalah
Permasalahan pada penelitian ini adalah bagaimana membuat fungsional yang dapat membaca halaman website yang akan dibuka, dan menggunakan
algoritma KNN untuk klasifikasi website berdasarkan detil halaman yang dibaca.
III.1.2 Analisis Perangkat Lunak Dodo Kids Browser
Pada penelitian ini analisis sistem yang sedang berjalan dilakukan dengan melakukan wawancara kepada tim leader dodo kids browser. Berikut ini alur sistem
pada perangkat lunak dodo kids browser : 1.
Anak memasukan alamat website pada web browser 2.
Extension browser mencocokan alamat website pada database 3.
Extension browser dapat melakukan blok halaman atau membuka halaman berdasarkan kecocokan alamat website.
4. Alamat website yang belum terdapat dalam database disajikan pada
platform mobile sebagai notifikasi ke platform mobile. 5.
Extension browser dapat melakukan blok halaman atau membuka halaman sesuai dengan aksi yang dikirim dari platform mobile.
6. API digunakan untuk koneksi dan transfer data antar platform Extension
browser dan mobile Dodo Kids Browser.
III.1.3 Analisis Algoritma
Pada bagian ini akan dijelaskan mengenai penggunaan algoritma dan alur proses yang terjadi. Sebelum memproses detail halaman website, pengecekan
alamat website dilakukan terlebih dahulu. Pengecekan dilakukan dalam dua proses, yaitu mencocokan url website yang tidak memiliki konten negatif dan mencocokan
url dari halaman website memiliki konten negatif. Jika url yang akan dibuka cocok dengan data url yang memiliki status bad pada database, maka halaman web tidak
akan ditampilkan, jika cocok dengan data url yang memiliki status good pada database, maka selanjutnya akan dilakukan proses klasifikasi menggunakan
algoritma klasifikasi yang mengklasifikasikan data detail halaman website. Algoritma yang digunakan pada untuk melakukan klasifikasi adalah algoritma K-
Nearest Neighbour. Sebelum proses klasifikasi teks dengan menggunakan algoritma KNN
dilakukan, teks perlu diberikan bobot terlebih dahulu. Hal tersebut karena algoritma KNN hanya bisa melakukan klasifikasi pada data yang sudah berupa angka.
Pemberian bobot pada teks dapat dilakukan dengan menggunakan metode TF-IDF. Selain itu tahap preprocessing dilakukan terlebih dahulu sebelum proses
pembobotan, agar data yang diberikan bobot lebih relevan. Setelah algoritma klasifikasi mengklasifikasi halaman website, maka
sistem akan menampilkan push notification pada smartphone orang tua. Notifikasi tersebut berisi saran dan url yang akan dibuka. Saran yang diberikan untuk orangtua
adalah good atau bad. jika hasil klasifikasi good. Setelah notifikasi dikirim akan ada jeda 15 detik untuk menunggu aksi mengizinkan atau tidak dari orang tua, jika
orang tua memilih tombol untuk mengizinkan maka halaman web akan tampil, akan tetapi jika orang tua memilih tombol untuk tidak mengizinkan, maka web yang akan
dibuka tidak ditampilkan melainkan akan ditampilkan halaman blok. Setelah data aksi dikirim oleh orang tua, maka data aksi ditambahkan ke data training, sehingga
data aksi yang dikirim orang tua digunakan pada proses klasifikasi yang akan terjadi selanjutnya.
Pada proses jeda menunggu aksi orang tua, terdapat kemungkinan orang tua akan melewatkan jeda tersebut untuk melakukan aksi, maka akan tampil pesan
pada anak, yang menyatakan bahwa halaman yang akan dibuka tidak dapat menampilkan website untuk sementara waktu. Pada kondisi tersebut, maka halaman
yang menyatakan website tidak dapat dibuka akan ditampilkan hingga orang tua mengklasifikasikan url tersebut pada proses selanjutnya, atau orang tua telah
mengklasifikasikan url melalui tampilan untuk mengirim aksi. Data halaman website yang belum diklasifikasi akan tetap disimpan sebagai
data testing pada database, dan akan ditampilkan pada bagian report untuk orang tua, untuk diklasifikasi oleh orang tua, setelah data aksi dikirim data aksi
ditambahkan ke data Training, sehingga data aksi yang dikirim orang tua digunakan pada proses klasifikasi yang akan terjadi selanjutnya.
III.1.4 Analisis Arsitektur Extension Browser
Tahap analisis arsitektur ini adalah tahapan untuk mendapatkan gambaran mengenai Extension browser yang akan dibangun. Gambaran arsitektur Extension
dapat dilihat pada Gambar III.1.
Ekstension Browser
Web Service
Database
2. Content Script
Content scripts merupakan file javascript yang dipanggil pada file manifest.json. Conten scripts digunakan untuk dapat berhubungan dengan web
service, sehingga content script dapat mengirimkan detail web page dan dapat menerima hasil klasifikasi yang dilakukan pada web service.
3. Web Page
Web Page disini adalah halaman website yang diimasukan dalam proses pada Extension browser.
4. Web Service
Tempat dilakukanya proses perhitungan pembobotan teks, klasifikasi data dan komunikasi dengan database dilakukan.
III.1.5 Analisis Sumber Data
Berdasarkan paper penelitian klasifikasi website yang dilakukan Daniele Riboni, pengambilan sumber data yang digunakan untuk mengklasifikasikan suatu
website adalah dengan menggunakan standar document object modelDOM, oleh karena itu pengambilan data dilakukan dengan menggunakan standar document
object modelDOM. Sumber data yang diambil berupa teks yang dapat menjadi informasi
mengenai halaman website yang dibuka. Berikut ini sumber data yang diambil menggunakan DOM dan digunakan untuk mengklasifikasikan web:
1. Title
Title adalah tag pada html yang berisi judul dari suatu halaman website. Pada tag title data yang diambil berupa judul dari suatu website, misalkan pada haaman
website “http:www.pornbub.comlearn-fuck-milf.html”, isi dari tag title pada
website tersebut adalah “Pornbub”.
2. Body
Body adalah tag yang merupakan isi dari halaman website, oleh karena itu tag body digunakan untuk mengambil teks pada halaman website.
3. URL
URL didapatkan dari alamat website yang dimasukan pada kolom alamat website pada web browser. Misalkan alamat website yang disubmit pada web
browser adalah “http:www.pornbub.comlearn-fuck-milf.html”, maka data yang
disubmit tersebut dijadikan data URL, untuk digunakan pada proses selanjutnya. Data-data yang telah diambil selanjutnya disatukan menjadi satu teks.
Proses penyatuan data dilakukan menggunakan metode penjumlahan teks pada javascript. Penyatuan menggunakan javascript, karena proses dilakukan pada file
contentscript, yang didalam prosesnya menggunakan bahasa javascript. Miskalkan didapat data dari tag title :
“Pornbub”, data dari tag body :”Wet Hot American Shower Sex | Story by Schneider | Stephen Schneider I love showering because
the one time of day I finally get to be alone with my thoughts. So what the fuck are you doing in here right now? Nothing good ever came out of more than one person
showering at the same time. Just ask Hitler. Or one of his campers rather. Whenever I shower with my girlfriend I end up standing there like an asshole
” dan yang didapatkan dari url :
“http:pornbub.comLearn-Fuck-Milf.html”. Maka data-data yang diambil disatukan menjadi “http:pornbub.comLearn-Fuck-Milf.html
Pornbub Wet Hot American Shower Sex | Story by Schneider | Stephen Schneider I love showering because the one time of day I finally get to be alone with my
thoughts. So what the fuck are you doing in here right now? Nothing good ever came out of more than one person showering at the same time. Just ask Hitler. Or
one of his campers rather. Whenever I shower with my girlfriend I end up standing there like an asshole
”.
III.1.6 Preprocessing
Sebelum proses klasifikasi teks, perlu dilakukan preprocessing terlebih dahulu terhadap teks yang akan diklasifikasi. Tujuan preprocessing tersebut adalah
untuk lebih memudahkan dan mengefektifkan proses mining. Berikut ini tahap- tahap yang dilakukan pada preprocessing:
1. Cleaning
Cleaning adalah proses membersihkan data dari item data yang tidak memberikan informasi berguna dalam analisis selanjutnya. Selain simbol seperti
slash , “http:www” dan angka akan dihapus, karena hal-hal tersebut dianggap
tidak memberikan informasi yang berguna. Penerapan proses cleanung dapat dilihat seperti pada Tabel III-1.
Tabel III-1Penerapan Cleaning
3. Tokenizing
Tokenizing di dalam penelitian ini merupakan proses penguraian deskripsi yang semula berupa kalimat-kalimat berisi kata-kata dan tanda pemisah antara kata.
Pada kasus spasi digunakan sebagai tanda pemisah. Penerapan alur proses dari tahapan tokenizing:
Tabel III-3 Penerapan Tokenizing Input
Output
pornbub learn fuck milf pornbub wet hot american shower sex story by schneider
stephen schneider i love showering because the one time of day i finally get to be alone with
my thoughts so what the fuck are you doing in here right now nothing good ever came out of
more than one person showering at the same time just ask hitler or one of his campers rather
whenever i shower with my girlfriend i end up standing there like an asshole
pornbub, learn, fuck, milf, pornbub, wet, hot, american, shower, sex, story, by, schneider,
stephen, schneider, i, love, showering, because, the, one, time, of, day, i, finally, get, to, be,
alone, with, my, thoughts, so, what, the, fuck, are, you, doing, in, here, right, now, nothing,
good, ever, came, out, of, more, than, one, person, showering, at, the, same, time, just, ask,
hitler, or, one, of, his, campers, rather, whenever, i, shower, with, my, girlfriend, i,
end, up, standing, there, like, an, asshole
4. Stopping
Proses ini adalah proses menghilangkan kata yang tidak relevan, agar tidak menimbulkan kerancuan dalam proses pengklasifikasian. Proses penghilangan kata
dilakukan dengan cara melakukan pencocokan kata yang dimasukan dengan stoplist. Jika ditemukan kata yang termasuk pada stoplist, maka kata tersebut akan
dihilangkan. Penerapan proses stopping dapat dilihat seperti pada Tabel III-4.
Tabel III-4 Penerapan Stopping Input
Output
pornbub, learn, fuck, milf, pornbub, wet, hot, american, shower, sex, story, by, schneider,
stephen, schneider, i, love, showering, because
, the, one, time, of, day, i, finally, get, to
, be, alone, with, my, thoughts, so, what, the
, fuck, are, you, doing, in, here, right, now,
nothing, good, ever, came, out, of, more, than, one, person, showering, at, the, same, time,
just , ask, hitler, or, one, of, his, campers,
rather , whenever, i, shower, with, my,
girlfriend, i, end, up, standing, there, like, an, asshole
pornbub, learn, fuck, milf, pornbub, wet, hot, american, shower, sex, story, schneider,
stephen, schneider, love, showering, one, time, day, finally, alone, thoughts, fuck, doing, here,
right, now, nothing, good, came, out, more, one, person, showering, same, time, ask, hitler,
one, campers, whenever, shower, girlfriend, end, up, standing, asshole
5. Stemming
Kata-kata yang muncul pada dalam dokumen sering kali mengandung imbuhan. Oleh karena itu, setiap kata yang tersisa dari proses hasil tahapan
stopword removal dibentuk ke dalam kata dasar dengan cara menghilangkan imbuhannya. Contoh proses stemming dapat dilihat seperti pada Tabel III-5.
Tabel III-5 Penerapan Stemming Input
Output
pornbub, learn, fuck, milf, pornbub, wet, hot, american, shower, sex, story, schneider,
stephen, schneider, love, showering, one, time, day
, finally, alone, thoughts, fuck, doing, here, right, now, nothing, good, came, out,
more, one, person, showering, same, time, ask, hitler, one, campers, whenever, shower,
girlfriend, end, up, standing, asshole
pornbub, learn, fuck, milf, pornbub, wet, hot, american, shower, sex, stori, schneider,
stephen, schneider, love, shower, on, time, dai, final, alon, thought, fuck, do, here, right, now,
noth, good, came, out, more, on, person, shower, same, time, ask, hitler, on, camper,
whenev, shower, girlfriend, end, up, stand, asshol
Pada Tabel III-5, kata-kata yang memiliki imbuhan dibentuk ke dalam kata dasar dengan cara menghilakan imbuhan yang ada. Misalkan kata showering
dirubah menjadi shower dengan menghilangkan imbuhan –ing, selain itu kata
campers dirubah menjadi camper dengan menghilangkan imbuhan –s
. III.1.7
Metode TF-IDF
Sebelum melakukan klasifikasi dengan algoritma KNN, diperlukan pembobotan pada data training dan data testing yang akan diklasifikasikan. Hal
tersebut diperlukan karena algoritma KNN hanya bisa melakukan proses klasifikasi pada data yang berupa angka. Metode TF-IDF adalah metode yang dapat digunakan
untuk mendapatkan bobot dari data training yang akan menentukan klasifikasi pada data testing. Berikut ini adalah proses dalam pembobotan teks pada masing-masing
data training terhadap data testing, dengan asumsi telah dilakukan preprocessing sebelumnya. Sebagai contoh misalkan terdapat data yang akan dihitung kemiripan
seperti pada Tabel III-6 dengan data-data yang sudah diklasifikasi pada Tabel III-7.
Tabel III-6 Data Testing Data Testing
Teks Klasifikasi
t1 porn learn fuck milf pornbub pornbub
learn fuck milf ?
Tabel III-7 Data Training Data
Training Teks
Term Klasifikasi
d1 porn teen fuck sexi pon
porn teen fuck sexi Bad
d2 milf fuck porn fuck learn fuck
milf fuck porn learn Bad
Data Training
Teks Term
Klasifikasi
d3 learn physic learn math
learn physic math Good
d4 pornbub massag hardcore
pornbub massag hardcore Bad
d5 count learn book dummi
count learn book dummi Good
d6 physic learn highschool
physic learn highschool Good
Tahap yang dilakukan adalah menghitung term frequency tf. Term frekuensi merupakan frekuensi dari kemunculan sebuah term dalam yang
bersangkutan, dan document frequency df, yang merupakan jumlah file yang mengandung term yang bersangkutan, di mana nilai df selanjutnya digunakan
untuk menghitung nilai invers document frequency idf dari sebuah term.
Tabel III-8 Perhitungan tf dan Idf Term
Df Idf
test tf1 tf2 tf3 tf4 tf5 tf6
Pornubub
3 0.69897
2 1
Learn
7 0.330993 2
1 2
1 1
Fuck
6 0.39794
2 1
3
Milf
3 0.69897
2 1
Porn
4 0.574031 1
2 1
Teen
1 1.176091 0
1
Sexi
1 1.176091 0
1
Physics
2 0.875061 0
1 1
Math
1 1.176091 0
1
Massag
1 1.176091 0
1
Count
1 1.176091 0
1
Hardcore
1 1.176091 0
1
Book
1 1.176091 0
1
Dummi
1 1.176091 0
1
Highschool
1 1.176091 0
1
Pada proses selanjutnya dilakukan perhitungan bobot dari term tertentu dalam sebuah file dengan mengalikan masing-masing nilai tf terhadap nilai idf.
Sehingga didapatkan bobot pada masing-masing data seperti pada tabel Tabel III-9.
Tabel III-9 Tabel Bobot Term
wtest w1
w2 w3
w4 w5
w6
Pornubub 1.3979
0.699 Learn
0.662 0.331
0.662 0.331
0.331 Fuck
0.7959 0.3979
1.1938
Term wtest
w1 w2
w3 w4
w5 w6
Milf 1.3979
0.699 Porn
0.574 1.1481
0.574 Teen
1.1761 Sexi
1.1761 Physics
0.8751 0.8751
Math 1.1761
Massag 1.1761
Count 1.1761
Hardcore 1.1761
Book 1.1761
Dummi 1.1761
Highschool 1.1761
∑ Jumlah
Bobot
4.8277 3.8982 2.7978 2.7132 3.0512 3.8593 2.3822
III.1.8 Analisis Penerapan Algoritma K-Nearest Neighbor
Algoritma K-Nearest Neighbor merupakan algoritma yang digunakan untuk menentukan hasil akhir dari proses pengklasifikasian teks. Setelah proses
pembobotan pada tf-idf selesai dilakukan, pengklasifikasian pada algoritma K- Nearest Neighbour diawali dengan tahap menghitung jarak antara bobot setiap kata
pada data testing dan bobot setiap kata pada data training, lalu mengurutkan jarak dari yang terdekat hingga yang terjauh, menentukan tetangga terdekat dan terakhir
hasil klasifikasi didapatkan dari kelas yang paling banyak menjadi tetangga terdekat. Berikut ini adalah proses yang dilakukan dalam pengklasifikasian
menggunakan algoritma KNN. 1.
Menghitung jarak kemiripan pada data testing dengan setiap data training dengan rumus cosine similiarity.
Tabel III-10 Cosine Similiarity. panjang vektor
T d1
d2 d3
d4 d5
d6
1.9541 0.0000
0.0000 0.0000
0.4886 0.0000
0.0000 0.4382
0.0000 0.1096
0.4382 0.0000
0.1096 0.1096
0.6335 0.1583
1.4252 0.0000
0.0000 0.0000
0.0000 1.9541
0.0000 0.4886
0.0000 0.0000
0.0000 0.0000
0.3295 1.3181
0.3295 0.0000
0.0000 0.0000
0.0000
panjang vektor T
d1 d2
d3 d4
d5 d6
0.0000 1.3832
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
1.3832 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.7658
0.0000 0.0000
0.7658 0.0000
0.0000 0.0000
1.3832 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
1.3832 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
1.3832 0.0000
0.0000 0.0000
0.0000 0.0000
1.3832 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 0.0000
1.3832 0.0000
0.0000 0.0000
0.0000 0.0000
0.0000 1.3832
0.0000 ∑ 5.3094 4.2429 2.3528 2.5873 3.2550 4.2592 0.8754
√ 2.3042 2.0598 1.5339 1.6085 1.8042 2.0638 0.9356
Penghitungan jarak dilakukan dengan menggunakan rumus berikut:
∑ � � √∑ �
2
√∑ �
2
a. Penghitungan jarak data testing dengan data training ke-1
=
.
. ∗ .
= 0.8213 b.
Penghitungan jarak data testing dengan data training ke-2 =
.
. ∗ .
= 0.7916 c.
Penghitungan jarak data testing dengan data training ke-3 =
. .
∗ .
= 0.7320 d.
Penghitungan jarak data testing dengan data training ke-4 =
. .
∗ .
= 0.7340
e. Penghitungan jarak data testing dengan data training ke-5
=
. .
∗ .
= 0.8116 f.
Penghitungan jarak data testing dengan data training ke-6 =
. .
∗ .
= 1.1050 2.
Mengurutkan jarak yang telah dihitung, mulai dari yang terbesar ke yang terkecil.
Tabel III-11 Jarak Sebelum Diurutkan Data training
Jarak
Klasifikasi
d1 0.8213
Bad
d2 0.7916
Bad
d3 0.7320
Good
d4 0.7340
Bad
d5 0.8116
Good
d6 1.1050
Good
Tabel III-12 Jarak Setelah Diurutkan Data training
Jarak
Klasifikasi
d6 1.1050
Good
d1 0.8213
Bad
d2 0.8116
Bad
d5 0.7916
Good
d4 0.7340
Bad
d3 0.7320
Good
3. Proses yang dilakukan setelah pengurutan adalah menentukan yang
mana saja yang termasuk tetangga terdekat. Jumlah tetangga terdekat adalah sebanyak k, di mana k sudah ditentukan sebelumnya dengan
disesuaikan sayarat, yakni jumlah k lebih dari satu, nilai k termasuk bilangan ganjil, nilai k lebih dari jumlah kelas dan nilai k tidak
melebihi jumlah data training [11]. Berdasarkan hasil penelitian Tri halomoan simanjuntak, nilai k yang semakin kecil akan membuat
akurasi yang semakin baik [13]. Oleh karena itu dipilih nilai k=3 karena memenuhi syarat-syarat yang telah disebutkan sebelumnya dan
nilai k=3 adalah yang terkecil berdasarkan syarat-syarat tersebut, maka jumlah yang termasuk tetangga dipilih adalah sebanyak 3 buah
Tabel III-13 Data Anggota Tetangga Terdekat
4. Pengklasifikasian didasarkan pada nilai yang paling banyak muncul
pada atribut klasifikasi dan termasuk tetangga terdekat sebanyak 3 buah
5. Tabel III-13 menunjukan nilai yang paling sering muncul pada atribut
klasifikasi adalah kelas bad, maka kelas pada data baru adalah bad.
III.1.9 Analisis Kebutuhan Non Fungsional
Analisis kebutuhan non fungsional menggambarkan kebutuhan yang diperlukan untuk melakukan pengembangan perangkat lunak dodo kids browser.
Kebutuhan non fungsional untuk melakukan pengembangan perangkat lunak dodo kids browser meliputi kebutuhan perangkat lunak dan kebutuhan perangkat keras.
III.1.9.1 Analisis Kebutuhan Perangkat Lunak
Analisis kebutuhan perangkat lunak merupakan proses analisis yang lebih menekankan kepada aspek pemanfaatan software. Perangkat lunak yang digunakan
dalam pembangunan perangkat lunak ini dapat dilihat pada Tabel III-14.
Tabel III-14 Spesifikasi Kebutuhan Perangkat Lunak Jenis Kebutuhan
Perangkat Keras Spesifikasi
Pembangunan Processor
Intel Pentium Dual-Core CPU T4400 2.20Ghz Harddisk
320 GB Memory
2 GB
Data training Jarak
Tetangga Klasifikasi
d6 1.1050
Ya
Good
d1 0.8213
Ya
Bad
d2 0.8116
Ya
Bad
d5 0.7916
Tidak
Good
d4 0.7340
Tidak
Bad
d3 0.7320
Tidak
Good
Jenis Kebutuhan Perangkat Keras
Spesifikasi
VGA On Board 512 MB
Monitor Resolusi layar 1366x768
Penggunaan Mobile
Processor 800 Mhz
Memory RAM 512 MB
Harddisk 2 GB
III.1.9.2 Analisis Kebutuhan Perangkat Keras
Spesifikasi perangkat keras yang digunakan dalam pembangunan perangkat lunak adalah sebagai berikut:
Tabel III-15 Spesifikasi Perangkat Keras Jenis Kebutuhan
Perangkat Lunak Spesifikasi
Pembangunan Sistem Operasi
Minimum Windows 10 DBMS
Minimum MySQL 5.6.20. Web Server
Azure Web Apps IDE
Microsoft Visual Studio Community 2013 Code Editor
WeBuilder 2014 Penggunaan
Sistem Operasi Windows Phone 8.0
Web Browser Desktop Chrome
III.1.9.3 Analisis Kebutuhan Perangkat Pikir
Analisis kebutuhan perangkat pikir merupakan tahap analisis pengguna yang akan menggunakan sistem. Berikut merupakan karakterisitik dari pengguna
perangkat lunak yang dibangun:
Tabel III-16 Perangkat Pikir No
Pengguna Tingkat Keterampilan yang Dimiliki
1 Orang tua
Terbiasa menggunakan smartphone Windows Phoned dan Terbiasa menggunakan web browser
2 Anak
Terbiasa menggunakan web browser
III.1.10 Analisis Kebutuhan Fungsional
Analisis dilakukan dengan pemodelan menggunakan UML Unified Model Language. Tahap-tahap pemodelan dalam analisis tersebut terdiri dari
definisi aktor, use case diagram, activity diagram, sequence diagram, dan class diagram.
III.1.10.1 Use Case
Use case diagram menggambarkan mengenai fungsionalitas pada sistem yang akan dibangun. Use case diagram dapat dilihat pada Gambar III.2.
Gambar III.2 Use Case Diagram
System
Klasifikasi
Stopping Cleaning
Case Folding Stemming
Cek url
include include
include include
Pembobotan
include
Anak
Membuka Website
include
Orang Tua Penyajian Laporan
Login Extension
Register Logout Extension
Penyajian Notifikasi login
Pemilihan Aksi
include
tokenizing
include include
extend extend
extend
cek web
extend
1. Definisi Aktor
Adapun deskripsi aktor yang ada pada use case diagram sebagai berikut:
Tabel III-17 Tabel Definisi Aktor No
Aktor Deskripsi
1 Anak
Aktor yang melakukan browsing 2
Orang tua Aktor yang menggunakan fungsional untuk mengawasi aktivitas
browsing internet anak
2. Definisi Use Case Diagram
Berikut adalah deskripsi dari setiap use case yang ada pada use case diagram:
Tabel III-18 Tabel Definisi Use Case Diagram No
Use Case Deskripsi
1 Membuka Website
Proses membuka halaman website 2
Cek Url Proses melakukan pengecekan url yang akan dibuka
3 Klasifikasi
Proses mengklasifikasi data halaman website yang akan dibuka oleh anak
4 Pembobotan
Proses memberikan bobot pada teks 5
Cleansing Proses membersihkan data dari item data yang tidak
memberikan informasi berguna dalam langkah selanjutnya.
6 Case Folding
Proses merubah isi teks menjadi lower case 7
Stopping Proses
menghilangkan kata-kata
yang tidak
diperlukan 8
Tokenizing Proses mengubah teks menjadi token-token
9 Stemming
Proses mengubah kata yang berimbuhan ke bentuk natural
10 Push notification
Proses pengiriman notifikasi 11
Cek Website Proses mengecek website yang diakses anak
12 Pemilihan aksi
Proses penerimaan pemberian dan pengiriman jawaban yang dilakukan aktor orangtua
13 Register
Proses melakukan registrasi yang dilakukan actor orang tua
14 Login
Proses melakukan login data pengguna 15
Login Extension Proses masuk kedalam sistem pada bagian Extension
16 Logout Extension
Proses keluar sistem pada bagian Extension 17
Penyajian Laporan Proses menampilkan data laporan
18 Logout
Prosees logout pada mobile apps
3. Skenario Use Case Diagram
Setiap use case memiliki alur proses yang berbeda satu dengan yang lainnya. Penjelasan mengenai detail dari setiap alur proses use case akan dijelaskan pada
skenario use case diagram. Berikut ini penjelasannya: a.
Cek URL Proses yang dilakukan pada tahap ini adalah melakukan pengecekan pada url
yang akan dibuka. Berikut skenarionya dari use case withdrawal web page.
Tabel III-19 Use Case Cek Url Use Case Name
Cek URL
Related Requirements Membuka Website
Goals Mendapatkan hasil apakah url telah ada pada data url yang
memiliki konten negative, tidak memiliki konten negative, atau url belum dapat dikategorikan.
Preconditions Aktor anak mensubmit alamat website yang dicari.
Successful End Condition
Berhasil mengeluarkan hasil pengecekan
Failed End Condition
Hasil pengecekan gagal didapatkan
Primary Actors
Anak
Main Flow Steps
Actions
1 Mengambil url yang telah submit actor anak
2 Mencocokan dengan data url pada database
3 Mengeluarkan hasil pengecekan url
4 Menampilkan halaman website
Extension Steps
Brancing Actions
4.1 Tidak menampilkan halaman website
4.2 Melanjutkan ke proses klasifikasi
b. Klasifikasi
Proses ini berfungsi untuk melakukan klasifikasi dengan algoritma KNN. Berikut adalah detail dari skenarionya:
Tabel III-20 Use Case Klasifikasi Use Case Name
Klasifikasi
Related Requirements
Preprocessing Cleansing, Case Folding, Stopping,Tokenizing, Stemming, Cek url dan Pembobotan
Goals Memberi nilai kelas pada teks yang telah selesai dibobotkan
Preconditions Cek url
Successful End Condition
Mengeluarkan hasil klasifikasi
Failed End Condition
Tidak mengeluarkan hasil klasifikasi
Primary Actors
Anak
Main Flow Steps
Actions
1 Mengambil data halaman website yang akan
dibuka 2
Include: Pembobotan
Menghitung bobot teks pada data yang telah diambil dengan data training
3 Menghitung jarak antara teks pada data training
dengan teks yang akan diklasifikasi 4
Mengurutkan jarak dari yang terkecil hingga jarak yang terbesar
5 Menentukan k dan menentukan yang termasuk
tetangga 6
Mengklasifikasikan teks tersebut berdasarkan nilai kelas tetangga terdekat yang terbanyak
muncul sebagai
Extension Steps
Branching Actions
6.1 Gagal mengklasifikasikan good dan bad
c. Pembobotan
Proses ini berfungsi untuk memberikan bobot pada teks yang akan diklasifikasi. Berikut detail skenario pembobotan:
Tabel III-21 Use Case Pembobotan Use Case Name
Pembobotan
Related Requirements Preprocessing
Cleansing, Case
Folding, Stopping,Tokenizing, Stemming
Goals Memberikan bobot pada teks.
Preconditions Teks telah melalui proses preprocessing
Successful End Condition Teks selesai diberikan bobot.
Failed End Condition Teks tidak diberi bobot..
Primary Actors Extension
Steps Actions
1 Menerima teks yang akan diberikan bobot
2 Include:
Cleansing Membersihkan teks dari karakter yang
dianggap tidak diperlukan 3
Include: Case
Folding Merubah semua teks menjadi lower Chase
4 Include:
Tokenizing Merubah teks menjadi token-token
5 Include:
Stopping Menghapus kata stoplist yang ada di dalam
teks 6
Include: Stemming
Merubah kata yang berimbuhan menjadi bentuk aslinya
7 Mengeluarkan nilai hasil pembobotan
d. Cleansing
Proses ini menghapus toke-token yang tidak diperlukan untuk proses selanjutnya. Sehingga tingkat noise data berkurang. Berikut detail skenario
cleansing:
Tabel III-22 Skenario Use Case Cleansing Use Case Name
Cleansing
Related Requirements -
Goals Menghapus token-token non-alfabetis
Preconditions Withdrawal Detail Website telah dilakukan
Successful End Condition Teks tidak lagi berisi token-token non-alfabetis dan link.
Failed End Condition Teks masih terdapat yang berisi token-token non-alfabetis
dan link.
Primary Actors
Extension Browser
Main Flow Steps
Actions
1 Memuat teks dari halaman detail website
2 Mencari karakter yang tidak diperlukan.
3 Menghapus karakter yang tidak diperlukan
Extension Steps
Branching Actions
3.1 Tidak menghapus karakter
e. Case Folding
Proses ini mengubah semua teks menjadi lower case. Berikut skenario detailnya:
Tabel III-23 Skenario Use Case Case Folding Use Case Name
Case Folding
Related Requirements -
Goals Mengubah semua teks menjadi lower case.
Preconditions Teks telah melewati proses cleansing.
Successful End Condition Semua token di dalam teks menjadi lower case.
Failed End Condition -
Primary Actors Admin
Main Flow Steps
Actions
1 Memuat teks dari hasil cleansing.
2 Mengubah semua token menjadi lower case..
f. Stopping
Proses ini berfungsi untuk menghapus kata yang tidak berpengaruh secara signifikan. Berikut adalah detail skenarionya:
Tabel III-24 Skenario Use Case Stopping Use Case Name
Stopping
Related Requirements -
Goals Menghapus kata seperti yang tidak berpengaruh secara
signifikan.
Preconditions Teks telah melewati proses case folding
Successful End Condition Kumpulan kata
yang tidak berpengaruh berhasil
dihilangkan.
Failed End Condition Kumpulan token masih berisi kata yang tidak berpengaruh.
Primary Actors Admin
Main Flow Steps
Actions
1 Memuat kumpulan token dari hasil tokenizing.
2 Mencocokan
satu persatu
token dengan
kumpulan stopping word. 3
Menghapus token yang cocok.
Extension Steps
Branching Actions
3.1 Tidak menemukan token yang cocok
g. Tokenizing
Proses merubah teks yang akan diproses menjadi token-token. Berikut detail skenario tokenizing:
Tabel III-25 Skenario Use Case Tokenizing Use Case Name
Tokenizing
Related Requirements
-
Goals
berhasil memecah teks menjadi kata per kata berdasarkan spasi sebagai delimiter.
Precondition data telah dilakukan proses case folding
Description Fungsional ini digunakan untuk memisahkan tiap kata berdasarkan
delimiternya yang dalam hal ini yaitu dipisahkan oleh space.
Successful End Condition
Berhasil memecah sumber data menjadi kumpulan token
Failed End Condition
Gagal memecah sumber data menjadi kumpulan token
Trigger
Proses pembobotan dijslankan
Main Flow Step
Action
1 Memuat kata kunci pencarian sebagai sumber data hasil
case folding 2
Melakukan pemecahan sumber data menjadi kata per kata atau dalam sebuah kumpulan token
Extension Step
Branching Action
Gagal melakukan pemecahan sumber data menjadi kata per kata.
h. Stemming
Proses ini digunakan untuk memeriksa apakah dari masing-masing token terdapat imbuhan. Apabila ada maka dikembalikan ke dalam bentuk kata
aslinya. Berikut ini detail skenarionya:
Tabel III-26 Skenario Use Case Stemming Use Case Name
Stemming
Related Requirements
-
Goals
Mengembalikan kata yang berimbuhan menjadi bentuk kata dasarnya.
Preconditions Teks telah melewati proses stopping.
Successful End Condition Kumpulan token yang berhasil dipecah dari teks tidak berisi
kata berimbuhan.
Failed End Condition
Kumpulan token masih berisi kata berimbuhan.
Primary Actors
Anak
Main Flow Steps
Actions
1 Memuat kumpulan token dari hasil stopping.
2 Memeriksa apakah token tersebut memiliki
imbuhan 3
Mengubah kata berimbuhan maka diubah menjadi bentuk kata aslinya.
Extension Steps
Branching Actions
3.1 Gagal mengubah kata berimbuhan maka diubah
menjadi bentuk kata aslinya.
i. Push Notification
Proses push notification digunakan untuk melakukan pemberitahuan pada actor orang tua. Berikut ini detail skenarionya:
Tabel III-27 Use Case Push Notification Use Case Name
Push Notification
Related Requirements Klasifikasi
Goals Mengirim notifikasi berisi url yang akan dibuka pada actor
orang tua
Preconditions Proses klasifikasi telah dilakukan
Successful End Condition Notifikasi berhasil dikirim
Failed End Condition Notifikasi tidak berhasil dikirim
Primary Actors Orang tua, anak
Main Flow Steps
Actions
1 Memuat hasil klasifikasi
2 Mengirim data hasil klasifikasi
3 Notifikasi beserta suggest tampil pada orang tua
Extension Steps
Branching Actions
3.1 Notifikasi tanpa suggest tampil pada orang tua
j. Pemilihan aksi
Proses untuk melakukan aksi yang dilakukan orang tua. Berikut adalah detail dari skenarionya:
Tabel III-28 Skenario Use Case Pemilihan Aksi Use Case Name
Pemilihan Aksi
Related Requirements Push notification, Klasifikasi ,Pembobotan, Preprocessing
Cleansing, Case Folding, Stopping,Tokenizing, Stemming
Goals
Mengeluarkan data aksi yang harus dilakukan
Preconditions
Push notification telah dikirim
Successful End Condition
Mengeluarkan data aksi yang harus dilakukan dan menyimpan data detail web yang telah diklasifikasi beserta data url ke data base
Failed End Condition Tidak mengeluarkan data aksi yang harus dilakukan atau tidak
menyimpan data detail web ke database
Primary Actors
Orangtua, Anak
Main Flow Steps
Actions
1 Menekan tombol toast notification
2 System menampilkan halaman pemilihan aksi
3 Memilih
mengizinkan atau
tidak untuk
membuka website 4
Mengirim aksi 5
Menyimpan data detail web data ke database
Extension Steps
Branching Actions
2.1 Tidak mengirim aksi
k. Login Extension
Proses login Extension adalah proses login yang dilakukan actor orang tua pada Extension browser. Berikut detail proses login Extension:
Tabel III-29 Skenario Use Case Login Extension Use Case Name
Login Extension
Goals Berhasil masuk dalam sistem
Descriptions Fungsionalitas ini digunakan oleh aktor untuk verifikasi
akun yang akan mengirim push notification
Successful End Condition Aktor berhasil login
Failed End Condition Aktor tidak login masuk kedalam sistem.
Primary Actors Orang tua
Main Flow Steps
Actions
1 Actor memilih tombol login
2 Sistem menampilkan halaman login pengguna
3 Pengguna memasukan data login dan password
4 Pengguna melakukan submit data login
5 Sistem menyimpan status telah login
Extension Steps
Branching Actions
5.1 Gagal menyimpan status
l. Logout Extension
Proses logout Extension adalah proses logout dari Extension browser. Berikut detail proses logout Extension
Tabel III-30 Skenario Use Case Logout Extension Use Case Name
Logout Extension
Goals Berhasil logout
Descriptions Fungsionalitas ini digunakan oleh pengguna untuk keluar
dari perangkat lunak Extension browser Dodo Kids Browser
Successful End Condition Akun pengguna tidak terverifikasi
Failed End Condition Akun aktor masih terverifikasi.
Primary Actors Orang tua
Main Flow Steps
Actions
1 Sistem menampilkan halaman logout pengguna
2 Pengguna memasukkan data logout berupa
password. 3
Pengguna melakukan submit data logout. 4
Mengubah status belum login 5
Sistem akan menampilkan halaman popup Extension browser.
Extension Steps
Branching Actions
5.1 Sistem tidak menampilkan halaman popup
m. Register
Proses register adalah proses untuk melakukan pendaftaran data pengguna ke dalam sistem.
Tabel III-31 Skenario Use Case Register Use Case Name
Register
Goal In Context Orang tua berhasil memiliki akun pengguna
Description Fungsionalitas ini digunakan oleh orang tua untuk melakukan
pendaftaran ke dalam aplikasi
Related Use Case -
Successful End Condition
Aktor berhasil terdaftar kedalam sistem
Failed End Condition Aktor gagal terdaftar kedalam sistem
Actors Orang Tua
Trigger Memilih tombol register pada halaman start
Main Flow Step
Action
1. Orang tua memilih tombol register pada halaman
register 2.
Sistem menampilkan halaman register orang tua 3.
Orang tua mengisi data register dengan memasukan data register berupa email dan password
4. Orang tua melakukan submit data register
5. Sistem akan melakukan validasi pengisian data
registrasi 6.
Orang tua berhasil mendaftar ke dalam sistem
Extension Step
Branching Action
6.1 Orang tua gagal mendaftar ke dalam sistem
n. Login
Proses melakukan login pada smartphone.
Tabel III-32 Skenario Use Case Login Use Case Name
Login
Goals Memiliki hak akses untuk melihat report dan melakukan
labeling
Descriptions
Fungsionalitas ini digunakan oleh aktor untuk verifikasi akun yang akan menerima push notification dan untuk
melihat penyajian report
Successful End Condition
Aktor berhasil login
Failed End Condition
Aktor tidak login masuk kedalam sistem.
Primary Actors
Orang tua
Main Flow Steps
Actions
1 Actor memilih tombol login
2 Sistem menampilkan halaman login pengguna
3 Pengguna memasukan data login dan password
4 Pengguna melakukan submit data login
5 Data pengguna terverifikasi
Extension Steps
Branching Actions
5.1 Gagal memverifikasi data pengguna
o. Penyajian Laporan
Penyajian laporan untuk menyajikan data laporan.
Tabel III-33 Skenario Use Case Penyajian Laporan Use Case Name
Penyajian Laporan
Goal In Context
Menampilkan data pencarian dari pengguna anak
Description
Fungsionalitas ini digunakan oleh orang tua data pencarian dari pengguna anak
Related Use Case Login
Successful End
Condition
Aktor berhasil mendapatkan riwayat pencarian pengguna anak
Failed End Condition
Aktor gagal mendapatkan riwayat pencarian
Actors
Orang Tua
Trigger
Orang Tua memilih tap tombol Parent
Main Flow Step
Action
1. Orang Tua memilih tap tombol Parent
2.
include::
Login Orang Tua melakukan login ke dalam aplikasi
3. Sistem menampilkan halaman report yang berisi daftar
riwayat pencarian
Extension Step
Branching Action
3.1 Sistem gagal menampilkan riwayat pencarian
p. Membuka Website
Proses membuka website disini adalah proses browsing yang dilakukan actor anak. Berikut detail proses browse web:
Tabel III-34 Skenario Use Case Browse web Use Case Name
Browse Web
Related Requirements Cek url
Goals Membuka Halaman Website
Preconditions
Url telah dimasukan ke web browser oleh user.
Successful End Condition
Halaman website tampil pada browser
Failed End Condition Halaman website tidak tampil
Primary Actors User
Main Flow Steps
Actions
1 Submit alamat website
2 Include:
Cek url Melakukan proses cek url
q. Cek Web
Proses Cek Web adalah proses logout dari. Berikut detail proses Cek Web.
Tabel III-35 Skenario Use Case Cek Web Use Case Name
Cek Web
Goals
Tampil website yang diakses anak
Descriptions
Fungsionalitas ini digunakan oleh orang tua untuk menampilkan halaman website yang diakses anak
Successful End Condition Tampil website yang diakses anak
Failed End Condition Website tidak ditampilkan
Primary Actors Orang tua
Main Flow Steps
Actions
1 Sistem menampilkan halaman action
2 Pengguna menekan tombol cek web.
3 Sistem meload alamat website.
4 Sistem menampilkan halaman website pada
halaman Cek Web
Extension Steps
Branching Actions
4.1 Sistem tidak menampilkan halaman website
III.1.10.2 Activity Diagram
Activity diagram pada penelitian ini menjelaskan tentang alur kerja tahapan-tahapan aktivitas dari use case.
1. Activity Diagram Process Membuka Website
Diagram aktivitas ini menjelaskan proses membuka website.
Gambar III.3 Activity Diagram Membuka Website
Anak System
memasukan alamat website yang akan
dibuka melakukan submit
alamat website yang akan dibuka
Cek Url
2. Activity Diagram Cek URL
Diagram aktivitas ini menjelaskan tentang proses pengecekan url.
Gambar III.4 Activity Diagram Cek Url
Anak System
menampilakan halaman blok
website Klasifikasi
menampilkan halaman
website [cocok dengan data good]
[cocok dengan data bad] [tidak cocok dengan data pada database]
mencocokan alamat website yang disubmit
dengan data url yang sudah diklasifikasi
membuka website
3. Activity Diagram Klasifikasi
Diagram aktivitas ini menjelaskan proses klasifikasi.
Gambar III.5 Activity Diagram Klasifikasi
Pembobotan Mengambil data teks
Menghitung jarak
Mengurutkan jarak
Menentukan tetangga terdekat
Menentukan Kelas
Mengeluarkan hasil klasifikasi positif
Mengeluarkan hasil klasifikasi negatif
Menginisiasi hasil klasifikasi tidak
dapat dilakukan hasil klasifikasi positif
hasil klasifikasi negatif tidak ada hasil klasifikasi
4. Activity Diagram Pembobotan
Diagram aktivitas ini menjelaskan tentang proses pembobotan.
Gambar III.6 Activity Diagram Pembobotan
Menerima teks yang akan diberikan bobot
Case Folding Cleansing
Tokenizing
Stopping
Stemming
Mengeluarkan hasil pembobotan
5. Activity Diagram Cleansing
Diagram dktivitas ini menjelaskan tentang proses cleansing.
Gambar III.7 Activity Diagram Cleansing
6. Activity Diagram Case Folding
Diagram aktivitas ini menjelaskan tentang proses case folding.
Menerima teks
Mencari karakter yang tidak diperlukan
Menghaapus karakter yang tidak diperlukan
[menemukan] [tidak menemukan]
Menerima Output Cleansing
Mengubah Semua Token Menjadi Lower Case
Gambar III.8 Activity Diagram Case Folding
7. Activity Diagram Tokenizing
Diagram aktivitas ini menjelaskan tentang proses tokenizing.
Gambar III.9 Activity Diagram Tokenizing
8. Activity Diagram Stopping
Diagram aktivitas ini menjelaskan tentang proses stopping.
Gambar III.10 Activity Diagram Stopping
Menerima output case folding
Memecah teks menjadi token-token berdasarkan spasi yang memisahkan
9. Activity Diagram Stemming
Diagram aktivitas ini menjelaskan tentang proses stemming.
Gambar III.11 Activity Diagram Stemming
10. Activity Diagram Process Push Notification
Aktivitas ini menjelaskan tentang proses push notification.
Gambar III.12 Activity Diagram Push Notification
Menerima Output Stopping
Memeriksa Token Yang Masih Memiliki Imbuhan Mengubah Token Ke Bentuk Asli
Memiliki Tidak Memiliki
memuat data yang akan ditampilkan
mengirim notifikasi
menampilkan suggest dan data url
11. Activity Diagram Process Pemilihan Aksi
Diagram aktivitas ini menjelaskan tentang proses pemilihan aksi.
Gambar III.13 Activity Diagram Pemilihan Aksi
12. Activity Diagram Process Register
Diagram aktivitas ini menjelaskan tentang proses register yang dilakukan oleh user.
Gambar III.14 Activity Diagram Register
13. Activity Diagram Login
Diagram aktivitas ini menjelaskan proses login pada smartphone orang tua. Berikut adalah detailnya.
Gambar III.15 Activity Diagram Login
14. Activity Diagram Process Login Extension
Diagram aktivitas ini menjelaskan alur ketika login dari Extension
Gambar III.16 Activity Diagram Login Extension
15. Activity Diagram Process Logout Extension
Diagram aktivitas ini menjelaskan alur ketika logout dari Extension.
Gambar III.17 Activity Diagram Logout Extension
Orang tua Sistem
menekan tombol login menampilkan halaman login
mengsi data pengguna melakukan validasi
data pengguna melakukan
submit data pengguna
menyimpan status telah login pada ekstension
tidak menyimpan status telah login pada
ekstension [valid]
[tidak valid]
Orang Tua System
Memasukan data password
Menekan Tombol Logout
melakukan validasi data
pengguna
menampilkan halaman popup
ekstension menampilkan
halaman popup ekstension
[tidak valid] [valid]
16. Activity Diagram Process Penyajian Laporan
Bagian ini menjelaskan penyajian laporan.
Gambar III.18 Activity Diagram Penyajian Laporan
17. Activity Diagram Process Cek Web
Bagian ini menjelaskan proses Cek Web pada halaman aksi.
Gambar III.19 Activity Diagram Cek Web
Orang Tua Sistem
Tap Login
Menampilkan DataLaporan Login
Memilih Salah Satu Laporan
Pengiriman Aksi
Orang Tua Sistem
Tap tombol Cek Web
Melakukan data url yang diakses
Menampilkan halaman website sesuai url
54
III.1.10.3 Class Diagram
Class diagram dapat dilihat pada Gambar III.20.
Gambar III.20 Class Diagram
cleanning
control -clean: string
+cleanteks
Klasifikasi
control +teks: string
-casefold: casefolding -clean: cleanning
-stop: stopping -token: tokenizing
-stem: stemming -tfidf: TfIdf
-term: array -jumlah_term: int
-data_teks: array -data_testing: string
-jumlah_teks: int -hasil_kelas: string
-docs: string
+knnteks
Tfidf
control +teks: string
+createindex +tf
+ndw +idf
ekstension
control -allteks: string
+kelasifikasi: klasifikasi +DetailWebpage: MWebpage
-status_url: string -aksi_ortu: string
-count_action: int -callin
-getaksi -cekaksi
+sendnotif -blok
-warning +startrequest
stemming
control -stem: string
+stemteks
stopping
control -stop: string
+stopteks
MUser
entity +id_user: int
+email: string +password: string
+set_iduser +get_iduser
+set_email +get_email
+set_password +get_password
-Load -selec
+btn_L
Report
entity +id_report: int
+teks: string +status: string
+get_idreport +get_teks
+get_status +set_status
+set_teks +set_idreport
1 1
VModelNotif
control +teks: string
+suggest: string +url: string
+aksi: string +PostAksi
+openurl +OnNavigatedTo
LoginExtension
boundary +btn_login
LogoutExtension
boundary +btn_logout
VAction
boundary +Loadnotif
+btnSend_Tap +btnCek_Web
tokenizing
control -token: string
+tokenteks
MUserExtenion
entity +id_user: int
+email: string +passwrd: string
+get_email +get_password
+set_email +set_password
+get_id +set_id
VWebpage
boundary +submit_url
MWebpage
entity +url: string
+title: string +teks: string
+status: string +get_teks
+get_url +get_title
+set_teks +get_status
VM
+ListMod +Down
+OnNa +logut
1
1 1
1 1
1 1
1
V
+ema +pass
+Post +Post
+OnN
VModelUserExtension
control -email: string
-password: string +PostLogin
+PostLogout +SetLocalstorage
casefolding
-str: string +casefoldteks
1 1
1 1
1
1 1
1 1
1
1 1
1 1
1 1
1 0..
1
1 1
1 1
1 1
1 1
1 1
1
VCekWeb
boundary +LoadPage
1
1
MiniBrowser
control 1
1
III.1.10.4 Sequence Diagram
Pada bagian ini akan dipaparkan sequence diagram dari setiap usecase utama. Berikut merupakan sequence diagram dari perangkat lunak yang dibangun:
1. Register
Gambar III.21 Sequence Diagram Register
alt
[result valid]
[result invalid] [result valid]
[result invalid] : Orang tua
VRegister boundary
VModelUser control
MUser entity
email password
btnRegister_Tap PostRegister
set_email set_password
get_email email
get_password password
result
msgbox:success OnNavigatedTo
msgbox:failed
2. Login
Gambar III.22 Sequence Diagram Login
alt
[result valid]
[result invalid] [result valid]
[result invalid] : Orangtua
VLogin boundary
VModelUser control
MUser entity
email password
btnLogin_Tap PostLogin
set_iduser set_email
set_password get_email
email get_password
password get_iduser
iduser result
msgbox:succses OnNavigatedTo
msgbox:failed
3. Membuka Website
Gambar III.23 Sequence Diagram Membuka Website
alt
[url good]
[url tidak ditemukan] [url bad]
[url good]
[url tidak ditemukan] [url bad]
alt
[aksi allow] [aksi not allow]
[[aksi kosong]] [aksi allow]
[aksi not allow] [[aksi kosong]]
Ekstension control
: Anak VModelNotif
control : Orang tua
VAction boundary
webpage boundary
MWebPage entity
MUser entity
klasifikasi control
url submit_url
set_url get_url
url cekUrl
result callin
blok
set_title set_teks
get_title title
get_teks teks
knn hasil_kelas
set_iduser get_iduser
iduser sendnotif
suggest,teks, url LoadNotif
cekaksi btnSend_Tap
aksi PostAksi
callin blok
warning
4. Penyajian Laporan
Gambar III.24 Sequence Diagram Penyajian Laporan
5.
Login ekstension
Gambar III.25 Sequence Diagram Login Ekstension
: Orang tua VReport
boundary VModelReport
control MReport
entity MUser
entity Load_Report
DownloadListReport set_iduser
get_iduser iduser
set_idreport get_idreport
idreport set_status
get_status status
set_teks get_teks
teks selectReport
OnNavigatedTo
alt
[emailpassword valid] [emailpassword invalid]
[emailpassword valid] [emailpassword invalid]
: Orangtua VLoginExtension
boundary VModelUserExtension
control MUserExtension
entity
password btnLogin
PostLogin set_iduser
set_email set_password
get_email email
get_password password
get_iduser iduser
result msgbox:succsesfull
SetLocalstorage
msgbox:failed
6. Logout Extension
Gambar III.26 Sequence Diagram Logout Extension
alt
[emailpassword valid]
[password invalid] [emailpassword valid]
[password invalid] : Orangtua
VLoginExtension boundary
VModelUserExtension control
MUserExtension entity
password btnLogout
PostLogout set_iduser
set_password
get_password password
get_iduser iduser
result
SetLocalstorage msgbox:succsesfull
msgbox:failed
7.
Pemilihan Aksi
Gambar III.27 Sequence Diagram Pemilihan Aksi
8.
Cek Web
Gambar III.28 Sequence Diagram Cek Web
: Orang tua VModelNotif
control VAction
boundary MWebpage
entity
aksi btnSend_Tap
PostAksi set_status
get_status status
OnNavigatedTo
: Orangtua VCekWeb
boundary VAction
boundary VModelNotif
control MWebPage
entity MiniBrowser
control
btnCek_Web get_url
url OnNavigate
LoadPage MiniBrowser
NavigateSite Site
III.2 Perancangan Sistem
Perancangan dalam pengembangan perangkat lunak ini meliputi perancangan data, perancangan antarmuka, dan perancangan prosedur.
III.2.1 Perancangan Data
Pada penelitian ini perancangan data yang dimaksud berupa struktur tabel yang digunakan untuk penyimpanan data pada mvp. Perancangan data dipaparkan
dalam bentuk skema relasi dan struktur tabel. Skema Relasi dapat dilihat pada Gambar III.29.
Gambar III.29 Skema Relasi
Berikut ini pemaparan tabel yang digunakan untuk penyimpanan data teks, data testing, data url, data report, data user dan data stopword:
1. Tabel Teks
Tabel data teks merupakan tabel yang menampung penyimpanan teks yang sudah diberi label good atau bad.
Tabel III-36 Perancangan Tabel Teks
Nama Field Tipe Data Ukuran Kunci
Keterangan id
Int Primary Key Not Null, Auto Increment
teks text
Not null kelas
Varchar 4
Not null
2. Tabel Stopword
Tabel stopword merupakan tabel yang menampung kata-kata yang akan dihapus pada proses preprocessing.
Tabel III-37 Perancangan Tabel Stopword
Nama Field Tipe Data Ukuran Kunci
Keterangan stopword
Varchar 30
Primary Key Not Null
3. Tabel URL
Tabel url merupakan kumpulan url yang telah diklasifikasikan memiliki konten negative atau tidak didalamnya.
Tabel III-38 Perancangan Tabel Url
Nama Field Tipe Data Ukuran Kunci
Keterangan id
Int Primary Key Not Null, Auto Increment
url text
Not null, Unique status
varchar 4
4. Tabel User
Tabel user digunakan untuk menyimpan data user.
Tabel III-39 Perancangan Tabel User
Nama Field Tipe Data Panjang Kunci Keterangan
id_user Integer
11 Primary Key Auto_Increment, Not Null
email Varchar
50 -
Not Null, Unique password
Varchar 100
- Not Null
5. Tabel Pushuri
Tabel Pushuri digunakan untuk menyimpan data url yang digunakan pada proses push notification..
Tabel III-40 Pushuri
Nama Field Tipe Data Panjang Kunci Keterangan
id_user Integer
11 Foreign Key references tb_user id Not Null
uri Varchar
300 -
6. Tabel Report
Tabel report digunakan untuk menyimpan data laporan browsing yang dilakukan pada browser.
Tabel III-41 Perancangan Tabel Report
Nama Field Tipe Data
Ukuran Kunci
Default id
Integer 11
Primary Key -
teks teks
- -
Nama Field Tipe Data
Ukuran Kunci
Default url
Datetime -
- aksi
Varchar 9
- Kosong
id_user Integer
11 Foreign Key references
tb_user id -
III.2.2 Perancangan Antarmuka
Perancangan antarmuka merupakan tahapan perancangan tampilan konten dari sistem yang dibangun yang akan disajikan di layar. Tampilan antarmuka yang
dibutuhkan pada perangkat lunak yang akan dibangun adalah tampilan pada halaman blocked yang muncul jika halaman website yang akan dibuka mengandung
konten negatif. Berikut perancangan antarmuka; 1.
Perancangan Tampilan Awal Pada Smarthphone
Gambar III.30 Perancangan Tampilan Awal
2. Perancangan Tampilan Register
Gambar III.31 Perancangan Tampilan Register
3. Perancangan Tampilan Login
Gambar III.32 Perancangan Tampilan Login
4. Perancangan Tampilan Report
Gambar III.33 Perancangan Tampilan Report
5. Perancangan Tampilan Aksi
Gambar III.34 Perancangan Tampilan Aksi
6. Perancangan Tampilan Popup Pada Ekstension Browser
Tampilan yang digunakan pengguna yang akan login, tampilan muncul pada popup ekstension browser
Gambar III.35 Perancangan Tampilan Popup
7. Perancangan Tampilan Login Extension Browser
Tampilan untuk memasukan data pengguna yang digunakan untuk verifikasi.
Gambar III.36 Perancangan Tampilan Login Extension
8. Perancangan Tampilan Logout Extension Browser
Tampilan untuk memasukan password pengguna yang digunakan untuk verifikasi logout.
Gambar III.37 Perancangan Tampilan Logout Extension
9. Perancangan Tampilan Warning
Tampilan yang muncul ketika tidak ada aksi yang dipilih oleh orang tua dari smartphone.
Gambar III.38 Perancangan Tampilan Warning
10. Perancangan Tampilan Antarmuka Halaman Blocked
Tampilan antarmuka ini akan muncul ketika halaman yang akan dibuka memiliki konten negatif.
Gambar III.39 Perancangan Tampilan Halaman Blocked
III.2.3 Perancangan Fungsional
Perancangan fungsional pada sistem : a.
Pengambilan data dari halaman website yang akan dibuka. b.
Dilakukan preprocessing terhadap data yang telah diambil dari halaman website.
c. Dilakukan perhitungan jarak antara data pada halaman website dengan data-
data pada data training. d.
Mengklasifikasikan data berdasarkan jarak yang sudah dihitung. e.
Mengirim notifikasi yang berisi suggest dari hasil klasifikasi yang telah dilakukan.
f. Menerima aksi dari orang tua.
g. Melakukan blok halaman jika aksi orang tua adalah not allow, atau membuka
halaman website jika aksi dari orang tua adalah allow. h.
Menampilkan halaman warning pada web browser jika orang tua belum melakukan aksi.
69
BAB IV IMPLEMENTASI DAN PENGUJIAN SISTEM
Kategori