bab iii analisa dan perancangan...

17

BAB III

ANALISA DAN PERANCANGAN SISTEM

Dalam bab ini membahas tentang analisa, perancangan dan desain sistem.

Analisa sistem meliputi deskripsi produk, analisa kebutuhan fungsional, analisa

kebutuhan non fungsional dan usecase diagram. Sedangkan desain sistem ini

mengenai desain antarmuka, perancangan objek oriented (UML) dan perancangan

database.

3.1 Analisa Sistem

Analisis sistem dapat didefinisikan sebagai penguraian dari suatu sistem

informasi yang utuh kedalam bagian-bagian komponennya dengan maksud untuk

mengidentifikasi dan mengevaluasi permasalahan-permasalahan, kesempatan-

kesempatan, hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang

diharapkan sehingga dapat diusulkan perbaikan-perbaikannya. Sistem yang dibuat

merupakan sistem informasi berbasis augmented reality yaitu Penerapan

Augmented reality Markerless pada Aplikasi Android Sebagai Media Pengenalan

Gedung Universitas Muhammadiyah Malang.

Aplikasi ini dibuat dengan mengambil latar dilingkungan nyata yang

kemudian gabungkan dengan obyek-obyek 3D melalui kamera. Orientasi dan posisi

marker akan dideteksi lewat frame-frame yang ditangkap oleh kamera. Setelah

marker terdeteksi oleh kamera, maka akan didapatkan matriks transformasi yang

dapat digunakan untuk transformasi seluruh obyek yang ada dalam aplikasi.

3.1.1 Deskripsi Sistem

Aplikasi Penerapan Augmented reality Markerless pada Aplikasi Android

Sebagai Media Pengenalan Gedung Universitas Muhammadiyah Malang adalah

aplikasi yang dibuat untuk mempermudah user dalam menemukan Infomasi

Gedung-gedung kampus 3 Universitas Muhammadiyah Malang dengan cepat.

18

Secara umum aplikasi ini terdapat 4 menu, yaitu menu deteksi AR yang

digunakan untuk mendeteksi gedung-gedung di kampus 3 Universitas

Muhammadiyah Malang, menu Peta Kampus yang digunakan untuk menampilkan

Peta Kampus 3 Universitas Muhammadiyah Malang, menu Tentang yang berisi

informasi tentang aplikasi dan cara penggunaan aplikasi, dan yang terakhir Menu

Keluar yang digunakan untuk keluar dari aplikasi.

3.1.2 Analisa Kebutuhan Non Fungsional

Analisis kebutuhan non fungsional merupakan analisis yang dibutuhkan

untuk menentukan spesifikasi kebutuhan system. Spesifikasi ini juga melipiti

elemen ataupun komponen-komponen apa saja yang dibutuhkan system yang akan

dibangun sampai system tersebut diimplementasikan. Analisis kebutuhan ini juga

menentukan spesifikasi masukan yang dibutuhkan system. Pada analisis kebutuhan

system non-fungsional ini dijelaskan mengenai analisis perangkat keras

(hardware), perangkat lunak (software) dan pengguna (user) . Kebutuhan non

fungsional apikasi

Penerapan Augmented reality Markerless pada Aplikasi Android Sebagai Media

Pengenalan Gedung Universitas Muhammadiyah Malang adalah :

I. Kebutuhan Perangkat Lunak

Terdapat beberapa prangkat lunak yang digunakan dalam

membangun aplikasi ini dengan memiiki spesifikasi sebagai berikut :

a. Windows 10 Professional 64-bit

b. Unity 5.2.0f3 64-bit

c. Adobe Photoshop Cs 6

d. Blender

e. Corel Draw x3

II. Kebutuhan Perangkat Keras

Perangkat keras yang digunakan selam membangun aplikasi ini

memiliki spesfikasi sebagai berikut :

19

a. Processor : Intel(R) Core(TM) i5-4200U CPU @ 1.60GHz (4 CPUs),

~2.3GHz

b. Memory : 4.00 GB

c. Storage : 500GB HDD

d. Graphics : GeForce GT 720M

e. LCD Display : 14.0”

3.2 Perancangan Alur Sistem

