• Tidak ada hasil yang ditemukan

Implementasi Sistem

IMPLEMENTASI DAN PENGUJIAN

4.1. Implementasi Sistem

Pada tahap ini akan dibahas proses implementasi yang merupakan lanjutan dari analisis dan perancangan. Proses pengimplementasian ini menggunakan hardware dan software untuk menjalankan aplikasi. Aplikasi mobile sosial media ini ini menggunakan bahasa pemrograman PHP dan Java.

4.1.1. Spesifikasi Perangkat Lunak

Spesifikasi perangkat lunak yang digunakan untuk membangun sistem adalah sebagai berikut:

1. Sistem operasi Microsoft Windows 7 Ultimate 64-bit 2. Eclipse Juno

3. Android versi 4.0 (JellyBean) 4. XAMPP versi 1.8.1

5. MySQL versi 5.5.27

4.1.2. Spesifikasi Perangkat Keras

Spesifikasi perangkat lunak yang digunakan untuk membangun sistem adalah sebagai berikut:

1. Prosesor Intel Core i3-370M CPU 2.40 GHz. 2. Kapasitas harddisk 468 GB.

3. Memori 4.00 GB RAM DDR3. 4. Smartphone Android layar 7 inch. 4.1.3. Implementasi Perancangan Antarmuka

Implementasi perancangan antarmuka berdasarkan rancangan yang telah dilakukan pada Bab 3 adalah sebagai berikut

1. Halaman Awal

Halaman awal atau tampilan depan yang akan muncul saat membuka aplikasi yaitu berupa sebuah logo dari aplikasi serta menu pilihan berupa sign in untuk mengakses aplikasi dengan akun user yang terdaftar dan signup untuk membuat akun agar terdaftar sebagai user aktif. Tampilan halaman awal aplikasi ini dapat dilihat pada gambar 4.1.

Gambar 4.1 Halaman Awal 2. Halaman Sign up

Halaman sign up merupakan halaman awal untuk mendaftar ke aplikasi ini. Pengguna baru memasukkan name, no HP, username, email dan password sesuai kenginan.Tampilan halaman sign up dapat dilihat pada gambar 4.2.

Gambar 4.2 Halaman Sign up 3. Halaman Sign in

Pada halaman login, user memberikan username dan password yang telah terdaftar untuk dapat mengakses aplikasi. Tampilan halaman sign in aplikasi ini dapat dilihat pada gambar 4.3.

Gambar 4.3 Halaman Sign in 4. Halaman Verification

User baru yang melakukan tahap sign in untuk pertama kalinya akan diarahkan ke halaman verifikasi.Sistem akan mengirim kode kepada user dalam melalui sms. User diminta untuk memasukan 6 digit angka verifikasi yang diterima untuk tahap verifikasi akun. Setelah proses verifikasi akun berhasil, secara otomatis user berhasil

sign in kedalam aplikasi. Proses verifikasi akun hanya dilakukan sekali yaitu saat melakukan tahap sign in untuk yang pertama kalinya. Tampilan halaman verification aplikasi ini dapat dilihat pada gambar 4.4.

Gambar 4.4 Halaman Verification 5. Halaman Home

Pada halaman home terdapat tiga kolom yaitu kolom invitation, kolom invited dan kolom friend. Kolom invitation merupakan kolom kumpulan undangan yang pernah dibuat. Kolom invited merupakan kolom kumpulan undangan yang sudah diterima. Kolom friend merupakan kolom kumpulan pertemanan. Tampilan halaman home dapat dilihat pada gambar 4.5.

6. Halaman Menu

Terdapat halaman dinamis yang tersembunyi dan akan muncul saat button menu dipilih. Adapun yang terdapat di halaman menu adalah home, create invitation, search friend, update profile dan logout. Tampilan halaman menu dapat dilihat pada gambar 4.6.

Gambar 4.6 Halaman Menu 7. Create Invitation

a. Halaman Pop Up Create Invitation

Tahap awal setelah user memulai fitur create invitation adalah mengisi judul undangan, tanggal dan waktu acara yang akan diadakan. Tampilan pop up create invitation dapat dilihat pada gambar 4.7.

Gambar 4.7 Halaman Pop Up Create Invitation b. Halaman Upload Cover

Setelah mengisi field pada pop up create invitation, sistem mengarahkan user ke tahap awal pembuatan undangan yaitu upload cover. Gambar yang diupload pada halaman cover berfungsi sebagai icon invitation yang muncul di daftar invitation maupun daftar invited. Tampilan halaman upload cover dapat dilihat pada gambar 4.8.

Gambar 4.8 Halaman Upload Cover c. Halaman Upload Video

Tahap berikutnya setelah mengupload gambar untuk cover, user dapat mengupload video yang berhubungan dengan acara yang akan diadakan. Dengan menyediakan

video, user dapat member info mengenai acara dengan cara menarik untuk mengundang ketertarikan para tamu yang mendapatkan undangan. Adapun maksimal size viedo yang diupload adalah 40mb. Tampilan halaman upload video dapat dilihat pada gambar 4.9.

Gambar 4.9 Halaman Upload Video d. Halaman Insert Note

Tahap selanjutnya adalah tahap insert note . Tahap ini adalah fitur tambahan dimana user dapat memberikan informasi tambahan mengenai acara yang akan berlangsung. User memberikan informasi mengenai acara yang tidak terdapat pada video atau gambar yang telah diupload sebelumnya. Tampilan halaman insert note dapat dilihat pada gambar 4.10.

e. Halaman Insert Facility

