BAB III ANALISIS DAN PERANCANGAN. Analisis bertujuan untuk mengidentifikasi permasalahan-permasalahan yang

(1)

58 BAB III

ANALISIS DAN PERANCANGAN

3.1 Analisis

Analisis bertujuan untuk mengidentifikasi permasalahan-permasalahan yang terdapat pada sistem serta menentukan kebutuhan-kebutuhan dari sistem yang dibangun. Analisis tersebut meliputi analisis masalah, analisis sistem operasi, analisis pengguna di Jurusan Teknik Informatika UIN Sunan Gunung Djati Bandung, dan analisis fitur yang dibutuhkan, & analisis sistem.

3.1.1 Analisis Masalah

Pengumuman kampus merupakan informasi yang sangat diperlukan bagi mahasiswa, saat ini di Jurusan Teknik Informatika UIN Sunan Gunung Djati Bandung ada dua jenis pengumuman yang sering digunakan untuk menyampaikan

informasi kepada mahasiswa. Yang pertama melalui website dan yang kedua melalui

papan pengumuman. Untuk mengakses informasi yang yang disampaikan melalui

website jurusan hanya dapat diakses dengan menggunakan browser baik desktop browser maupun mobile browser. Dan untuk informasi yang disampaikan melalui papan pengumuman mahasiswa harus datang ketempat papan pengumuman untuk melihat informasi terbaru dari jurusan. Dari sisi yang memberikan pengumuman baik

(2)

59

dosen maupun pihak jurusan masih menggunakan kertas yang di-printout maupun

ditulis tangan untuk menyampaikan informasi bahkan tidak jarang memanfaatkan media jejaring sosial pribadi untuk menyampaikan informasi pengumuman kampus.

Selain itu pihak jurusan terkadang harus melakukan fotocopy maupun mengetik ulang

informasi sebelum dipublikasikan, karena informasi yang diberikan sudah dalam

bentuk media fisik yang di printout.

Namun, cara-cara yang digunakan tersebut kurang efektif mengingat informasi yang diberikan harus sesegera mungkin dapat tersampaikan kepada mahasiswa. Oleh karena itu dibutuhkan sebuah sistem yang efektif, cepat, dan mudah digunakan dalam memberikan dan menyampaikan informasi tersebut yaitu dalam

sebuah aplikasi mobile. Karena dengan aplikasi yang diimplementasikan pada

perangkat mobile dapat digunakan kapan saja dan dimana saja asalkan terintegrasi

dengan jaringan internet.

3.1.2 Analisis Sistem Operasi

Analisis sistem operasi menjelaskan perbandingan antara sistem operasi

Android dengan sistem operasi mobile lain. Perbandingan sistem operasi dilakukan

dari segi pengguna dan perkembangan aplikasi pendukung.

A. Perbandingan Analisis Pengguna Dunia

Pada analisis perbandingan pengguna ini data yang digunakan sebagai perbandingan adalah data pengguna yang ada diseluruh dunia. Sumber data yang

(3)

60

digunakan sebagai analisis perbandingan diambil dari www.idc.com, IDC (International Data Corporation ) adalah penyedia utama intelejen pasar global, jasa konsultasi , dan peristiwa untuk teknologi , telekomunikasi dan konsumen

pasar teknologi informasi . Gambar 3.1 adalah data Worldwide Smartphone OS

Share yang dirilis oleh IDN pada Mei 2013.

Gambar 3.1 Grafik Worldwide Smartphone OS Share Tahun 2012 – 2013

Seperti yang terlihat pada grafik diatas sistem operasi mobile Android banyak

digunakan oleh pengguna smartphone di dunia. Peningkatan juga terlihat pada presentasi rata-rata tahun 2012 sebesar 67.3% meningkat menjadi 74.93% di tahun 2013.

(4)

61

B. Analisis Pengguna Di Jurusan Teknik Informatika UIN Bandung

Berdasarkan Quisioner yang dibagikan pada bulan Juni 2013, diperoleh hasil seperti grafik pada gambar 3.2.

Gambar 3.2 Grafik Pengguna OS Smartphone

Jurusan Teknik Informatika UIN SGD Bandung

Dari 368 mahasiswa yang mengisi quisioner terdapat 166 mahasiswa tercatat sebagai pengguna android. Dengan rumus persentase sebagai berikut :

Persentase = Nilai yang dicari presentasenya x 100 %

Jumlah keseluruhan

= 166 x 100%

368

= 45.11%

