BAB 3 ANALISIS DAN PERANCANGAN. keinginan pengguna. Hal ini akan membantu mengetahui aplikasi yang sesuai

BAB 3 ANALISIS DAN PERANCANGAN 3.1 Analisis Aplikasi Dalam mengalisis aplikasi yang akan dibuat, terlebih dahulu menganalisis keinginan pengguna. Hal ini akan membantu mengetahui aplikasi yang sesuai dengan keinginan pengguna. Dengan adanya analisis ini akan didapatkan data yang akan digunakan untuk mencari solusi permasalahan yang ada. 3.1.1 Analisis Pengguna Dalam menganalisis aplikasi yang dibuat, dilakukan proses analisis untuk mengetahui kebutuhan pengguna dengan teknik pengambilan data menggunakan kuesioner. Kuesioner disebarkan kepada penghuni Casagoya Park Residence Kebon Jeruk. Dengan total responden sebanyak 30 responden. Berikut adalah hasil dari kuesioner : 1. Apakah jenis sistem operasi smartphone Anda? a) ios (Apple) b) Android (Google) c) Blackberry OS (Blackberry) d) Windows Phone (Windows) 38

39 Gambar 3.1 Diagram Pie Jenis Sistem Operasi Smartphone Responden Berdasarkan data hasil kuesioner yang telah dilakukan, diketahui bahwa ios ada di persentase paling tinggi yaitu 37%, Android pada posisi kedua tertinggi yaitu 30%, Blackberry 20%, dan Windows Phone 13%. Kemudian disimpulkan bahwa pemakain smartphone dengan operating sistem ios paling banyak digunakan. 2. Apakah di rumah Anda memiliki internet? a) Ada b) Belum ada

40 Gambar 3.2 Diagram Pie Kepemilikan Jaringan Internet Berdasarkan data hasil kuesioner yang telah dilakukan, Bahwa sebagian besar responden memiliki jaringan internet pada rumahnya. 3. Status kepemilikan rumah? a) Rumah sendiri b) Sewa Gambar 3.3 Diagram Pie Status Kepemilikan Rumah

41 Berdasarkan data hasil kuesioner yang telah dilakukan, diketahui bahwa semua responden memeliki rumah sendiri. 4. Sesering apa Anda melakukan aktivitas di luar rumah? a) < 5 jam/hari b) 5-10 jam / hari c) > 10 jam / hari Gambar 3.4 Diagram Pie Waktu Kegiatan Responden Diluar Rumah Berdasarkan data hasil kuesioner yang telah dilakukan, diketahui bahwa responden yang aktif diluar rumah pada < 5 jam/hari yaitu 10%, 5-10 jam/hari yaitu 35%, dan > 10 jam/hari yaitu 37%. Maka diambil kesimpulan bahwa rata rata responden aktif berkegiatan di luar rumah.

42 5. Apakah Anda ingin memiliki aplikasi di smartphone yang dapat mengatur rumah Anda? a) Iya b) Tidak Gambar 3.5 Diagram Pie Keinginan Responden Memiliki Aplikasi Yang Dapat Mengatur Rumah Berdasarkan data hasil kuesioner yang telah dilakukan, sebagian besar responden ingin memiliki aplikasi yang dapat mengatur rumah secara mobile.

43 6. Apakah Anda kesulitan dalam mengetahui seberapa besar pengeluaran Anda memakai listrik di setiap ruangan? a) Iya b) Tidak Gambar 3.6 Diagram Pie Kesulitan Responden Dalam Mengetahui Seberapa Besar Litrik Yang Terpakai Berdasarkan data hasil kuesioner yang telah dilakukan, responden yang menjawab iya sebesar 93% dan menjawab tidak hanya 7%. Maka diambil kesimpulan bahwa responden ingin mengetahui pengeluaran dan pemakaian listrik pada rumah.

44 7. Apakah Anda ingin mengetahui biaya (Rupiah) pemakaian listrik yang melalui smartphone Anda? a) Iya b) Tidak Gambar 3.7 Diagram Pie Keinginan Responden Mengetahui Biaya Pemakain Listrik Berdasarkan data hasil kuesioner yang telah dilakukan, diketahui bahwa 97% responden menjawab iya dan 3% responden menjawab tidak, maka disimpulkan bahwa responden ingin mengetahui biaya pemakain listrik pada rumah.

