Perancangan Sistem Perancangan Antarmuka Sistem

Pada Gambar 3.4 menggambarkan perilaku user terhadap sistem untuk menampilkan suatu objek. Sequence Diagram menggambarkan interakasi antara objek didalam disekitar system yang bersifat dinamis.

3.5 Perancangan Sistem

Berdasarkan hasil dari analisis maka dapat dibangun suatu Flowchart diagram alir untuk menggambarkan lebih rinci tentang bagaimana setiap langkah program atau prosedur dalam satu urutan. Pada Gambar 3.5 menjelaskan mengenai beberapa menu dari aplikasi yang dapat diakses pengguna. Proses menampilkan objek AR dapat terlihat pada Menu Objek yang ketika ditekan maka akan masuk ke dalam halaman objek, yang di dalamnya terdapat 8 objek yang dapat dipilih. Di dalam salah satu objek terdapat penjelasan dari objek tersebut dan Augmented reality. Pada Gambar 3.6 merupakan flowchart alur kerja perancangan aplikasi. Gambar 3.5 Flowchart Sistem Universitas Sumatera Utara Gambar 3.6 Flowchart Alur Kerja Perancangan Sistem Pada gambar 3.6 menjelaskan Alur Kerja Perancangan Aplikasi. Awal mula masukan objek ke unity 3D, Setelah itu lakukan coding program di dalam Unity 3D. Kemudian objek yang telah diproses oleh unity 3D berupa .apk akan ditampilkan. Setelah itu aplikasi .apk diinstal ke smartphone.

3.6 Perancangan Antarmuka Sistem