Dari perhitungan diatas didapatkan persentase dari pengguna android sebesar 45.11% atau dibulatkan menjadi 45% mahasiswa adalah pengguna OS Android, Jumlah OS Smartphone yang lebih dari 7 jenis yang diantaranya yaitu Android, iOS, Blackberry, Windows, Symbian, Linux, Palm, dll sudah menjadi bukti,

45% 13% 14% 14% 14% Pengguna OS Smartphone

di Jurusan Teknik Informatika UIN SGD Bandung

Android iOS Blackberry Windows Symbian

(5)

62

dengan jumlah presentase 45% OS Android merupakan OS dengan pengguna terbesar di jurusan teknik informatika UIN Bandung.

3.2 Deskripsi Umum

Aplikasi yang dibangun pada tugas akhir ini adalah aplikasi mobile yang

digunakan unutk menjembatani pengguna yang ingin mengakses website tersebut dengan lebih cepat menggunakan telepon genggam berbasis android.

3.3 Arsitektur Sistem

Pada gambar 3.3 merupakan arsitektur sistem informasi teknik informatika UIN Sunan Gunung Djati Bandung. Proses yang dilakukan, pengguna mengakses

website yang terdapat pada web server. Jika terjadi request untuk mengakses database, maka web server akan meneruskannya kepada server database yang menggunakan MySql dan menampilkan hasilnya pada website yang diakses oleh pengguna.

(6)

63

Sedangkan bentuk arsitektur Aplikasi Informasi teknik informatika UIN Sunan Gunung Djati Bandung pada telepon genggam, dapat dilihat pada Gambar 3.4. pada telepon genggam berbasis android, telah diinstal aplikasi klien untuk menampilkan data-data yang terdapat pada database. Sebagai penjembatan antara aplikasi klien dan database maka dibuat perantara berupa file.php yang terdapat pada web server.

Gambar 3.4 Arsitektur Aplikasi

Di dalam web server dibedakan menjadi dua folder, yaitu folder pertama

berisi file-file html dan php yang berfungsi utuk menampilkan website. Folder kedua

berisi file-file php yang berfungsi untuk menangkap request dari aplikasi java dan

berfungsi untuk memberikan respon kepada aplikasi java. Selain itu file php tersebut merupakan penjembatan antara database MySql dengan aplikasi java.

Untuk request dan response data yang cukup banyak, maka digunakanlah

(7)

64

membentuk suatu obyek, kemudian obyek tersebut diencode dan dikirimkan kepada

aplikasi java. Oleh aplikasi java, response yang diberikan oleh web server didecode

menjadi suatu obyek yang nantinya dapat diproses ke dalam aplikasi

3.4 Perancangan

3.4.1 Perancangan Sistem

A. Use Case Diagram

Berikut adalah gambar use case diagram yang disajikan untuk

Aplikasi Informasi Jurusan Teknik informatika UIN Sunan Gunung Djati Bandung Berbasis Android. Lihat gambar 3.5 sebagai berikut :

Gambar 3.5 Usecase Diagram

System

User

Melihat Info Kampus Melihat Info Berita Melihat Info Pengumuman

Melihat Gallery Detail Kampus Detail Berita Detail Pengumuman Detail Gallery Bookmark Hapus Bookmark <<include>> <<include>> <<include>> <<include>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> Registrasi Notifikasi TabHost About

(8)

65

B. Skenario Use Case

Skenario Use Case Diagram merupakan deskripsi urutan langkah-langkah dalam proses

bisnis baik yang dilakukan aktor terhadap sistem maupun yang dilakukan oleh sistem

terhadap aktor. Skenario use case ini dibuat berdasarkan use case diagram pada Gambar

3.5. berikut ini penjelasan dari masing-masing skenario use case pada tabel dibawah ini.

Tabel 3.1 Skenario Use Case Registrasi Identifikasi

Nama Registrasi

Tujuan Memastikan pengguna mendaftarkan device untuk mendapatkan

notifikasi

Aktor User

Kondisi Awal Menampilkan form notifikasi

Skenario Utama Skenario Normal

Aksi Aktor Reaksi Sistem

1. Menampilkan pesan “Apakah Kamu

Mau Menerima Notifikasi?”

2. Menekan tombol “Ya” untuk

menyetujui menerima notifikasi

3. Menyimpan ID device pada database

Skenario Alternatif : Tidak Tersedia Koneksi Internet

1. Menampilkan pesan “Apakah Kamu

Mau Menerima Notifikasi?”

2. Menekan tombol “Ya” untuk

menyetujui menerima notifikasi

3. Mengecek ketersediaan koneksi internet

4. Tidak dapat melakukan koneksi internet

