BAB IV HASIL DAN UJI COBA
IV.1. Jalannya Uji Coba Untuk menjalankan rancangan aplikasi web mobile ini, penginputan data ataupun informasi pertama. User harus membuka aplikasi web terlebih dahulu melalui browser komputer seperti Google Chrome dengan cara mengetikkan http://localhost/pembelajaran/index/admin/index.php. Ketika program web telah terbuka maka akan ada tampilan menu login, user harus mengisi User Name dan Password tersebut agar bisa masuk kedalam form utama, didalam form utama terdapat tiga pilihan menu yaitu Pengaturan Data Informasi, Pengaturan Data User dan Pengaturan Data Buku Tamu. Di dalam form Pengaturan Data Informasi terdapat juga form Artikel, dimana user dapat menambah serta merubah artikel atau judul topik pembelajaran. dan di dalam form Pengaturan Data User, user dapat menambah serta merubah data user. Sedangkan didalam form Pengaturan Data Buku Tamu, user dapat melihat serta dapat menghapus daftar pengunjung dari daftar Buku Tamu. Sedangkan untuk tampilan aplikasi web yang kedua dijalankan menggunakan browser Handphone menggunakaan simulator android. langkah yang harus dilakukan hampir sama dengan yang pertama. Yaitu jalankan simulator android, begitu simulator sudah muncul, kemudian pilih web browser yang dimiliki simulator
android
tersebut.
Kemudian
masukkan
perintah
ini
http://10.0.2.2/pembelajaran/. Setelah itu akan muncul tampilan form utama, lalu
65
66
pilih tombol lanjut untuk menampilkan form menu utama. Pada form menu utama terdapat enam pilihan, yaitu. Menu Profil, Visi dan Misi, Kategori Jquery, Buku Tamu, Forum dan About me. Jika memilih menu Profil, maka akan tampil isi dari profil. Jika memilih Visi dan Misi maka akan menampilkan Artikel mengenai Visi dan Misi. Jika memilih menu Kategori Jquery maka akan ada daftar menu lagi, yang apabila salah satu menu dipilih maka dapat dilihat isi dari form tersebut berisi mengenai pembelajaran dari Jquery dan Jquery Mobile. Jika memilih Buku Tamu, user dapat meninggalkan informasi berupa nama, email serta Pesan yang kemudian dapat disimpan. Jika memilih Forum, maka akan tampil dua menu pilihan forum yaitu forum diskusi atau tanya jawab. Dan jika memilih About me, maka user dapat melihat Biodata Penulis / Perancang Web tersebut. IV.2. Tampilan Layar Setelah selesai melakukan perancangan program, program dijalankan atau diimplementasikan serta dilakukan pengujian atas aplikasi yang dibangun. Berikut ini akan dijelaskan tentang bagaimana tampilan hasil dari ”Rancang Bangun Web Mobile Menggunakan Jquery Mobile”. 1. Tampilan Form Login Tampilan form login ini berfungsi sebagai tampilan awal untuk masuk kedalam form utama. Gambar tampilan menu login dapat dilihat pada gambar IV.1 berikut ini.
67
Gambar IV.1. Tampilan Form Login 2. Tampilan Form Utama Pada tampilan form utama terdapat tiga form pilihan yaitu form pengaturan data informasi, data user dan data buku tamu. Gambar tampilan form utama dapat dilihat pada gambar IV.2 berikut ini.
68
Gambar IV.2. Tampilan Form Utama 3. Tampilan Form Pengaturan Data Informasi Tampilan form Pengaturan Data Informasi ini adalah tampilan untuk mengisi informasi / artikel kedalam database yang nantinya akan ditampilkan melalui web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.3 berikut ini.
69
Gambar IV.3. Tampilan Form Pengaturan data informasi 4. Tampilan Form Add Data Artikel Tampilan form Add Data Artikel ini adalah tampilan untuk mengisi Judul serta isi pembelajaran yang nantinya akan disimpan kedalam database sebelum ditampilkan dalam web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.4 berikut ini.
70
Gambar IV.4. Tampilan Form Add Data Artikel 5. Tampilan Form Pengaturan Data User Tampilan form Pengaturan Data User ini adalah tampilan untuk mengisi maupun merubah data user, berupa nama serta Password. Adapun tampilan gambarnya dapat dilihat pada gambar IV.5 berikut ini.
71
Gambar IV.5. Tampilan Form Pengaturan Data User 6. Tampilan Form Add Data User Tampilan form Add Data User ini adalah tampilan untuk menambahkan data User. Adapun tampilan gambarnya dapat dilihat pada gambar IV.6 berikut ini.
72
Gambar IV.6. Tampilan Form Add Data User 7. Tampilan Form Data Buku Tamu Tampilan form Data Buku Tamu ini adalah tampilan untuk melihat data yang di isi oleh orang yang mengakses web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.7 berikut ini.
73
Gambar IV.7. Tampilan Form List Buku Tamu 8. Tampilan Form Home Tampilan form Home merupakan tampilan awal saat mengakses web mobile menggunakan simulator android. Adapun tampilan gambarnya dapat dilihat pada gambar IV.8 berikut ini.
74
Gambar IV.8. Tampilan Form HOME 9. Tampilan Form Menu Utama Tampilan form Menu Utama merupakan tampilan menu pada web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.9 berikut ini.
75
Gambar IV.9. Tampilan Form Menu Utama 10. Tampilan Form Profil Tampilan form Profil adalah tampilan isi Profil pada web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.10 berikut ini.
76
Gambar IV.10. Tampilan Form Profil 11. Tampilan Form Visi dan Misi Tampilan form Visi dan Misi adalah tampilan visi dan Misi penulis / perancang pada web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.11 berikut ini.
77
Gambar IV.11. Tampilan Form Visi dan Misi 12. Tampilan Form Menu Pilihan Tampilan form Menu Pilihan merupakan pilihan katagori yang ada pada web mobile. Adapun tampilan gambarnya dapat dilihat pada gambar IV.12 berikut ini.
78
Gambar IV.12. Tampilan Form Menu Pilihan 13. Tampilan Form Sub Menu Pilihan Tampilan form Sub Menu Pilihan merupakan pilihan katagori yang ada form Menu Pilihan. Adapun tampilan gambarnya dapat dilihat pada gambar IV.13 berikut ini.
79
Gambar IV.13. Tampilan Form Sub Menu Pilihan 14. Tampilan Form Isi Sub Menu Pilihan Tampilan form Isi Sub Menu Pilihan merupakan tampilan isi dari Sub Menu Pilihan. Adapun tampilan gambarnya dapat dilihat pada gambar IV.14 berikut ini.
80
Gambar IV.14. Tampilan Isi Sub Menu Pilihan 15. Tampilan Form Buku Tamu Tampilan form Buku Tamu merupakan tampilan form Buku Tamu. Adapun tampilan gambarnya dapat dilihat pada gambar IV.15 berikut ini.
81
Gambar IV.15. Tampilan Form Buku Tamu 16. Tampilan Form Forum Tampilan form Forum merupakan tampilan Pilihan dari Forum yang dapat dipilih. Adapun tampilan gambarnya dapat dilihat pada gambar IV.16 berikut ini.
82
Gambar IV.16. Tampilan Forum 17. Tampilan Form Daftar Forum Tampilan form Daftar Forum merupakan tampilan isi dari pilihan yang ada pada Forum yang dapat dilihat. Adapun tampilan gambarnya dapat dilihat pada gambar IV.17 berikut ini.
83
Gambar IV.17. Tampilan Daftar Forum 18. Tampilan Form Input Forum Tampilan form Input Forum merupakan tampilan untuk pengunjung web mobile yang ingin bertanya, maka disediakan form sebagai tempat mengisikan data beserta pertanyaan yang ingin ditanyakan yang ada pada Forum yang dapat dilihat pada gambar IV.18 berikut ini.
84
Gambar IV.18. Tampilan Input Forum 19. Tampilan Form Jawaban Tampilan form Jawaban adalah sebagai tempat mengisikan jawaban dai pertanyaan yang ada pada Daftar forum, tidak hanya admin, siapapun bebas menjawab semua pertanyaan yang ada pada Daftar Forum. Gambarannya dapat dilihat pada gambar IV.19 berikut ini.
85
Gambar IV.19. Tampilan Form Jawaban 20. Tampilan Form About Me Tampilan form About Me adalah tampilan yang berisikan informasi tentang penulis. Gambarannya dapat dilihat pada gambar IV.20 berikut ini.
86
Gambar IV.20. Tampilan Form About Me IV.3. Hardware / Software Yang Dibutuhkan Adapun aplikasi yang digunakan dalam perancangan aplikasi “Rancang Bangun Web Mobile Menggunakan Jquery Mobile” ini memiliki spesifikasi hardware dan software sebagai berikut: 1. Perangkat Lunak (Softwere) : a. Macromedia Dreamweaver b. softwere Xampp c.
android sdk
d. Web Browser – Google Chrome.
87
2. Perangkat Keras (Hardwere): a. PC dengan Processor Intel®B815 2,0 Ghz, Memori 320 GB b. Keyboard, Mouse IV.4. Analisa Hasil Program aplikasi web mobile ini masih dalam tahapan pengembangan dan Berdasarkan hasil pengujian, aplikasi ini berhasil memberikan suatu pandangan baik dalam hal berbagi sebuah informasi, dimana didalam aplikasi tersebut kita dapat saling sharing atau bertukar informasi, sebab aplikasi ini dibuat dengan tema pembelajaran. IV.5. Kelebihan Dan Kekurangan IV.5.1. Kelebihan Adapun kelebihan yang dapat dipahami dalam perancangan aplikasi “Rancang Bangun Web Mobile Menggunakan Jquery Mobile” ini adalah sebagai berikut: 1. Mudah untuk dimengerti oleh para pengguna. 2. Dapat digunakan sebagai sumber informasi sederhana 3. Aplikasi yang dibangun masih bersifat dinamis 4. Dapat digunakan sebagai tempat sharing atau saling bertukar informasi antar para pengguna 5. Adanya forum tanya jawab didalam web tersebut sehingga pengguna dapat langsung bertanya mengenai isi dari pembahasan yang ada didalam web tersebut.
88
IV.5.2. Kekurangan Adapun kekurangan yang dapat dipahami dalam perancangan aplikasi “Rancang Bangun Web Mobile Menggunakan Jquery Mobile” ini adalah sebagai berikut: 1. Aplikasi ini masih belum dapat diakses secara online. 2. Aplikasi ini masih dijalankan di localhost 3. Tampilannya masih terlihat sederhana 4. Aplikasi web ini masih belum memiliki banyak fasilitas 5. Isi yang dibahas masih hanya mengenai Jquery dan Jquery Mobile