Perancangan sistem merupakan tahap awal dari perancangan aplikasi.

Perancangan ini dilakukan untuk mengetahui kondisi sistem secara umum. Dalam

perancangan sistem ini akan membahas mengenai Diagram Block / Arsitektur

Sistem, Usecase, Entity Relationship Diagram, dan Design Inteface.

3.2.1 Arsitektur Sistem

Pada arsitektur aplikasi yang akan dibangun terdiri dari beberapa

komponen, yaitu : user adalah pengguna yang menggunakan aplikasi augmented

reality, user mengarahkan kamera ke arah objek atau bangunan sehingga objek

tertangkap oleh kamera. Kemudian dari objek yang di deteksi dari kamera sistem

akan menampilkan informasi tentang objek atau bangunan. User dapat meliht hasil

manipulasi sistem melalui layar smartphone android. Gambaran arsitektur sistem

dapat dilihat pada gambar 3.1.

Gambar 3.1 Arsitektur Sistem

20

3.2.2 Use Case Diagram

Digunakan untuk memodelkan atau menggambarkan batasan sistem dan

fungsi-fungsi utamanya. Mendiskripsikan fungsi dari sebuah sistem dari perspektif

pengguna, use case bekerja dengan cara mendeskripsikan tipikal interaksi antara

pengguna sebuah sistem dengan sistemnya sendiri.

Didalam sistem terdapat pengguna yaitu pemakai aplikasi. Peran aktor yang

ada dapat terlihat pada diagram Use Case pada gambar berikut.

Gambar 3.2 Usecase Diagram

3.2.3 Usecase Skenario

3.2.3.1 Skenario Use Case Tentang Aplikasi

Use case memilih menu ini menggambarkan proses dimana user memilih

menu Tentang Aplikasi ketika sedang menggunakan aplikasi.

21

Tabel 3.1 Usecase skenario Tentang Aplikasi

Nama Tentang Aplikasi

Aktor Pengguna

Trigger Menampilkan informasi tentang

aplikasi dan cara penggunaannya

Skenario Utama

Kondisi Awal Sistem menampilkan menu utama

Aksi Aktor Reaksi sistem

1. Memilih menu Tentang

Aplikasi

2. Menampilkan informasi

Tentang Aplikasi.

Kondisi Akhir Sistem menampilkan menu Tentang

Aplikasi.

3.2.3.2 Skenario Use Case PETA Kampus 3 UMM

Use Case memilih menu ini menggambarkan proses dimana user memilih

menu PETA Kampus 3 UMM ketika sedang menggunakan aplikasi.

Tabel 3.2 Usecase skenario Peta Kampus 3 UMM

Nama PETA Kampus 3 UMM

Aktor Pengguna

Trigger Menampilkan PETA Kampus 3 UMM

Skenario Utama



1. Memilih menu PETA Kampus

3 UMM

2. Menampilkan PETA Kampus 3

UMM

22

Kondisi Akhir Sistem menampilkan menu PETA

Kampus 3 UMM.

3.2.3.3 Skenario Use Case Keluar

Use Case memilih menu ini menggambarkan proses dimana user memilih

menu Keluar ketika sedang menggunakan aplikasi.

Tabel 3.3 Usecase skenario Keluar

Nama Keluar

Aktor Pengguna

Trigger Keluar dari aplikasi AR

Skenario Utama



1. Memilih menu Keluar

2. Keluar dari aplikasi AR

Kondisi Akhir Keluar dari aplikasi AR

3.2.3.4 Skenario Use Case Menggunakan Deteksi AR

Use case memilih menu ini menggambarkan proses dimana user memilih

menu Deteksi AR ketika sedang menggunakan aplikasi.

Tabel 3.4 Usecase skenario Deteksi AR

Nama Deteksi AR

Aktor Pengguna

Trigger Menggunakan aplikasi Deteksi AR

Skenario Utama



1. Menampilkan menu aplikasi.

23

2. Menyiapkan kamera

smartphone Android dan

marker dari bangunan yang

akan dideteksi.

3. Setelah marker dideteksi maka

sistem akan menampilkan

informasi pada layar android