5. Menampilkan Pesan “Please connect

to working internet connection?”

6. Mengatur koneksi internet

8. Menyimpan ID device pada database

(9)

66

Tabel 3.2 Skenario Use Case Tab Menu

Identifikasi

Nama Tab Menu

Tujuan Melihat tabmenu

Aktor User

Kondisi Awal -

1. Pengguna masuk ke dalam aplikasi

2. Mengambil data tab menu

3. Menampilkan pilihan tab menu

1. Pengguna masuk ke dalam aplikasi

2. Mengecek ketersediaan koneksi

internet

3. Tidak dapat melakukan koneksi

internet

4. Menampilkan pilihan tab menu

Kondisi Akhir Menampilkan tabmenu

Tabel 3.3 Skenario Use Case List Menu Kampus

Identifikasi

Nama List Menu Kampus

Tujuan Melihat seluruh list menu kampus

Aktor User

Kondisi Awal Halaman utama tabmenu

1. Pengguna masuk ke halaman menu

utama

2. Mengambil data info kampus

3. Menampilkan list judul menu kampus

utama

4. Tidak menampilkan list judul dari menu

kampus

(10)

67

Kondisi Akhir Menampilkan list judul menu kampus

Tabel 3.4 Skenario Use Case List Menu Berita

Identifikasi

Nama List Menu Berita

Tujuan Melihat seluruh list menu berita

Aktor User

utama

2. Mengambil data info berita

3. Menampilkan list judul menu berita

utama

berita

Kondisi Akhir Menampilkan list judul menu berita

Tabel 3.5 Skenario Use Case List Menu Pengumuman

Identifikasi

Nama List Menu Berita

Tujuan Melihat seluruh list menu pengumuman

Aktor User

utama

2. Mengambil data info pengumuman

3. Menampilkan list judul menu

pengumuman Skenario Alternatif : Tidak Tersedia Koneksi Internet

(11)

68

utama

pengumuman

Kondisi Akhir Menampilkan list judul menu pengumuman

Tabel 3.6 Skenario Use Case List Menu Galeri

Identifikasi

Nama List Menu Galeri

Tujuan Melihat seluruh list menu galeri

Aktor User

utama

2. Mengambil data info galeri

3. Menampilkan list judul menu galeri

utama

galeri

Kondisi Akhir Menampilkan list judul menu galeri

Tabel 3.7 Skenario Use Case Detail Menu Kampus

Identifikasi

Nama Detail Menu kampus

Tujuan Melihat seluruh detail menu kampus

Aktor User

Kondisi Awal Menampilkan list judul menu kampus

(12)

69

5. Memilih judul dari menu kampus

6. Menampilkan detail berdasarkan judul

yang dipilih dari menu kampus Skenario Alternatif : Tidak Tersedia Koneksi Internet

6. Memilih judul dari menu kampus

galeri

7. Menampilkan detail menu kampus

Kondisi Akhir Menampilkan detail menu kampus

Tabel 3.8 Skenario Use Case Detail Menu Berita

Identifikasi

Nama Detail Menu berita

Tujuan Melihat seluruh detail menu berita

Aktor User

Kondisi Awal Menampilkan list judul menu berita

8. Memilih judul dari menu berita

yang dipilih dari menu berita Skenario Alternatif : Tidak Tersedia Koneksi Internet

9. Memilih judul dari menu berita

galeri

10. Menampilkan detail menu berita

(13)

70

Tabel 3.9 Skenario Use Case Detail Menu Pengumuman

Identifikasi

Nama Detail Menu Pengumuman

Tujuan Melihat seluruh detail menu pengumuman

Aktor User

Kondisi Awal Menampilkan list judul menu pengumuman

10.Menampilkan list judul menu

pengumuman

11. Memilih judul dari menu

pengumuman

yang dipilih dari menu pengumuman Skenario Alternatif : Tidak Tersedia Koneksi Internet

11. Menampilkan list judul menu

pengumuman

12. Memilih judul dari menu

pengumuman

galeri

13. Menampilkan detail menu pengumuman

Kondisi Akhir Menampilkan detail menu pengumuman

Tabel 3.10 Skenario Use Case Detail Menu Galeri

Identifikasi

Nama Detail Menu Galeri

Tujuan Melihat seluruh detail menu galeri

Aktor User

Kondisi Awal Menampilkan list judul menu galeri

13.Menampilkan list judul menu galeri

14. Memilih judul dari menu galeri

yang dipilih dari menu galeri Skenario Alternatif : Tidak Tersedia Koneksi Internet