45 8. Apakah Anda menginginkan aplikasi yang dapat mematikan dan menyalakan alat elektronik melalui smartphone Anda? a) Iya b) Tidak Gambar 3.8 Diagram Pie Keinginan Responden Dengan Apliakasi Yang Dapat Mematikan Dan Menyalakan Alat Elektronik Berdasarkan data hasil kuesioner yang telah dilakukan, diketahui bahwa hampir semua responden menjawab ingin memiliki aplikasi yang dapat mematikan alat elektronik melalui smartphone.

46 9. Apakah Anda menginginkan aplikasi yang dapat meredupkah lampu rumah Anda melalui smartphone Anda, agar menghemat pemakaian listrik? a) Iya b) Tidak Gambar 3.9 Diagram Pie Keinginan Responden Meredupkan Alat Elektronik Agar Hemat Listrik Berdasarkan data hasil kuesioner yang telah dilakukan, diketahui bahwa 93% responden menjawab iya dan 7% responden menjawab tidak. Maka dapat disimpulkan bahwa responden ingin memiliki aplikasi yang meredupkan lampu agar dapat menghemat listrik.

47 3.2 Analisis dan Solusi Permasalahan Berdasarkan hasil kuesioner yang peroleh dari responden. Dapat diidentifikasikan masalah-masalah sebagai berikut: 1. Sulitnya mengetahui pemakaian listrik di setiap ruangan pada setiap rumah. 2. Sulitnya mengetahui biaya pemakain listrik di setiap ruangan pada setiap rumah. 3. Mematikan alat elektronik yang masih manual. 4. Sulitnya mengontrol alat elektronik rumah pada saat responden melakukan aktivitas diluar rumah. 5. Lampu yang selalu menyala mengakibatkan keborosan pada pemakaian listrik. Berdasarkan hasil indentifikasi diatas dapat diusulkan pemecahan masalah yang dilakukan sebagai berikut: 1. Membuat aplikasi berbasis mobile yang dapat merekam pemakain listrik di setiap ruangan di satu rumah. 2. Aplikasi tersebut juga dapat memberikan informasi biaya pada setiap ruangan dari satu rumah. 3. Aplikasi ini juga dapat mematikan dan menyalakan alat elektronik yang ada di rumah. 4. Aplikasi ini dapat mengkontrol alat elektronik secara mobile. 5. Aplikasi ini juga dapat meredupkan cahaya lampu agar pemakaian listrik menjadi lebih hemat.

48 3.3 Rancangan Perangkat Keras Perangkat keras pada sistem Smart home ini terdiri atas perangkat utama yaitu mikrokontroler, perangkat ethernet shield, perangkat relay dan perangkat pengukur arus listrik. Adapun perangkat keras yang terhubung yaitu modem, alat elektronik dan smartphone. 3.3.1 Diagram Blok Sistem Gambar 3.10 Gambar Blok Diagram Keseluruhan Sistem Aplikasi Marbot Gambar di atas adalah blok diagram pada Smart home yang terinci sebagai berikut: Perangkat keras yang ada pada perangkat utama yang digunakan di sitem di atas yaitu ada pada perangkat utama yang terdiri dari: a) Mikrokontroler menggunakan Arduino ATmega. b) Perangkat Ethernet Shield.

49 c) Perangkat pengukur alat listrik arduino. d) Perangkat relay. Perangkat-perangkat yang mendukung untuk mensuplai data yang akan dikirim dan diterima adalah: a) Modem untuk mengirim dan menerima data b) Alat elektronik untuk melihat hasil apa yang di perintah User c) Smartphone untuk mengirim data dan menerima data Sistem di atas pada perangkat utama akan aktif dengan bantuan catu daya yang masuk dengan tenggangan AC yang sebelumnya dirubah menjadi teganggan DC. Tegangan yang masuk pada perangkat tersebut sebesar 5 Volt. Smartphone mengirim perintah berupa data melalui web server dengan menggunakan media internet yang kemudian diterima oleh mikrokontroler. Untuk dapat terhubung ke internet mikrokontroler arduino dibekali perangkat berupa ethernet shield, dengan menggunakan ethernet shield ini maka mikrokontroler dapat dipasangkan dengan kabel ethernet yang dihubungkan ke modem untuk terhubung ke internet. Mikrokontroler menerima data dari web server, untuk mengolah perintah yang diberikanya seperti memunculkan pemakaian arus, mematikan atau menyalakan alat elektronik, dan meredupkan cahaya lampu.