sesuai dengan marker/bangunan

yang dideteksi

Kondisi Akhir Sistem menampilkan informasi sesuai

menu yang dipilih.

3.2.3.5 Skenario Use Case Mendeteksi Kamera

Use Case mendeteksi kamera ini menggambarkan proses dimana user harus

mendeteksi kamera terlebih dahulu sebelum menggunakan aplikasi.

Tabel 3.5 Usecase skenario Deteksi kamera

Nama Mendeteksi kamera

Aktor Pengguna

Trigger Pengguna mendeteksi kamera sebelum

menggunakan aplikasi

Skenario Utama

Kondisi Awal Smartphone android yang memiliki

kamera


1. Pengguna mengecek kamera

android berfungsi atau

tidaknya

2. Sistem mendeteksi

ketersediaan kamera

24

Kondisi Akhir Kamera terdeteksi dan aplikasi siap

untuk digunakan

3.2.3.6 Skenario Use Case Deteksi Marker

Use Case deteksi marker ini menggambarkan proses dimaan sistem

mendeteksi marker ketika aplikasi sedang digunakan.

Tabel 3.6 Usecase skenario Deteksi Marker

Nama Deteksi marker

Aktor Pengguna

Trigger Menampilkan objek 3D

Skenario Utama

Kondisi Awal Kamera terdeteksi dan aplikasi siap

untuk digunakan.


1. Pengguna menunjukkan

marker ke arah kamera

2. Sistem menampilkan objek 3D

Kondisi Akhir Objek muncul sesuai dengan marker

yang digunakan

3.2.4 Activity Diagram

Diagram activity menggambarkan berbagai alir aktivitas dalam sistem yang

dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi

dan bagaimana mereka berakhir. Penggambaran activity diagram memiliki

kemiripan dengan flowchart diagram. Activity diagram memodelkan event-event

yang terjadi pada Use Case dan digunakan untuk pemodelan aspek dinamis dari

sistem.

25

3.2.4.1 Activity Diagram Tentang Aplikasi

Gambar 3.3. Activity Diagram Tentang Aplikasi

Gambar 3.3 Menggambarkan aktivitas ketika pengguna memilih Tentang

Aplikasi. Pengguna menekan tombol Tentang Aplikasi, selanjutnya sistem akan

menampilkan menu tentang Aplikasi. Pada menu Tentang Aplikasi berisikan

informasi ringkas tentang teknologi Augmented reality yang digunakan.

3.2.4.2 Activity Diagram PETA Kampus 3 UMM

Gambar 3.4. Activity Diagram Peta kampus 3 UMM

Gambar 3.4 Menggambarkan aktivitas ketika pengguna memilih PETA

Kampus 3 UMM. Pengguna menekan tombol PETA Kampus 3 UMM, selanjutnya

sistem akan menampilkan menu PETA Kampus 3 UMM. Pada menu PETA

26

Kampus 3 UMM berisikan PETA/Maps Kampus 3 Universitas Muhammadiyah

Malang.

3.2.4.3 Activity Diagram Keluar

Gambar 3.5. Activity Diagram keluar

Gambar 3.5 Menggambarkan aktivitas ketika pengguna memilih menu

Keluar. Pengguna menekan tombol Keluar, selanjutnya aplikasi akan keluar dengan

otomatis.

3.2.4.4 Activity Diagram Deteksi AR

Gambar 3.6. Activity Diagram Deteksi AR

27

Gambar 3.6 Menggambarkan aktivitas yang terjadi pada aplikasi pada saat

deteksi marker. Dimana pada saat menjalankan aplikasi Marker akan dideteksi

sebelum menampilkan informasi tentang bangunan.

3.2.5 Sequence Diagram

Pada sub bab ini penulis akan menjelaskan sistem dalam bentuk penggambaran

Sequnce Diagram. Sequence diagram berbeda dengan diagram sebelum-

sebelumnya yang telah dibahas, pada sequence diagram dimensi vertikal

menjelaskan tentang waktu yang sedang terjadi sedangkan dimensi horizontal

menjelaskan objek yang sedang berhubungan.

3.2.5.1 Sequence Diagram Memilih Menu