(14)

71

15. Memilih judul dari menu galeri

galeri

16. Menampilkan detail menu galeri

Kondisi Akhir Menampilkan detail menu galeri

Tabel 3.11 Skenario Use Case Tambah Bookmark

Identifikasi

Nama Tambah Bookmark

Tujuan Menambah bookmark

Aktor User

Kondisi Awal Menampilkan detail dari judul yang sudah dipilih

16.Menampilkan detail dari judul terpilih.

17. Menekan icon bookmark

18. Menampilkan pesan “Bookmark

Disimpan” Skenario Alternatif : Tidak Tersedia Koneksi Internet

18. Menekan icon bookmark

19. Menampilkan pesan “Bookmark

Disimpan”

Kondisi Akhir Menyimpan data bookmark

Tabel 3.12 Skenario Use Case Detail Bookmark

Identifikasi

Nama DetailBookmark

Tujuan Menampilkan detail dari judul menu bookmark

Aktor User

Kondisi Awal Halaman Utama

19.Menampilkan halaman utama

20. Menekan pilihan lalu icon

bookmark

21. Mengambil data bookmark

(15)

72

23. Memilih berdasarkan judul

terpilih Skenario Alternatif : Tidak Tersedia Koneksi Internet

1. Menampilkan halaman utama

2. Menekan pilihan lalu icon

bookmark

3. Mengambil data bookmark

4. Menampilkan data list bookmark

5. Memilih berdasarkan judul

terpilih

Kondisi Akhir Menampilkan detail berdasarkan judul terpilih pada menu

bookmark

Tabel 3.13 Skenario Use Case Hapus Bookmark

Identifikasi

Nama Hapus Bookmark

Tujuan Menghapus detail dari judul menu bookmark

Aktor User

1. Pengguna menekan tombol option

lalu bookmark

2. Menampilkan list menu bookmark

3. Memilih judul dari list bookmark

4. Menampilkan detail menu yang dipilih

5. Menekan tombol hapus bookmark

6. Menghapus judul pada database dan

menampilkan pesan “Bookmark

Dihapus” Skenario Alternatif : Tidak Tersedia Koneksi Internet

lalu bookmark

2. Menampilkan list menu bookmark

3. Memilih judul dari list bookmark

4. Menampilkan detail menu yang dipilih

5. Menekan tombol hapus bookmark

6. Menghapus judul pada database dan

menampilkan pesan “Bookmark

Dihapus”

(16)

73

Tabel 3.14 Skenario Use Case About

Identifikasi

Nama About

Tujuan Menampilkan detail dari about

Aktor User

lalu About

2. Menampilkan info tentang aplikasi.

1. Pengguna menekan tombol option

lalu About

2. Menampilkan info tentang aplikasi.

Kondisi Akhir Menampilkan detail menu About

C. Activity Diagram

Activity Diagram merupakan diagram yang memodelkan aliran kerja atau workflow dari urutan aktifitas dalam suatu proses yang mengacu pada use case diagram yang ada.

(17)

74

1. Activity Diagram Melihat Info Kampus

Activity Diagram Melihat Info Kampus menjelaskan alir kerja aktor untuk melakukan proses Melihat List dari Info Kampus. Gambar 3.6 akan menggambarkan alir kerja proses Melihat List dari Info Kampus

Gambar 3.6 Activity Diagram Melihat Info Kampus

2. Activity Diagram Melihat Info Berita

Gambar 3.7 merupakan Activity Diagram Melihat Info Berita menjelaskan alir kerja aktor untuk melakukan proses Melihat List dari Info Berita.

Gambar 3.7 Activity Diagram Melihat Info Berita

User System

Menampilkan Tab Menu

Memilih Tab menu Kampus

Menampilkan List Menu Kampus

User System

Memilih Tab menu Berita

(18)

75

3. Activity Diagram Melihat Info Pengumuman

Gambar 3.8 merupakan Activity Diagram Melihat Info Pengumuman menjelaskan alir kerja actor untuk melakukan proses Melihat List dari Info Pengumuman.

Gambar 3.8 Activity Diagram Melihat Info Pengumuman

4. Activity Diagram Melihat Galeri

Gambar 3.9 merupakan Activity Diagram Melihat Galeri menjelaskan alir kerja aktor untuk melakukan proses Melihat List dari Galeri.

Gambar 3.9 Activity Diagram Melihat Galeri

User System

Memilih Tab menu Pengumuman

Menampilkan List Menu Pengumuman

User System

Memilih Tab menu Gallery

(19)

76