50 3.3.2 Cara Kerja Perangkat Di bawah akan dijelaskan cara kerja setiap perangkat dan beberapa penjelasan singkat tentang perangkat. Perangkat utama yang digunakan pada sistem pengontrolan rumah ini menggunakan Mikrokontroler Arduino Mega dikarenakan mudah didapatkan dan mudah penggunaannya untuk sistem ini. 3.3.2.1 Mikrokontroler Atmega2560 Mikrokontroler Atmega2560 yang sering disebut Arduino Mega ini memiliki banyak fitur yang mempermudahkan pengguna dan mudah terintegrasi oleh fitur lain. Mikrokontroler ini juga mudah dicari di pasaran. Dengan beberapa pertimbangan diatas mikrokontroler ini dapat digunakan sebagai pengendali utama pada sistem alat ini. Mikrokontroler Atmega2560 ini bisa berfungsi jika terhubung dengan aliran listrik. Tegangan yang diterima oleh Atmega2560 ini sebesar 5 Volt. Pin reset pada Atmega2560 ini berfungsi mengreset ulang program yang ada di mikro ke initialisasi awal. Perangkat ini memiliki 54 digital input/output di mana 14 digunakan untuk PWM output dan 16 digunakan sebagai analog input. Atmega2560 merupakan mikrokontroler 8 bit berbasis arsitektur RISC (Reduce Instruction Set Computing) dimana set instruksinya dikurangi baik dari segi ukuran maupun kompleksitas mode pengalamatannya. Satu instruksi biasanya berukuran 16 bit dan sebagian besar dieksekusi dalam 1 siklus clock. Masing-masing pin yang terdapat di Atmega2560 ini terhubung dengan perangkat-perangkat lainnya yang akan menjadi

51 sebuah output. Atmega2560 disini akan menerima data dari webserver yang melewati modem sebagai media penerima dan pengirim data. Lalu data tersebut diproses oleh mikrokontroler dan dikirim melalui pin-pin tersebut ke perangkat lainnya. Mikrokontroler Atmega2560 ini juga menerima input dari perangkat-perangkat yang terhubung berupa data yang akan diproses dan dikirim ke web server. Berikut ini adalah konfigurasi pin I/O yang digunakan oleh sistem Smart home : Tabel 3.1 Konfigirasi Pin pada Mikrokontroler Atmega2560 Pin Reset 3.3v 5v GND GND Vin Mikrokontroler Atmega2560 Yang disediakan arduino apabila menghendaki Arduino Board tersebut untuk di reset Keluaran tegangan sebesar 3.3v, yang disediakan board Arduino. Beberapa komponen, perangkat dan shield butuh tegangan 3.3v Tegangan output sebesar 5v (Output) Ground Ground Input sumber tegangan 5-9 Volt. Bisa dikonekkan ke Baterai atau adaptor 2 Perangkat Relay 3 Perangkat Relay

52 4 Perangkat Relay 5 Perangkat Relay 6 Perangkat Relay 7 Perangkat Relay 8 Perangkat Relay 9 Perangkat Relay 15 Perangkat Relay A0 Sensor Arus (digantikan dengan sensor cahaya) 3.3.2.2 E t h e r n e t S A1 A2 Sensor Arus (digantikan dengan sensor cahaya) Sensor Arus (digantikan dengan sensor cahaya) ld h i e Perangkat Ethernet Shield pada sistem ini menggunakan WIZnet W5100 ini juga kompatibel dengan mikrokontroler Atmega2560 (Arduino Mega). Kegunaan ethernet disini adalah untuk menghubungkan mikrokontroler tersebut ke modem yang terhubung dengan internet dimana langsung ke alamat web server. Agar mikrokontroler tersebut bisa mengakses data dari ineternet. Untuk menguhubungkan ethernet shield dengan modem tersebut butuh kabel ethernet standart CAT5 atau CAT6 dengan konektor RJ45. Ethernet Shield agar dapat berkomunikasi dengan mikrokontroler Atmega2560