3.6.1 Rancangan Halaman UtamaHome Tampilan rancangan pada halaman Utama dapat dilihat pada Gambar 3.7, serta keterangan komponen yang terdapat pada halaman Utama dapat dilihat pada tabel 3.2. Gambar 3.7 Rancangan Halaman Utama Universitas Sumatera Utara Tabel 3.2 Komponen-Komponen pada Halaman Home No Jenis Komponen Keterangan 1 Nama Aplikasi Text Judul Aplikasi 2 Tombol Menu Button Tombol yang akan menampilkan halaman yang berisi jenis-jenis Objek 3 Tombol Petunjuk Button Tombol yang akan menampilkan halaman petunjuk 4 Tombol About Tentang Button Tombol yang akan menampilkan halaman About Tentang 5 Tombol Exit Button Tombol yang akan menampilkan halaman Exit 3.6.2 Rancangan Halaman Menu Dalam Rancangan halaman Menu dapat dilihat pada Gambar 3.8, serta keterangan komponen yang terdapat pada halaman Menu dapat dilihat pada tabel 3.3. Gambar 3.8 Rancangan Halaman Menu Tabel 3.3 Komponen-Komponen pada Halaman Menu No Jenis Komponen Keterangan 1 Nama Halaman Judul Halaman 2 Back Button Tombol untuk kembali ke halaman utama Universitas Sumatera Utara 3 Tombol Bajaj Button Tombol yang akan menampilkan halaman informasi Bajaj 4 Tombol Becak Button Tombol yang akan menampilkan halaman informasi Becak 5 Tombol Bus Button Tombol yang akan menampilkan halaman informasi Bus 6 Tombol Delman Button Tombol yang akan menampilkan halaman informasi Delman 7 Tombol Kapal Laut Button Tombol yang akan menampilkan halaman informasi Kapal Laut 8 Tombol Kereta Api Button Tombol yang akan menampilkan halaman informasi Kereta Api 9 Tombol Pesawat Button Tombol yang akan menampilkan halaman informasi Pesawat 10 Tombol Taksi Button Tombol yang akan menampilkan halaman informasi Taksi 3.6.3 Rancangan Halaman Informasi Objek Dalam Rancangan halaman Informasi Objek dapat dilihat pada Gambar 3.9, serta keterangan komponen yang terdapat pada halaman Informasi Objek dapat dilihat pada tabel 3.4. Gambar 3.9 Rancangan Halaman Informasi Objek Universitas Sumatera Utara Tabel 3.4 Komponen-Komponen pada Halaman Informasi Objek No Jenis Komponen Keterangan 1 Nama Objek Text Nama Objek Bajaj 2 Tombol Back Button Tombol ini aka kembali ke halaman Menu 3 Gambar Bajaj Image Menampilkan gambar Bajaj 4 Informasi Bajaj Text Menampilkan informasi tentang Bajaj 5 Vertical Slider atas bawah Slider Slider akan menaikan dan menurunkan informasi tentang Bajaj 6 Tombol tulisan Mandarin dan Indonesia objek Image dan Button Tombol ini akan memunculkan suara bahasa Mandarin dari objek serta menampilkan informasi tulisan Mandarin dan Indonesia dari Bajaj 7 Tombol Kamera Ar Button Tombol untuk menampilkan Augmented Reality dari objek 3.6.4 Rancangan Halaman Augmented RealityARCamera Dalam Rancangan halaman Augmented RealityARCamera dapat dilihat pada Gambar 3.10, serta keterangan komponen yang terdapat pada halaman Augmented RealityARCamera dapat dilihat pada tabel 3.5. Gambar 3.10 Rancangan Halaman Augmented RealityARCamera Universitas Sumatera Utara Tabel 3.5 Komponen-Komponen pada Halaman Augmented RealityARCamera No Jenis Komponen Keterangan 1 Layar Kamera Layar Kamera akan menampilkan halaman AR kamera dan menampilkan objek 3D 2 Back Button Tombol untuk kembali ke halaman informasi objek Tambahan keterangan rancangan halaman Augmented Reality AR Camera yaitu untuk zoom in dan zoom out gambar 3D dengan cara menggunakan jari tangan jempol dan jari telunjuk untuk zoom in dan zoom out. Sedangkan untuk merotate memutar objek 3D dengan menggunakan satu tangan saja,contohnya dengan jari telunjuk. 3.6.5 Rancangan Halaman Petunjuk Dalam Rancangan halaman petunjuk dapat dilihat pada Gambar 3.11, serta keterangan komponen yang terdapat pada halaman petunjuk dapat dilihat pada tabel 3.6. Gambar 3.11 Rancangan Halaman Petunjuk Universitas Sumatera Utara Tabel 3.6 Komponen-Komponen pada Halaman Petunjuk No Jenis Komponen Keterangan 1 Petunjuk Text Judul halaman Cara kerja aplikasi 2 Logo Printer Button Tombol untuk mendownload Marker 3 Back Button Tombol untuk kembali ke halaman utama 3.6.6 Rancangan Halaman About Dalam Rancangan halaman about dapat dilihat pada Gambar 3.12, serta keterangan komponen yang terdapat pada halaman about dapat dilihat pada tabel 3.7. Gambar 3.12 Rancangan Halaman About Tabel 3.7 Komponen-Komponen pada Halaman About No Jenis Komponen Keterangan 1 Foto Profil Image Foto Profil diri 2 Profil diri Text Isi tentang profil diri pembuat aplikasi 3 Logo USU Image Isinya merupakan logo USU 4 Back Button Tombol untuk kembali ke halaman utama Universitas Sumatera Utara 3.6.7 Rancangan Halaman Exit Dalam Rancangan halaman Exit dapat dilihat pada Gambar 3.13, serta keterangan komponen yang terdapat pada halaman Exit dapat dilihat pada tabel 3.8. Gambar 3.13 Rancangan Halaman Exit Tabel 3.8 Komponen-Komponen pada Halaman Exit No Jenis Komponen Keterangan 1 Foto Profil Text Untuk menampilkan tulisan ingin keluar aplikasi 2 Yes Button Tombol untuk keluar dari aplikasi 3 No Button Tombol ini akan kembali ke halaman Utama

3.7 Proses Pembuatan Objek 3D