5. Activity Diagram Melihat Detail Kampus

Gambar 3.10 merupakan Activity Diagram Melihat Detail Kampus menjelaskan alir kerja actor untuk melakukan proses Melihat Detail dari Info Kampus berdasarkan judul dari menu kampus yang dipilih.

Gambar 3.10 Activity Diagram Melihat Detail Kampus

6. Activity Diagram Melihat Detail Berita

Gambar 3.11 merupakanActivity Diagram Melihat Detail Berita menjelaskan alir kerja aktor untuk melakukan proses Melihat Detail dari Info Beritaberdasarkan judul dari menu berita yang dipilih.

Gambar 3.11 Activity Diagram Melihat Detail Berita

User System

Menampilkan List Kampus

Memilih Judul Pada List

Menampilkan Detail Dari Judul Berita

User System

Menampilkan List Berita

(20)

77

7. Activity Diagram Melihat Detail Pengumuman

Gambar 3.12 merupakan Activity Diagram Melihat Detail Pengumuman menjelaskan alir kerja actor untuk melakukan proses Melihat Detail dari Info Pengumuman berdasarkan judul dari menu pengumuman yang dipilih.

Gambar 3.12 Activity Diagram Melihat Detail Pengumuman

8. Activity Diagram Melihat Detail Galeri

Gambar 3.13 merupakan Activity Diagram Melihat Detail Galeri menjelaskan alir kerja actor untuk melakukan proses Melihat Detail dari Info Galeri berdasarkan judul dari menu Galeri yang dipilih.

Gambar 3.13 Activity Diagram Melihat Detail Galeri

User System

Menampilkan List Pengumuman

Menampilkan Detail Dari Judul Pengumuman

User System

Menampilkan List Judul Gallery

(21)

78

9. Activity Diagram Melakukan Bookmark

Gambar 3.14 merupakanActivity Diagram Melakukan Bookmark menjelaskan alir

kerja actor untuk melakukan proses Bookmark pada detail dari menu dan judul

yang dipilih.

Gambar 3.14 Activity Diagram Melakukan Bookmark

10.Activity Diagram Melihat Bookmark

Gambar 3.15 merupakan Activity Diagram MelihatBookmark menjelaskan alir

kerja actor untuk melakukan proses Melihat Bookmark dari menu dan judul yang

dipilih pada menu Bookmark.

Gambar 3.15 Activity Diagram Melihat Bookmark

User Sistem

Menampilkan Menu

Memilih Menu

Menampilkan List Menu yang Dipilih

Memilih Judul dari List

Menampilkan Detail dari Judul yang Dipilih

Menekan Tombol Bookmark

Melakukan Penyimpanan Pada Database

User Sistem

Menampilkan Menu

Menekan Tombol Option

Menampilkan Menu Bookmark dan Info

Memilih Menu Bookmark

Menampilkan List Pada Menu Bookmark Memilih Judul Pada Menu Bookmark

(22)

79

11.Activity Diagram Hapus Bookmark

Gambar 3.16 merupakan Activity Diagram Melakukan Hapus Bookmark

menjelaskan alir kerja actor untuk melakukan proses Hapus Bookmark pada list

dari menu Bookmark.

Gambar 3.16 Activity Diagram Hapus Bookmark

12.Activity Diagram Register

Gambar 3.17 merupakan Activity Diagram Register menjelaskan alir kerja actor untuk melakukan proses pendaftaran untuk mendapatkan notifikasi.

Gambar 3.17 Activity Diagram Register

User Sistem

Menampilkan Menu Memilih Menu

Menampilkan List Menu yang Dipilih Memilih Judul dari List

Menampilkan Detail dari Judul yang Dipilih Menekan Tombol Hapus Bookmark

Menghapus Pada Database

Pengguna Sistem

Menampilkan Form Register

Mengisi Data Registrasi

Menekan Tombol Register Here

Menampilkan Halaman Utama start

(23)

80

D. Entity Relationship Diagram (ERD)

Gambar 3.18 merupakan gambaran ERD dari Aplikasi Informasi Jurusan Teknik Informatika UIN Sunan Gunung Djati Bandung.

Gambar 3.18 Entity Relationship Diagram (ERD)

E. Struktur Tabel

Sebuah struktur file dapat digunakan untuk suatu perancangan sistem yang di buat karena data yang di buat ini dapat menentukan struktur database yang ada yang menunjukan dari struktur data yang dapat diketahui size atau jenisnya. Agar dapat mempermudah dalam pembuatan program maka dibuatnya struktur database, dan dapat dilihat seperti di bawah ini :