53 (Arduino Mega) menggunakan bus SPI. Bus ini terwakili pada pin 11, 12, dan 13. Pin 10 untuk mengaktifkan chip W5100. Gambar 3.11 Pemsangan Ethernet Shield WIZnet W5100 ke Mikrokontroler Arduino Mega 3.3.2.3 Perangkat Relay Pada dasarnya cara kerja perangkat relay dapat digunakan sebagai switch berbagai peralatan elektronik, Misalnya lampu listrik, motor listrik, dan berbagai alat elektonik lainnya. Pada sistem ini perangkat relay digunakan untuk pemutusan aliran listrik secara otomatis berdasarkan perintah yang ditentukan oleh nilai output, yang telah diproses mikrokontroler atau perangkat pengontrol. Perangkat relay digunakan untuk mengatur nyala dan matinya alat elektronik. Relay ini terhubung pada pin yang ada di Arduino Mega. Dan perangkat relay ini terhubung juga dengan alat elektronik. Yang termasuk dalam perangkat ini yaitu Kit Relay untuk peralatan listrik AC /DC dan kabel pin dan konektor.

54 Gambar 3.12 Konfigurasi Pemasangan Relay ke Pin di Arduino Mega 3.3.2.4 Perangkat Pengukur Arus Listrik Sensor ini memiliki pembacaan dengan ketepatan yang tinggi, karena di dalamnya terdapat rangkaian low-offset linear Hall dengan satu lintasan yang terbuat dari tembaga. Cara kerja sensor ini adalah arus yang dibaca mengalir melalui kabel tembaga yang lalu direkam oleh IC yang terdapat di sensor arus. Dan mengirimnya melalui pin yang berada pada sensor tersebut. Ada tiga pin yang terhubung dengan mikrokontroler yaitu VCC, GND, OUT. Pada pin OUT yang akan tersambung pada mikrokontroler di analogpin di sana pengukur arus listrik akan memberikan value yang akan diproses oleh mikrokontroler. Pada perancangan ini dikarenakan alat ini belum bisa dipakai maka disini menggunakan sensor cahaya untuk mengambil value dari suatu lampu dan diukur berdasarkan kebesaran cahaya yang diterima oleh sensor cahaya tersebut.

55 Gambar 3.13 Konfigurasi Pemasangan Alat Ukur Arus Listrik 3.4 Rancangan Perangkat Lunak Pada sistem ini penulis menggunakan beberapa program untuk membangun sitem tersebut. Pada pemograman untuk mikrokontroler menggunakan framework Arduino yang sudah disediakan. Program tersebut yaitu arduino1.0.3, di program ini menggunakan bahasa C. Program untuk mobile application menggunakan software Titanium, software tersebut menyediakan multi platform. Dalam software Titanium tersebut menggunakan bahasa Javascript. Dan untuk webserver menggunakan bahasa pemograman php untuk terkoneksi ke database dikarenakan bahasa yang lebih universal. Database sendiri menggunakan mysql agar lebih mudah dan lebih efisien.

56 3.4.1 Diagram Alur pada Smartphone Gambar 3.14 Diagram Alur pada Smartphone

57 3.4.2 Diagram Alur dari Smartphone ke Web Gambar 3.15 Diagram Alur dari Smartphone ke Web

58 3.4.3 Diagram Alur dari Mikrokontroler ke Web Gambar 3.16 Diagram Alur dari Mikrokontroler ke Web

59 3.4.4 Diagram Alur pada Mikrokontroler Gambar 3.17 Diagram Alur pada Mikrokontroler

60 3.4.5 UML (Unified Modelling Language) Secara umum perancangan sistem berorientasi objek yang baik dapat dilakukan dengan menggunakan Unified Modelling Language (UML). Analisa berorientasi objek dapat dilakukan dengan langkah langkah sebagai berikut : 1. Use Cases Diagram 2. Activity Diagram 3. Sequence Diagram 4. Class Diagram 3.4.5.1 Use Cases Diagram Gambar 3.18 Use Case diagram pada User

61 Gambar 3.19 Use Case Diagram pada Admin Tabel 3.2 Use Case Diagram Open Interface Login pada User Use Case Open Interface Login Actors User Purpose Use case ini menjelaskan tahapan saat aktor ingin membuka aplikasi dan melihat tampilan login