Gambar 3.7. Sequence Diagram Memilih Menu

Pada gamabar 3.7 untuk dapat memilih menu pengguna harus memilih aplikasi

UMM AR, kemudian otomatis menampilkan pilihan menu.

28

3.2.5.2 Sequence Diagram Tentang Aplikasi

Gambar 3.8 Sequence Diagram Tentang Aplikasi

Pada gambar 3.8 untuk memilih menu “Tentang Aplikasi” pengguna harus

membuka aplikasi UMM AR,selanjutnya akan muncul menu utama aplikasi, dan

pengguna dapat memilih menu “Tentang Aplikasi”, maka sistem akan

menampilkan halaman “Tentang Aplikasi”.

3.2.5.3 Sequence Diagram PETA Kampus 3 UMM

Gambar 3.9 Sequence Diagram PETA Kampus 3 UMM

29

Pada gambar 3.9 untuk memilih menu “PETA” maka pengguna harus membuka

aplikasi UMM AR, kemudian secara otomatis menampilkan halaman menu utama,

selanjutnya user dapat memilih menu “PETA”, maka sistem akan menampilkan

halaman menu “PETA” .

3.2.5.4 Sequence Diagram Deteksi AR

Gambar 3.10 Sequence Diagram Deteksi AR

Pada gambar 3.10 untuk menampilkan halaman Deteksi AR maka pengguna harus

membuka aplikasi UMM AR, kemudian secara otomatis akan menampilkan

halaman menu utama, dan selajutnya user dapat memilih menu “Deteksi AR”.

Maka secara otomatis sistem akan mengarahkan ke kamera, kemudian kamera

mendeteksi marker setiap bangunan yang dideteksi, setelah marker dideteksi maka

akan menampilkan GUI button yang berisi tentang informasi bangunan tersebut.

3.3 Perancangan Sistem

Perancangan merupakan bagian dari metodologi pembangunan suatu

perangkat lunak yang harus dilakukan setelah melalui tahapan analisis. Untuk dapat

melakukan perancangan sistem maka dilakukan beberapa buah langkah yaitu

sebagai berikut :

30

1. Perancangan Struktur Menu

2. Perancangan Antarmuka

3. Perancangan Method

3.3.1 Perancangan Struktur Menu

Struktur menu adalah bentuk umum dari suatu rancangan aplikasi untuk

memudahkan pengguna dalam menjalankan aplikasi smartphone. Sehingga saat

menjalankan aplikasi, pengguna tidak mengalami kesulitan dalam memilih menu-

menu yang diinginkan. Berikut ini perancangan struktur menu pada aplikasi UMM

AR yang ditunjukan pada gambar berikut ini.

Gambar 3.11 Struktur Menu

3.3.2 Perancangan Antarmuka

Perancangan antarmuka dibutuhkan untuk mawakili keadaan sebenarnya

dari aplikasi yang akan dibangun. Berikut ini contoh perancangan antarmuka yang

ada dari aplikasi yang akan dibangun yaitu :

31

1. Perancangan Antarmuka Halaman Utama

Gambar 3.12 Antarmuka Menu Utama

2. Perancangan Antarmuka Menu Deteksi AR

Gambar 3.13 Antarmuka Menu Deteksi AR

32

3. Perancangan Antarmuka Menu PETA Kampus 3 UMM

Gambar 3.14 Antarmuka Menu PETA Kampus 3 UMM

4. Perancangan Antarmuka Menu Tentang Aplikasi

Gambar 3.15 Antarmuka Menu Tentang Aplikasi

33

3.3.3 Perancangan Method

Perancangan Method merupakan perancangan yang berfungsi untuk

mendeskripsikan Method yang berada di dalam aplikasi UMM AR menggunakan

teknologi augmented reality. Adapun Method yang digunakan dalam aplikasi

yang akan dibangun adalah sebagai berikut :

1. Method Sistem kerja UMM AR

Gambar 3.16 Perancangan Method Sistem kerja Aplikasi UMM AR

34

2. Method Pembuatan Aplikasi

Gambar 3.17 Method Pembuatan Aplikasi

bab iii analisa dan perancangan...

Documents