(24)

81

1) wp_users

Nama Tabel : wp_users

Media Penyimpanan : Harddisk

Primary key : ID

Foreign Key :

Tabel 3.15 Struktur wp_users

No Nama Fie ld Ke y Tipe Data Ke te rangan

1 ID Primary Key bigint(20) ID User

2 user_login Key varchar(60) Username

3 user_pass varchar(64) Password

4 user_nicename Key varchar(50)

5 user_email varchar(100) Email

6 user_url varchar(100) URL

7 user_registered datetime waktu registrasi

8 user_activation_key varchar(60)

9 user_status int(11) status aktif

10 display_name varchar(250) Tampilan Nama

2) wp_term_relationship

Nama Tabel : wp_term_relationship

Primary key : object_id

Foreign Key :

Tabel 3.16 Struktur File wp_term_relationship

1 object_id Primary Key bigint(20) Kode Isi Postingan

2 term_taxonomy_id

Key bigint(20) ID Menu

(25)

82

3) wp_posts

Nama Tabel : wp_posts

Primary key : ID

Foreign Key :

Tabel 3.17 Struktur File wp_posts

1 ID Primary Key bigint(20) ID Postingan

2 post_author Key varchar(60) ID Author

3 post_date

varchar(64)

Waktu Pemostingan

4 post_content varchar(50) Isi Postingan

5 post_name varchar(100) Judul Postingan

6 post_guid varchar(100) URL

8 post_status_date Key varchar(60) Status Postingan

9 post_parent Key int(11)

4) wp_terms

Nama Tabel : wp_terms

Primary Key : term_id

Foreign Key : -

Tabel 3.18 Struktur File wp_terms

No Nama Field Key Tipe Data Keterangan

1 term_id primary key bigint(20) ID Menu

2 name Key varchar(200) Nama Menu

(26)

83

F. Class Diagram

Class Diagram merupakan gambaran dari struktur dan hubungan pada setiap objek-objek yang berjalan pada sistem. Pada diagram ini digambarkan atribut-atribut dan metode-metode yang ada pada masing-masing kelas. Adapun

gambaran class diagram dari Aplikasi Informasi Jurusan Teknik Informatika UIN

(27)