Tahap ke-empat dalam create invitation adalah tahap insert facility dimana pada tahap ini user dapat memberikan informasi mengenai fasilitas-fasilitas yang tersedia pada acara. Seperti photobooth, games, doorprice, souvenir dan lain-lain. User dapat memberi infomasi ini dengan upload gambar. Terdapat button untuk menambah ataupun menghapus gambar yang sudah diupload. Tampilan halaman insert facilty dapat dilihat pada gambar 4.11.

Gambar 4.11 Halaman Insert Facility f. Halaman Insert Dish

Pada tahap selanjutnya user dapat memberikan informasi seputar menu hidangan yang akan disajikan saat acara berlangsung. Terdapat button untuk menambah ataupun menghapus gambar yang sudah diupload. Tahap ini dapat di skip atau dilewatkan. Tampilan halaman insert dish dapat dilihat pada gambar 4.12.

Gambar 4.12 Halaman Insert Dish g. Invite

Pada halaman ini user dapat memilih tamu yang akan diundang. Terdapat button invite friend yang akan mengarahkan user ke daftar pertemanan. User dapat memilih teman yang akan menjadi tamu dengan mencentang checkbox yang disediakan. Tampilan invite dapat dilihat pada gambar 4.13 dan 4.14.

Gambar 4.14 Halaman Invite Friend h. Halaman Search Location

Tahap ini adalah salah satu tahap penting yang tidak boleh di skip atau dilewatkan. User dapat mencari lokasi acara dengan cara drag marker yang disediakan didalam peta. Setelah mendapatkan titik lokasinya user dapat menekan tombol update location agar sistem dapat mengirim titik koordinat lokasi ke server. Selain itu user juga dapat mengaktifkan gps untuk mendapatkan titik lokasi saat user tepat berada dilokasi acara yang akan berlangsung. Adapun fitur location ini mengakses data goolge map. Tampilan halaman search location dapat dilihat pada gambar 4.15.

8. View Invitation a. View Cover

Saat user menerima sebuah undangan, adapun halaman awal yang tampil adalah judul undangan, tanggal serta waktu acara sebagai header dalam halaman cover. Terdapat gambar yang mewakili cover undangan. Tampilan view cover dapat dilihat pada gambar 4.16.

Gambar 4.16 Halaman View Cover b. View Video

Tamu dapat menikmati video yang sudah terlebih dahulu diupload oleh pemilik undangan. Video ini dapat berupa informasi mengenai acara yang akan diadakan. Ukuran video tidak boleh melebihi 40mb dan memiliki format mp4. Tampilan view video dapat dilihat pada gambar 4.17.

Gambar 4.17 Halaman View Video c. View Note

Menu selanjutnya yang dapat dilihat oleh tamu dari undangan yang dikirim adalah note yaitu catatan atau informasi tambahan mengenai acara yang akan dilakasanakan. Tampilan view note dapat dilihat pada gambar 4.18.

Gambar 4.18 Halaman View Note d. View Facility

Menu ketiga yang dapat dilihat pada undangan adalah menu facility dimana terdapat daftar fasilitas-fasilitas yang ada pada acara seperti photobooth, games, dan souvenir. Tampilan view facility dapat dilihat pada gambar 4.19.

Gambar 4.19 Halaman View Facility e. View Dish

Menu selanjutnya yang dapat dilihat dari undangan adalah menu dish. Disini user dapat melihat daftar menu hidangan yang ada pada acara. Tampilan view dish dapat dilihat pada gambar 4.20.

Gambar 4.20 Halaman View Dish f. View List Guest

Pada halaman list guest user dapat melihat daftar tamu-tamu yang diundang oleh pengirim. Tampilan view list guest dapat dilihat pada gambar 4.21.

Gambar 4.21 Halaman View Guest g. View Location

Menu terkahir yang dapat dilihat oleh user yaitu menu location dimana lokasi acara di tampilkan dalam sebuah peta yang mengakses google map. User sebagai tamu yang nantinya akan menghadiri acara dapat meminta rute menuju lokasi acara dengan mengaktifkan gps terlebih dahulu. Adapun fitur rute ini sudah tersedia pada google map. Tampilan halaman location dapat dilihat pada gambar 4.22.

Gambar 4.22 Halaman View Location g. Halaman Comment

Terdapat fitur comment dimana user dapat memberikan komentar mengenai udangan yang diterima. Fitur comment ini terdapat pada halaman invitation dimana user dapat memberikan komentar mengenai acara yang akan berlangsung. Setelah memberikan comment pada box yang disediakan, akan muncul foto dan nama user, komentar yang diberikan beserta keterangan waktu. Tampilan halaman comment dapat dilihat pada gambar 4.23.

Gambar 4.23 Halaman Comment 9. Halaman Update Profile

Pada halaman update profile user mengganti nama, nomor telepon, alamat dan profil foto. Tampilan halaman update profile dapat dilihat pada gambar 4.24.

Gambar 4.24 Halaman Update Profile 10. Halaman Search Friend

User dapat mencari dan menemukan akun user lainnya dengan mengisi nama user yang akan ditemukan pada field yang disediakan. Tampilan halaman search friend dapat dilihat pada gambar 4.25.

Gambar 4.25 Halaman Search Friend 11. Halaman Profile

Pada halaman profile, user dapat melihat profil foto user lainnya. User juga dapat melihat undangan yang telah dibuat, undangan yang telah diterima maupun daftar pertemanan user lainnya. Halaman ini juga tersedia pilihan untuk menambahkan user lain menjadi teman dengan mencentang checkbox add friend. Apabila user telah menkonfirmasi permintaan pertemenan maka status akan berubah menjadi friend. Tampilan halaman profile dapat dilihat pada gambar 4.26.

Dokumen terkait