62 Overview Aktor membuka aplikasi. Sistem menampilkan halaman login. Tabel 3.3 Use Case Diagram Login pada User Use Case Login Actors User Purpose Use case ini menjelaskan tahapan saat aktor yang sudah terdaftar sebagai User, ingin melakukan proses login. Overview Aktor membuka aplikasi Marbot. Sistem menampilkan halaman login. Aktor mengisi Username dan password dan kemudian menekan tombol Log in. Sistem memvalidasi Username dan password. Jika Username dan password benar maka sistem menampilkan halaman Menu. Jika Username dan password salah maka sistem akan menampilkan pesan kesalahan.

63 Tabel 3.4 Use Case Diagram Open Interface Menu pada User Use Case Open Interface Menu Actors User Purpose Use case ini menjelaskan tahapan saat aktor telah login dan ingin melihat menu pada aplikasi Marbot. Overview Aktor membuka halaman Menu Utama. Sistem menampilkan halaman menu utama, dimana terdapat menu list alat elektronik, menu group, menu record arus listrik, dan tombol logout. Tabel 3.5 Use Case Diagram Choose List Menu pada User Use Case Choose List Electronic Actors User Purpose Use case ini menjelaskan tahapan saat aktor memilih menu list. Overview Aktor membuka halaman Menu Utama. Sistem menampilkan halaman menu utama, dimana terdapat menu list alat elektronik, menu group, menu record arus listrik, dan tombol

64 logout. Aktor memilih menu list alat elektronik. Sistem menampilkan list alat elektronik. Tabel 3.6 Use Case Diagram Choose Group pada User Use Case Choose Group Actors User Purpose Use case ini menjelaskan tahapan saat aktor memilih menu group. Overview Aktor membuka halaman Menu Utama. Sistem menampilkan halaman menu utama, dimana terdapat menu list alat elektronik, menu group, menu record arus listrik, dan tombol logout. Aktor memilih menu group. Sistem menampilkan beberapa group yang tersedia. Tabel 3.7 Use Case Diagram Choose Record Electric Current Menu pada User Use Case Choose Record Electric Current Menu Actors User Purpose Use case ini menjelaskan tahapan saat aktor memilih dan melihat record arus yang

65 terekam pada rumah. Overview Aktor membuka halaman Menu Utama. Sistem menampilkan halaman menu utama, dimana terdapat menul list alat elektronik, menu group, menu record arus listrik, dan tombol logout. Aktor memilih menu record arus listrik. Sistem menampilkan record arus listrik dan harga perbulan pada rumah. Tabel 3.8 Use Case Diagram Logout pada User Use Case Logout Actors User Purpose Use case ini menjelaskan tahapan saat aktor ingin keluar dari aplikasi Marbot. Overview Aktor membuka halaman Menu Utama. Sistem menampilkan halaman menu utama, dimana terdapat menu list alat elektronik, menu group, menu Record arus listrik, dan tombol logout. Aktor memilih tombol logout untuk keluar dari aplikasi. Sistem keluar dan kembali kehalaman login.

66 Tabel 3.9 Use Case Diagram Choose Room 1 pada User Use Case Choose Room 1 Actors User Purpose Use case ini menjelaskan tahapan saat aktor memilih group bedasarkan ruangan 1. Overview Sistem menampilkan list alat elektronik dan menampilkan group berdasarkan ruangan. Aktor menekan tombol group ruangan 1. Sistem menampilkan alat elektronik yang ada di ruangan 1. Tabel 3.10 Use Case Diagram Choose Room 2 pada User Use Case Choose Room 2 Actors User Purpose Use case ini menjelaskan tahapan saat aktor memilih group bedasarkan ruangan 2. Overview Sistem menampilkan list alat elektronik dan menampilkan group berdasarkan ruangan. Aktor menekan tombol group ruangan 2. Sistem menampilkan alat elektronik yang ada di ruangan 2.

67 Tabel 3.11 Use Case Diagram Choose Room 3 pada User Use Case Choose Room 3 Actors User Purpose Use case ini menjelaskan tahapan saat aktor memilih group bedasarkan ruangan 3. Overview Sistem menampilkan list alat elektronik dan menampilkan group berdasarkan ruangan. Aktor menekan tombol group ruangan 3. Sistem menampilkan alat elektronik yang ada di ruangan 3. Tabel 3.12 Use Case Diagram Push ON/OFF pada User Use Case Push ON/OFF Actors User Purpose Use case ini menjelaskan tahapan saat aktor ingin memgatur nyala dan mati alat elektronik. Overview Sistem menampilkan list alat elektronik. Aktor menekan tombol ON/OFF. Sistem mengirim value, apakah alat harus mati atau tidak.