84 Be ri ta A da pt er +c on te xt +i nf la te r +d at a +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () +on Cl ick () Bo ok m ar kA da pt er +m Ct x +m Db He lp er +T AG +C O LU M N_F IR ST +C O LU M N_S EC O ND +C O LU M NT _T HI RD +op en () +c los e( ) +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () D at a +i d _+id_p os t +p os t_t itl e +p os t_c on te nt +g et Id () +s et Id () +g et Id pos t( ) +s et Id pos t( ) +g et Pos tt itl e( ) +s et Pos tt itl e( ) +g et Pos tc on te nt () +s et Pos tc on te nt () D et ai lG al er iA da pt er +c on te xt +i nf la te r +d at a +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () +on Cl ick () G al er iA da pt er +c on te xt +i nf la te r +d at a +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () +on Cl ick () H el pe r +T AG +D B_P AT H +D B_N AM E +D B_T AB LE +m yD at aB as e +m yC on te xt +c re at eD at aB as e( ) +c op yD at aB as e( ) +c he ck Da ta Ba se () +op en Da ta Ba se () +on Cr ea te () +on Up gr ad e( ) +i ns er tB oo km ar k( ) +d el et eB oo km ar k( ) Im ag eA da pt er +c on te xt +i nf la te r +d at a +i m ag eL oa de r +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () +on Cl ick () JS O NP ar se r +g et JS O Nf rom UR L( ) Ka m pu sA da pt er +c on te xt +i nf la te r +d at a +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () Ke gi at an A da pt er +c on te xt +i nf la te r +d at a +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () +on Cl ick () Pe ng um um an A da pt er +c on te xt +i nf la te r +d at a +g et Cou nt () +g et It em () +g et It em Id () +g et Vi ew () +on Cl ick () A gr em en tA ct iv it y +c on te xt +s es sion +_I D_R EG IS TR AT IO N +s ta tu sG CM +y es +n o +on Cr ea te () +d oR eg ist er Gc m () +d oR eg ist er Se ss ion () A le rt D ia lo gM an ag er +s how Al er tD ia log () Co nf ig +Y O UR _S ER VE R_U RL +G O O GL E_S EN DE R_I D +T AG +D IS PL AY _M ES SA GE _A CT IO N +E XT RA _M ES SA GE Co nt ro lle r +M AX _A TT EM PT S +B AC KO FF _M IL LI _S EC O ND S +re gi st er () +u nr eg ist er () +p os t( ) +i sC on ne ct in gT oI nt er ne t( ) +d isp la yM es sa ge O nS cr ee n( ) +s how Al er tD ia log () +a cq qu ire W ak eL oc k( ) +re le as eW ak eL oc k( ) G CM In te nt Se rv ic e +T AG +a Con tr ol le r +G CM In te nt Se rv ice () +on Re gi st er ed () +on Un re gi st er ed () +on M es sa ge () +on De le te dM es sa ge () +on Er ror () +on Re cov er ab le Er ror () +g en er at eN ot ifi ca tion () Re gi st er A ct iv it y +t ex tU se r +t ex tP as s +t ex tC on fir m +b tn Re gi st er +on Cr ea te () +on Cl ick () +c he ck In te rn et Con ne ct ion () Se ss io nM an ag er +p re f +e di tor +_c on te xt +P RI VA TE _M O DE +P RE F_N AM E +I S_L O GI N +K EY _N AM E +S es sion M an ag er () +c re at eL og in Se ss ion () +c he ck Log in () +g et Us er De ta ils () Sp la sh A ct iv it y +_a ct iv e +_s pl as hT im e +a le rt +s es sion +s ta tu s +n am e +a Con tr ol le r +m Re gi st er Ta sk +on Cr ea te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +on Re ce iv e( ) +on De st roy () +on Ba ck Pr es se d( ) Fi le Ca ch e +c ac he Di r +F ile Ca ch e( ) +g et Fi le () +c le ar () Im gL oa de r +f ile Ca ch e +i m ag eV ie w s +e xe cu tor Se rv ice +I m gL oa de r( ) +D isp la yI m ag e( ) +q ue ue Ph ot o( ) +g et Bi tm ap () +d ec od eF ile () M em or yC ac he +T AG +c ac he +s ize +l im it +M em or yC ac he () +s et Lim it( ) +g et () +p ut () +c he ck Si ze () +c le ar () +g et Si ze In By te s( ) U ti ls +C op yS tr ea m () Be ri ta A ct iv it y +p Di al og +b er ita Lis t +b er ita +l ist vi ew +a da pt er +j son ob je ct +T AG _I NF O +I D +P O ST _T IT LE +P O ST _C O NT EN T +P O ST _D AT E +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +c he ck In te rn et Con ne ct ion () Bo ok m ar kA ct iv it y +n ew DB +l v +t ab le Na m e +p os t_t itl e +i d_p os t +p os t_c on te nt +_p os t_t itl e +_i d_p os t +_p os t_c on te nt +a rA da pt er +l ist +l ist Da ta +d at a +t v +on Cr ea te () +op en Boo km ar k( ) +on It em Cl ick () D et ai lB er it aA ct iv it y +i d _+post_t itl e +p os t_c on te nt +p os t_d at e +m Pr og re ss Di al og +j ud ul +t an gg al +i si _+dbHel pe r +on Cr ea te () +on Cl ick () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () D et ai lB oo km ar kA ct iv it y +i d_p os t +d bH el pe r +on Cr ea te () +on Cl ick () D et ai lG al er iA ct iv it y +p Di al og +d et ai lG al er iLi st +g al er i +l ist vi ew +j son ob je ct +a da pt er +T AG _I NF O +I D +P O ST _T IT LE +P O ST _C O NT EN T +P O ST _D AT E +t er m _i d +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () D et ai lK am pu sA ct iv it y +i d _+post_t itl e +p os t_c on te nt +p os t_d at e +m Pr og re ss Di al og +j ud ul +i si _+dbHel pe r +on Cr ea te () +on Cl ick () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () D et ai lK eg ia ta nA ct iv it y +i d _+post_t itl e +p os t_c on te nt +p os t_d at e +m Pr og re ss Di al og +j ud ul +t an gg al +i si _+dbHel pe r +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () D et ai lP en gu m um an A ct iv it y +i d _+post_t itl e +p os t_c on te nt +p os t_d at e +m Pr og re ss Di al og +j ud ul +t an gg al +i si _+dbHel pe r +on Cr ea te () +on Cl ick () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () Fu llI m ag eA ct iv it y +i m ag e +i m ag eL oa de r +on Cr ea te () G al er iA ct iv it y +p Di al og +g al er iLi st +g al er i +l ist vi ew +j son ob je ct +a da pt er +T AG _I NF O +T ER M _I D +P O ST _D AT E +N AM E +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +c he ck In te rn et Con ne ct ion () Im ag eG al er iA ct iv it y +T AG _I NF O +G UI D +p Di al og +i d _+imag eL ist +j son ob je ct +i m ag e +l ist vi ew +a da pt er +g rid vi ew +m em or yC ac he +f ile Ca ch e +j ud ul +k et er an ga n +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +g et Bi tm ap () +d ec od eF ile () Ka m pu sA ct iv it y +p Di al og +k am pu sL ist +k am pu s +l ist vi ew +a da pt er +j son ob je ct +T AB _I NF O +I D +P O ST _T IT LE +P O ST _C O NT EN T +P O ST _D AT E +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +c he ck In te rn et Con ne ct ion () Ke gi at an A ct iv it y +p Di al og +k eg ia ta nL ist +k eg ia ta n +l ist vi ew +a da pt er +j son ob je ct +T AG _I NF O +I D +P O ST _T IT LE +P O ST _C O NT EN T +P O ST _D AT E +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +c he ck In te rn et Con ne ct ion () Pe ng um um an A ct iv it y +p Di al og +p en gu m um an Lis t +p en gu m um an +l ist vi ew +a da pt er +j son ob je ct +T AG _I NF O +I D +P O ST _T IT LE +P O ST _C O NT EN T +P O ST _D AT E +on Cr ea te () +on Pr eE xe cu te () +d oI nB ac kg rou nd () +on Pos tE xe cu te () +c he ck In te rn et Con ne ct ion () Ta bh os tA ct iv it y +G AL ER I_T AB +P EN GU M UM AN _T AB +B ER IT A_T AB +K AM PU S_T AB +c on te xt +d b +on Cr ea te () +on Cr ea te O pt ion sM en u( ) +on O pt ion sI te m Se le ct ed () +on Ba ck Pr es se d( ) +on De st roy ()

