PALANGKA RAYA BERBASIS WEB 2.0“ sebagai Tugas Akhir ini.
1.2. Rumusan Masalah
Berdasarkan latar belakang di atas, maka perumusan masalah yang dibahas
adalah sebagai berikut.
1. Bagaimana merancang dan membangun teknologi SMS Gateway untuk Gereja Masehi Advent Hari Ketujuh (GMAHK) Palangka Raya?
2. Bagaimana merancang dan membangun
Website Gereja Masehi Advent Hari
Ketujuh (GMAHK) Palangka Raya dengan penerapan Web 2.0?
1.3. Metodologi
Metode yang digunakan dalam ”Implementasi SMS Gateway Pada Website Gereja Masehi Advent Hari Ketujuh (GMAHK) Palangka Raya Berbasis Web 2.0” ini adalah metodologi UML-based Web Engineering (UWE) dimana merupakan
pendekatan metodologis untuk pengembangan aplikasi web yang berdasarkan pada Unified Process. Pada metodologi ini akan digunakan 4 tahapan, yaitu Use Case Model, Conceptual Model,
Navigation Model, dan Presentation Model.
Gambar 1 berikut memperlihatkan tahapan dari metodologi UWE.
Gambar 1. Metodologi uml-based web
engineering
Sumber : Rekayasa Web, Simarmata Janner 1. Use Case Model
- Dilakukan dahulu definisi Aktor dan
Definisi Use case, sesudah itu Use
case digram yang menggambarkan
fungsi-fungsi didalam Web.
- Selanjutnya Activity diagram yang
digunakan untuk mengambarkan aliran kerja (Workflow) didalam
Web.
2. Conceptual Model
- Membuat konten Web berdasarkan
kegiatan aktor (use case), pertama-tama Class diagram untuk mengambarkan struktur Web,
hubungan kegiatan aktor dan
database.
- State Chart diagram untuk
mengambarkan interaksi dan sifat
Web.
3. Navigation Model
- Mendesain alur Navigasi didalam Web.
- Mencegah disorientasi didalam Web.
4. Presentation Model
- Representasi struktur web kedalam
- Desain Halaman Web 1.4. Tinjauan Pustaka 1. SMS Gateway
SMS Gateway adalah merupakan komunikasi dua arah, mengirim dan menerima, dengan tarif normal yang telah ditentukan oleh operator seluler (Agus Saputra, 2011). Anda dapat menyebarkan pesan ke banyak nomor secara otomatis dan cepat yang langsung terhubung dengan
database nomor-nomor ponsel saja tanpa
harus mengetik ratusan nomor dan pesan diponsel anda, karena semua nomor akan diambil secara otomatis dari database
tersebut(Tarigan, 2012).
Kelebihan SMS Gateway adalah SMS
Gateway merupakan aplikasi berbasis komputer sehingga dapat di otomatisasi. Selain itu dapat menyimpan data dalam jumlah yang banyak karena disimpan di sebuah harddisk server. Dengan menggunakan program tambahan yang dapat diubah sendiri, pengirim pesan dapat lebih fleksibel dalam mengirim berita karena biasanya pesan yang ingin dikirim berbeda untuk masing-masing penerimanya.
Sedangkan untuk kelemahan dari SMS
Gateway, yaitu terbatasnya jenis dan
kapasitas data yang dikirim maupun yang diterima. Misalnya sebagai contoh, data yang akan dikirim dengan cara dibagi menjadi beberapa bagian sesuai dengan kapasitas maksimal per SMS. Dengan begitu maka pengiriman SMS akan sedikit memakan waktu daripada pengiriman SMS dengan kapasitas normal.
2. Web 2.0
(Wardhana, 2010). Web 2.0 adalah web yang dikembangkan atau didesain memfasilitasi berbagai informasi interaktif, kolaborasi dan juga kegiatan prosumer (kemampuan konsumen untuk menjadi produsen) dalam World Wide Web. Dan Web 2.0. Istilah ini dipakai untuk
menggambarkan aplikasi-aplikasi Internet generasi baru yang merevolusi cara kita menggunakan Internet. Semua aplikasi ini membawa kita masuk ke babak baru penggunaan Internet yang berbeda dengan generasi sebelumnya pada pertengahan tahun 1990-an. What is Web 2.0 karangan Tim O’Reilly menjabarkan arti dan ciri-ciri
web 2.0 tersebut. Ciri -ciri Web 2.0
diantaranya : The Web as Platform,
Harnessing Collective Intelligence, Data is the Next Intel Inside, End of the Software Release Cycle, Lightweight Programming Models, Software Above the Level of a Single Device dan Rich User Experiences.
.
2. Pembahasan
Dalam UML-based Web Engineering
(UWE) memerlukan beberapa tahapan, yaitu
Use case model, Content model, Navigation model dan Presentation model. Namun
sebelumnya, untuk memudahkan dalam memahami alur kerja sistem, berikut ditampilkan bisnis proses dari aplikasi
website oleh Gambar 2 di bawah ini.
Gambar 2. Bisnis proses pada website dan bisnis proses aplikasi SMS Gateway Gereja Masehi Advent Hari Ketujuh (GMAHK) Palangka Raya ditampilkan oleh gambar 3 dibawah ini.
Gambar 3. Bisnis proses pada sms gateway
1. Use Case Model
Sebuah Use case model diperlukan untuk melakukan requirements analysis dengan menganalisis fungsional dari suatu aplikasi web dan di representasikan dalam bentuk diagram yaitu menggunakan Use
case diagram dan activity diagram, namun
sebelum membuat diagram tersebut, terlebih dahulu dilakukan tahap deskripsi definisi aktor dan Use case pada website Gereja Masehi Advent Hari Ketujuh (GMAHK) dan pada SMS Gateway. Adapun Aktor pada sistem ini ada 3 yaitu, Admin, Member dan Pengunjung. Gambar 4 dibawah ini adalah salah satu aktor pada Website.
Login Mengelola Profil Mengelola Struktur Mengelola Data Pegawai Mengelola Berita Mengelola Komentar <<include>> Mengelola Anggota Admin <<include>> <<include>> << includ e>>
<<include>>
<<inc lude>> Mengelola Kategori Mengelola Album Foto Mengelola Foto Mengelola Download Mengelola Link Mengelola Buku Tamu <<include>> <<include>> <<includ e>> <<includ e>> <<in clude>> <<inc lude>> Mengakses Chat Room
<<include>>
Gambar 4. Use case diagram admin pada
website
Dan gambar 5 dibawah ini adalah salah satu aktor pada SMS Gateway.
Login Mengelola Data Member Mengelola Input SMS Group <<include>> Admin <<inc lude>> Mengelola Groups Mengelola Input SMS Autoreply Mengelola Input SMS Terjadwal <<inc lude>> <<includ e>> <<include>> Mengelola Inbox Mengelola Outbox Mengelola History SMS
<<include>> <<include>>
<<include >>
Gambar 5. Use case diagram admin pada
sms gateway
Activity Diagram
Berfungsi untuk memodelkan alur kerja (workflow) sebuah proses bisnis dan urutan aktifitas dalam suatu proses.
2. Conceptual Model
Langkah kedua dari UML-based Web
Engineering (UWE) adalah Conceptual Model yang menggambarkan konten beserta
basis data di dalam Teknologi Website dan
SMS Gateway tersebut, dalam hal ini terdiri
dari Class Diagram, dan State Chart
Diagram.
Class Diagram
Dalam class diagram terdapat beberapa class dan tabel yang menampung
database dari Website GMAHK dapat
dilihat pada Gambar 6 berikut.
+membukaKoneksi() +eksekusiQuerySelect() +eksekusiQueryUpdate() +eksekusiQueryDelete() +tutupKoneksi() KoneksiBasisData +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPe nyewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Main +validasiLogin() +logout() login 1 1 1 1 1 1 1 1 1 1..* 1 1..* 1 1..* 1 1..* 1 1..* 1 1 1 1..* 1 1 1 1 +username varchar(50) pk +nohp varchar(50) +password varchar(100) +nama_lengkap varchar(100) +level varchar(50) +status enum(‘L,’P’) +id_pegawai int(10) pk +nama varchar(50) +jk enum(‘l’,’p’) +alamat varchar(50) +no_tlp varchar(20) +ttl varchar(30) +jabatan varchar(30) +gambar varchar(100) +uiLogin() +uiMengelolaProfil() +uiMengelolaStruktur() +uiMengelolaPegawai() +uiMengelolaBerita() +uiMengelolaKomentar() +uiMengelolaKategori() +uiMengelolaAlbum() +uiMengelolaGallery() +uiMengelolaDownload() +uiMengelolaLink() +uiMengelolaBukuTamu() +uiMengelolaAnggota() +uiMengaksesChat() +id_profil int(11) pk +judul varchar(50) +isi_profil text +gambar_profil varchar(100) +id_kategori int(5) pk +nama_kategori varchar(50) +aktif enum(‘Y’,’N’) +id_album int(5) pk +jdl_album varchar(100) +gbr_album varchar(100) +aktif enum(‘Y’,’N’) +id_berita int(5) pk +id_kategori int(5) fk +judul varchar(100) +isi_berita text +hari varchar (20) +tanggal date +jam time +gambar varchar(100) +dibaca int(5) +username varchar(50) +id int(10) pk +from varchar(255) +to varchar(255) +message text +sent datetime +recd int(10) 1 1 +id_download int(5) pk +judul varchar(100) +nama_file varchar(100) +tgl_posting date +id_bukutamu int(11) pk +nama varchar(15) +nohp varchar(35) +isi_bukutamu text +hari varchar(20) +tanggal date +jam time +re_id_bukutamu int(225) +id_link int(5) pk +nm_link varchar(75) +anchor varchar(75) 1 1..* +id_gallery int(5) pk +id_album int(5) fk +jdl_gallery varchar(100) +keterangan text +gbr_gallery varchar(100) +username varchar(50) 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1..* +id_komentar int(5) pk +id_berita int(5) fk +nama_komentar varchar(100) +url varchar(100) +isi_komentar text +tgl date +jam_komentar time +aktif enum(‘Y’,’N’) +re_id_komentar int(100) 1 1 1 1 +id_struktur int(5) pk +judul varchar(100) +gambar varchar(100) 1 1 1 1..* 1 1..* 1 1..* 1 1..* 1 1..* 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1..* 1 1..* Tbuku_tamu Tpegawai Tprofil Tchat Tanggota Tkategori Tberita Tkomentar
Tstruktur Tlinkx Tdownload
Talbum Tgallery 1 1 1 1..*
Gambar 6. Class diagram website GMAHK Serta tabel dan class untuk SMS Gateway GMAHK dapat dilihat pada gambar 7 berikut.
+membukaKoneksi() +eksekusiQuerySelect() +eksekusiQueryUpdate() +eksekusiQueryDelete() +tutupKoneksi() KoneksiBasisData +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPe nyewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Main +validasiLogin() +logout() login +uiLogin() +uiMengelolaMember() +uiMengelolaGroups() +uiMengelolaAutoreply() +uiMengelolaTerjadwal() +uiMengelolaInbox() +uiMengelolaOutbox() +uiMengelolaHistory() 1 1 +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPeny ewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Tuser +username varchar(50) pk +pass varchar(50) +nama_lengkap varchar(100) +email varchar(100) +no_telp varchar(20) +level varchar(20) +blokir enum(‘Y’,’N’) +id_session varchar(100) +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHa rgaPenyewaanTenda() +uiMengelolaBukuTa mu() +uiMengelolaAdmin() Tpbk +GroupID int(11) pk +Name text +Number text +setGroupID() +setName() +setNumber() +getGroupID() +getName() +getNumber() +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPenyewaa nTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Toutbox +UpdateinDB timestamp +InsertintoDB timestamp +SendingDateTime timestamp +Text text +DestinationNumber varchar(20) +Coding enum(‘Default_No_Compression’,’ Unicode_Bo_Compression’,’8bit’,’ Default_Compression’,’Unicode_C ompression’) +UDH text +Class int(11) +TextDecoded varchar(160) +ID int(10) +MultiPart enum(‘false’,’true’) +RelativeValidity int(11) +SenderID varchar(255) +SendingTimeOut timestamp +DeliveryReport enum(‘default’,’yes’,’no’) +creatorID text +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPeny ewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Toutbox_multipart +Text text +Coding enum(‘Default_No_Compres sion’,’Unicode_Bo_Compress ion’,’8bit’,’Default_Compress ion’,’Unicode_Compression’) +UDH text +Class int(11) +TextDecoded varchar(160) +ID int(10) +SequencePosition int(11) +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPeny ewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Toutbox_temp +UpdateInDB timestamp +DestinationNumber varchar(20) +TextDecoded varchar(160) +ID int(10) +CreatorID text +idgroup int(11) pk +ucapan varchar(160) +jam time +status enum(‘Y’,’N’) +id int(11) pk +format varchar(30) +isi text +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPeny ewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Tinbox +UpdateInDB timestamp +ReceivingDateTime timestamp +Text text +SenderNumber varchar(20) +Coding enum(‘Default_No_Compres sion’,’Unicode_Bo_Compress ion’,’8bit’,’Default_Compress ion’,’Unicode_Compression’) +UDH text +SMSCNumber varchar(20) +Class int(11) +TextDecoded varchar(160) +ID int(10) +RecipientID text +Processed enum(‘false’,’true’) +Start text +Into text Tdaemons +Name text +ID int(11) Tpbk_groups +setName() +setID() +getName() +getID() +noHP varchar(30) pk +tglKirim date Tkirim_ulangtahun +id int(11) +hp varchar(25) Ttelponexcel +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPenyewaa nTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Tsentitems +UpdateinDB timestamp +insertintoDB timestamp +SendingDateTime timestamp +DeliveryDateTime timestamp +Text text +DestinationNumber varchar(20) +Coding enum(‘Default_No_Compression’,’ Unicode_Bo_Compression’,’8bit’,’ Default_Compression’,’Unicode_C ompression’) +UDH text +SMSCNumber varchar(20) +Class int(11) +TextDecoded varchar(160) +ID int(10) +SenderID varchar(255) +SequencePosition int(11) +Status enum(‘SendingOK’,’SendingOKNo Report’,’SendingError’,’DeliveryOK ’,’DeliveryFailed’,’DeliveryPending’ ,’DeliveryUnknown’,’Error’) +StatusError int(11) +TPMR int(11) +RelativeValidity int(11) +CreatorID text +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPeny ewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Tmember +id int(11) pk +groupid varchar(15) +fullname varchar(50) +nohp varchar(20) +alamat varchar(100) +birthdate date +keterangan varchar(160) +jekel varchar(25) +tgl_bergabung date +aktif enum(‘Y’,’N’) +Version int(11) Tgammu +setVersion() +getVersion() 1 1 1 1 1 1..* 1 1..* 1 1 +uiLogin() +uiMengelolaProfil() +uiMengelolaBerita() +uiMengelolaGallery() +uiDownloadDaftarHargaPeny ewaanTenda() +uiMengelolaBukuTamu() +uiMengelolaAdmin() Tphones +ID text +UpdateInDB timestamp +InsertIntoDB timestamp +TimeOut timestamp +Send enum(‘yes’,’no’) +Receive enum(‘yes’,’no’) +IMEI varchar(35) +Client text +Battery int(11) +Signal int(11) +Sent int(11) +Received int(11) 1 1 1 1 1 1 1 1..* 1 1..* 1 1..* 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1..* 1 1..* 1 1..* 1 1..* 1 1..* Tautoreply Tulangtahun 1 1..* 1 1..* 1 1..* 1 1 1 1 1 1..* 1 1..*
Gambar 7. Class diagram sms gateway GMAHK
State Chart Diagram
Statechart diagram menggambarkan
transisi dan perubahan keadaan (dari satu
state ke state lainnya) suatu objek pada
sistem sebagai akibat dari stimuli yang diterima. Transisi antar state umumnya memiliki kondisi guard yang merupakan syarat terjadinya transisi yang bersangkutan, dituliskan dalam kurung siku.
3. Navigation Model
Navigation model dalam hal ini
menjelaskan tentang navigasi dari sistem tersebut. Dalam hal ini terdapat navigasi
Admin pada Website GMAHK, navigasi Admin pada SMS Gateway GMAHK,
navigasi Member, dan navigasi Pengunjung. Gambar 8 berikut menggambar salah satu navigasi yaitu, navigasi pengunjung.
<<navigation>> Homepage <<navigation>> Berita <<navigation>> Struktur Global <<navigation>> Pegawai Jemaat <<navigation>> Download <<navigation>> Gallery <<navigation>>
Home <<navigation>>Profil
<<Navigation link>> <<Navigation link>>
<<Navigation link>> <<Navigation link>>
<<Navigation link>> <<Navigation link>> <<Navigation link>>
<<Navigation link>> <<Navigation link>> <<Navigation link>> <<Navigation link>> <<Navigation link>>
<<Navigation link>> <<Navigation link>> <<Navigation link>> < < N a vig a ti on l in k> > <<navigation>> Member Area <<navigation>> Link < < N av ig a ti on lin k> > <<Navigation link>> <<Navigation link>> << N a v ig a tio n l in k > > < < N a vig ati o n l in k >>
<<Navigation link>> <<Navigation link>>
< < N a vig a ti on l in k> > << N a vig ati o n l in k >> < < N a vig ati o n l in k >> < < N a vig ati o n l in k >> < < N av ig a ti on lin k> > <<navigation>> Buku Tamu < <N a v ig a tio n lin k > > < <N a v ig a tio n lin k > > <<Navigation link>> <<Navigation link>>
Gambar 8. Navigation model pengunjung
4. Presentation Model
Presentation model menggambarkan
desain sistem yang akan di buat, terdiri dari
desain presentasi dan desain halaman sistem untuk Admin, Member dan Pengunjung.
Implementasi
Setelah tahap analisis, perancangan dan proses pengerjaan coding selesai, maka dilakukan tahap selanjutnya yaitu tahap implementasi. Tahap implementasi merupakan tahapan yang berfungsi untuk membuktikan bahwa program “Implementasi SMS Gateway pada Website Gereja Masehi Advent Hari Ketujuh (GMAHK) Palangka Raya bebasis web 2.0” yang dibuat telah berfungsi dengan baik.
Pada bab ini akan dijelaskan tahap implementasi antarmuka dari program seperti implementasi antarmuka Admin,
Member dan Pengunjung. Untuk tahap uji
coba dilakukan dengan pengujian Blackbox yang di dalamnya termasuk User Testing
dan Browser Testing.
Gambar 9 berikut merupakan halaman
Home Admin pada Website GMAHK.
Gambar 9. Tampilan halaman home admin pada website GMAHK
Gambar 10 berikut merupakan halaman
Home Admin pada SMS Gateway GMAHK.
Gambar 10. Tampilan halaman home admin pada sms gateway GMAHK
Gambar 11 berikut merupakan halaman
Gambar 11. Tampilan halaman home
member pada website GMAHK Pengujian SMS
Gambar 12 di bawah ini memperlihatkan salah satu SMS yang dilakukan oleh Member dan balasan dari sistem.
Gambar 12. SMS registrasi member dan balasan sistem
Gambar 13 berikut ini memperlihatkan
SMS yang dilakukan oleh Non Member yang
ingin memperoleh informasi dan balasan dari sistem.
Gambar 13. SMS dengan format non
member dan balasan sistem
Gambar 14 berikut ini memperlihatkan alur SMS yang dilakukan oleh Admin dan sistem untuk SMS Approve Admin.
Gambar 14. Alur sms approve admin dan balasan sistem
3. Kesimpulan
Teknologi SMS Gateway pada Website Gereja Masehi Advent Hari Ketujuh (GMAHK) Palangka Raya ini dirancang dan dibangun untuk Gereja Masehi Advent Hari Ketujuh (GMAHK) Palangka Raya dengan menggunakan metodologi UML-based Web
Engineering (UWE) dengan 4 (empat)
tahapan, yaitu Use case model, Content
model, Navigation model dan Presentation model. Untuk tahap uji coba dengan
menggunakan Blackbox testing. Dan untuk
software SMS Gateway menggunakan
Gammu.
Website Gereja Masehi Advent Hari
Ketujuh (GMAHK) Palangka Raya berbasis