68 Tabel 3.13 Use Case Diagram Brightness Light pada User Use Case Brightness Light Actors User Purpose Use case ini menjelaskan tahapan saat aktor ingin memgatur redup dan terang lampu Overview Sistem menampilkan list alat elektronik. Aktor menekan tombol redup atau terang. Sistem mengirim value, apakah lampu harus redup atau terang. Tabel 3.14 Use Case Diagram Open Interface Login pada Admin Use Case Open Interface Login Actors Admin Purpose Use case ini menjelaskan tahapan saat aktor membuka aplikasi dan melihat tampilan login Overview Aktor membuka halaman untuk admin. Sistem menampilkan halaman login.

69 Tabel 3.15 Use Case Diagram Login pada Admin Use Case Login Actors Admin Purpose Use case ini menjelaskan tahapan saat aktor sebagai admin, ingin melakukan proses login. Overview Aktor membuka halaman admin. Sistem menampilkan halaman login. Aktor mengisi Username dan password dan kemudian menekan tombol Log in. Sistem memvalidasi Username dan password. Jika Username dan password benar maka sistem menampilkan halaman View Data User. Jika Username dan password salah maka sistem akan menampilkan pesan kesalahan. Tabel 3.16 Use Case Diagram View Data User pada Admin Use Case View Data User Actors Admin Purpose Use case ini menjelaskan tahapan dimana aktor bisa melihat semua data User.

70 Overview Aktor membuka halaman admin. Sistem menampilkan halaman dimana semua data User terihat dihalaman tersebut dan bebrapa tombol yaitu Add, Edit, Delete, Logout. Tabel 3.17 Use Case Diagram Add Data User pada Admin Use Case Add Data User Actors Admin Purpose Use case ini menjelaskan tahapan dimana aktor bisa menambahkan data User ke database. Overview Aktor membuka halaman admin. Sistem menampilkan halaman dimana semua data User terihat dihalaman tersebut dan bebrapa tombol yaitu Add, Edit, Delete, Logout. Aktor menekan tombol Add. Sistem menampilkan halaman register. Aktor mengisi semua yang diminta oleh sistem lalu menekan tombol Submit. Sistem menerima dan menyimpan data tersebut kedalam database.

71 Tabel 3.18 Use Case Diagram Edit Data User pada Admin Use Case Edit Data User Actors Admin Purpose Use case ini menjelaskan tahapan dimana aktor bisa melihat semua data User. Overview Aktor membuka halaman admin. Sistem menampilkan halaman dimana semua data User terihat dihalaman tersebut dan bebrapa tombol yaitu Add, Edit, Delete, Logout. Aktor menekan tombol Edit. Sistem menampilkan halaman edit. Aktor mengubah data User yang lama sesuai dengan data User yang baru jika sudah maka aktor akan menekan tombol Submit. Sistem akan mengubah data yang lama menjadi data yang baru ke dalama database. Tabel 3.19 Use Case Diagram Detele Data User pada Admin Use Case Delete Data User Actors Admin Purpose Use case ini menjelaskan tahapan dimana aktor

72 bisa menghapus data User. Overview Aktor membuka halaman admin. Sistem menampilkan halaman dimana semua data User terihat dihalaman tersebut dan bebrapa tombol yaitu Add, Edit, Delete, Logout. Aktor menekan tombol Delete. Sistem menghapus data User tersebut. Tabel 3.20 Use Case Diagram Logout pada Admin Use Case Logout Actors Admin Purpose Use case ini menjelaskan tahapan dimana aktor bisa keluar dari sistem dan kembali ke halaman login. Overview Aktor membuka halaman admin. Sistem menampilkan halaman dimana semua data User terihat dihalaman tersebut dan bebrapa tombol yaitu Add, Edit, Delete, Logout. Aktor menekan tombol Logout. Sistem keluar dan menampilkan halaman login.

73 3.4.5.2 Activity Diagram 3.4.5.2.1 Activity Diagram Open Interface Login Pada User Gambar 3.20 Activity Diagram Open Interface Login pada User

74 3.4.5.2.2 Activity Diagram Open Interface Menu Pada User Gambar 3.21 Activity Diagram Open Interface Menu pada User