(28)

85

G. Sequence Diagram

Pada tahap ini Sequence Diagram menjelaskan secara detil urutan proses yang dilakukan sistem untuk mencapai tujuan dari Use Case. Interaksi yang terjadi antar class, operasi apa saja yang terlibat, urutan antar operasi, dan informasi yang diperlukan oleh masing-masing operasi.

1. Sequence Diagram Melihat Detail Info Pengumuman

(29)

86

2. Sequence Diagram Melihat Detail Info Galeri

Gambar 3.21 Sequence Diagram Melihat Detail Info Galeri

3. Sequence Diagram Melihat Detail Info Tentang Informatika

(30)

87

4. Sequence Diagram Melihat Detail Info Berita

Gambar 3.23 Sequence Diagram Melihat Detail Info Berita

5. Sequence Diagram Bookmark

(31)

88 2.4.1 Perancangan Aplikasi

Perancangan Aplikasi adalah teknik perancangan design suatu aplikasi yang

akan dibuat sesuai fungsi dan keinginan bagi admin, dengan menjelaskan

deskripsi interface dan penggunaan pembuatan aplikasi itu sendiri

1. Halaman Pembuka

Halaman Pembuka adalah halaman selamat datang sekaligus proses loading data

pada aplikasi, halaman ini dapat diakses oleh semua user yang telah meng-install Aplikasi Informasi Jurusan Teknik Informatika UIN Sunan Gunung Djati Bandung.

Gambar 3.25 Tampilan Halaman Pembuka

2. Registrasi

Pada halaman ini sistem akan meminta user untuk memasukkan username

dan email. Pada saat pertama kali meng-install Aplikasi Informasi Jurusan Teknik

Informatika UIN Sunan Gunung Djati Bandung ini, user akan diminta untuk

memasukkan username dan email untuk mendaftarkan device-nya agar dapat

menerima notifikasi.

Gambar 3.26 Tampilan Halaman Registrasi Connecting . . .

LOGO

Apakah Anda Mau Menerima Notifikasi ?

Not ifika

(32)

89

3. Halaman Utama

Pada halaman utama, user dapat melihat berbagai menu berupa pengumuman,

tulisan, berita, tentang informatika, dan bookmark. Pada halaman utama juga di

tampilkan info terbaru berdasarkan tanggal. Setiap user dapat memilih menu yang

diinginkan.

Gambar 3.27 Tampilan Halaman utama

4. Detail Info

Halaman detail info ini dapat diakses ketika user sudah memilih menu dan

meng-klik judul pada menu tersebut. Pada halaman ini user dapat melihat isi berita dan

melihat secara rinci keterangan berita tersebut, mulai dari judul, tanggal terbit,

penulis, dan isi berita. Pada halaman ini user dapat melakukan bookmark yang