75 3.4.5.2.3 Activity Diagram Open Interface Login pada Admin Gambar 3.22 Activity Diagram Open Interface Login pada Admin

76 3.4.5.2.4 Activity Diagram Open Interface Login pada Admin Gambar 3.23 Activity Diagram View Data User pada Admin

77 3.4.5.3 Class Diagram Gambar 3.24 Class Diagram Pada Perancangan Sitem Marbot

78 3.4.5.4 Sequence Diagram 3.4.5.4.1 Sequence Diagram Login pada User Gambar 3.25 Sequence Diagram Login pada User

79 3.4.5.4.2 Sequence Diagram Main Menu pada User Gambar 3.26 Sequence Diagram Main Menu pada User

80 3.4.5.4.3 Sequence Diagram Login pada Admin Gambar 3.27 Sequence Diagram Login pada Admin

81 3.4.5.4.4 Sequence Diagram View Data User pada Admin Gambar 3.28 Sequence Diagram View Data User pada Admin

82 3.4.6 Rancangan Tabel Nama Tabel : MsUser Keterangan : Tabel ini berisikan tentang data User yang telah ter registrasi Primary Key : id Tabel 3.21 Tabel data User Field Type Null Extra id int(11) No auto_increment username varchar(255) No password varchar(32) No name varchar(255) No address varchar(100) No Nama Tabel : MsElectronic Keterangan : Tabel ini berisikan tentang nama nama elektronik yang terpasang pada mikrokontroler dan isi value yang menentukan mati dan nyala alat elektonik tersebut. Primary Key : PinNumber

83 Tabel 3.22 Tabel Elektronik Field Type Null Extra PinNumber int(11) No auto-increment username varchar(100) No namelectronic int(11) Yes validelectronic varchar(100) No groupelectronic varchar(100) Yes valuelamp varchar(100) Yes harga int(11) Yes Nama Tabel : MsRecord Keterangan : Tabel ini berisikan tentang data yang arus listrik yang terekam dan diisikan berdarsarkan hari yang dimana akan di total kebesarannya. Primary Key : id

84 Tabel 3.23 Tabel record arus listrik Field Type Null Extra id int(11) No auto_increment tanggal date No totalamp int(11) No totalharga int(11) No

85 3.4.7 Perancangan Layar 3.4.7.1 Perancangan Layar Login Gambar 3.32 Rancangan layar login pada aplikasi Marbot Pada rancangan layar login ini terdapat form untuk mengisi Username dan password. Pada page ini yang menggunakan ialah User yang sudah terdaftar. Jika terdapat kesalahan maka akan keluar pesan kesalahan berupa alert yang muncul.

86 3.4.7.2 Rancangan Layar Main Menu Logout Gambar 3.33 Rancangan layar menu utama pada aplikasi Marbot Pada rancangan layar pada Main Menu ini menampilkan pilihan button untuk User yang berhasil login. Dan menampilkan siapa sekarang yang sedang memakai aplikasi ini. lalu ada juga pilihan jika User ingin logout pada pilihan menu diatas.

87 3.4.7.3 Rancangan Layar List Menu Gambar 3.34 Rancangan layar daftar alat elektronik pada aplikasi Marbot Pada rancangan layar List Menu ini terdapat tampilan beberapa alat elektronik yang berada di rumah yang terhubung dengan mikrokontroler. Di halaman ini terdapat toggle yang berfungsi untuk menyalakan atau mematikan alat elektronik dan dapat mengatur terang dan redupnya lampu. Lalu terdapat juga tombol back untuk kembali ke halaman sebelumnya.

88 3.4.7.4 Rancangan Layar Group Gambar 3.35 Rancangan layar group pada aplikasi Marbot Pada rancangan layar View Group terdapat tampilan beberapa group yang dapat dipilih, dimana nama group tersebut berdasarkan ruangan yang ada pada rumah. Jika memilih salah satu ruang yang ada tersebut maka akan ada tampilan alat elektronik yang terdapat di dalam ruangan.

89 3.4.7.5 Rancangan Layar Record Arus Listrik Gambar 3.36 Rancangan record arus pada aplikasi Marbot Pada rancangan layar di menu Record current electric terdapat tampilan layar yang menunjukan berapa pemakaian listrik di setiap ruangan yang ada dan harga (Rupiah) di setiap ruangan yang di total per hari, per minggu, dan per bulan.