No title

BAB III ANALISIS DAN PERANCANGAN SISTEM

Pada perancangan suatu sistem, diperlukan analisis yang tepat sehingga proses pembuatan sistem dapat berjalan dengan lancar dan sistem yang dibuat sesuai dengan yang diharapkan. Hal lain yang dibutuhkan yaitu mendesain sistem yang berguna untuk memberikan gambaran tentang sistem yang akan dibuat kepada pengguna sistem (end user) dan untuk mempermudah programmer dalam mengimplementasikan sistem tersebut serta mempermudah dalam proses pengembangan sistem kedepannya.

3.1

Tinjauan Umum

Perlindungan dan pelestarian terhadap seni dan budaya bangsa harus terus ditingkatkan, seiring makin maraknya negara lain yang berusaha untuk mencuri dan mempatenkan budaya bangsa kita menjadi kebudayaan mereka. Setelah tari saman dari Provinsi Nanggroe Aceh Darussalam sudah ditetapkan sebagai warisan budaya tak benda (intangible) oleh Badan PBB Urusan Pendidikan, Sains, dan Kebudayaan (UNESCO), sudah sepatutnya kebudayaan Indonesia lainnya juga diakui dan masuk dalam daftar warisan budaya yang dilindungi.

3.2

Analisis Sistem

Analisis sistem (system analysis) adalah penguraian dari suatu sistem informasi yang utuh kedalam bagian-bagian atau komponen-komponennya dengan maksud untuk mengidentifikasikan dan mengevaluasi permasalahanpermasalahan, kesempatan-kesempatan,

hambatan-hambatan yang terjadi dan

kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikanperbaikannya. 41 http://digilib.mercubuana.ac.id/

42

Dengan menggunakan bahasa pemrograman HTML dan PHP aplikasi ensiklopedia tari daerah pulau Jawa berbasis web yang akan dibangun dalam penelitian ini, diharapkan dapat dijadikan sebagai alat pengenalan, pembelajaran dan pelestarian kesenian budaya bangsa. Aplikasi ini juga diharapkan mampu menampung sebagian besar kebutuhan pengguna internet akan informasiinformasi penting khususnya tentang tari-tarian daerah di Indonesia. Aplikasi ensiklopedia tari daerah berbasis web ini memiliki dua bagian utama yaitu halaman pengunjung dan halaman admin. Untuk halaman pengunjung mempunyai kemampuan untuk melakukan pencarian informasi-informasi terkait tari-tarian daerah, pengguna atau pengunjung dapat berbagi informasi atau berita secara langsung guna menambah wawasan dan pengetahuan tentang tari-tarian daerah disekitar kita, selain itu juga di halaman pengunjung menampilkan informasi-informasi menarik yang dapat dibaca dan dinikmati pengunjung seperti artikel pilihan, galeri tarian daerah, atau galeri video tentang tari daerah. Sedangkan untuk halaman admin memiliki fasilitas untuk mengatur dan mengontrol konten-konten dalam aplikasi web ini. Aplikasi ini akan terdiri dari database dan PHP. Untuk database menggunakan MySQL dan untuk menampilkan aplikasi ini diperlukan browser seperti Internet Explorer, Mozilla Firefox, Google Chroome, atau yang lainnya. Komponen penunjang lainnya adalah Web Server dimana digunakan XAMPP (Apache, MySQL, PHP dan Perl). Melihat perkembangan teknologi informasi dewasa ini, khususnya untuk aplikasi berbasis web penulis menyadari sudah banyak aplikasi-aplikasi web yang berkembang dengan tujuan yang hampir sama yaitu menyediakan informasiinformasi penting terkait kebudayaan di Indonesia misalnya seperti website www.budaya-indonesia.org,

www.e-indonesiana.cs.ui.ac.id,

www.palingindonesia.com, atau yang lainnya. Dari beberapa website yang sudah dikunjungi, penulis melakukan pengumpulan data dan menganalisis beberapa fitur

http://digilib.mercubuana.ac.id/

43 yang disediakan website tersebut dan berikut ini penjelasan tentang web dan fiturfitur yang dimiliki oleh ketiga website tersebut yaitu: 1.

budaya-indonesia.org merupakan sebuah domain (situs) untuk proyek yang dibangun oleh sekumpulan orang atau komunitas yang bernama IACI (Indonesian Archipelago Cultural Initiatives) yang melakukan pengumpulan data (artefak) budaya indonesia dalam bentuk Perpustakaan Digital.

2.

palingindonesia.com merupakan sebuah situs yang dibangun oleh sekumpulan orang atau komunitas yang melakukan pengumpulan berbagai karya, budaya, kuliner, prestasi tentang ragam budaya Indonesia.

3.

e-indonesiana.cs.ui.ac.id/echnh-ng/ merupakan sebuah portal bagian dari sistem pelestarian budaya dan kekayaan alam Indonesia berbasis teknologi informasi dan komunikasi (E-Cultural Heritage and Natural History of Indonesia - ECHNH) yang dikembangkan oleh Laboratorium Digital Library and Distance Learning - Fakultas Ilmu Komputer - Universitas Indonesia.

Tabel 3.1 Analisis Fitur-fitur Web terkait Budaya Indonesia No

Spesifikasi (Fitur)

www.budaya indonesia.org

www.paling indonesia.c om

www.eindonesiana.c s.ui.ac.id

Y

Y

Y

N

Y

Y

Y

Y

N

Y

N

N

4

Komponen Ensiklopedia (Teks & Gambar) Multimedia (Audio, Video, Animasi, dll) Informasi Pendukung (Berita / Artikel) Forum (Diskusi)

5

Pelaporan Data

Y

N

N

6

Kontribusi Data (Sunting)

Y

Y

Y

7

Pendidikan berbasis ICT

N

N

Y

8 Dukungan Sosial Media Keterangan Tabel:

N

Y

N

1 2 3

Y : Ada (tersedia) N : Tidak ada (tidak tersedia)


44

Dari analisis diatas penulis menetapkan ada beberapa fitur aplikasi web yang belum dilengkapi pada aplikasi web pembanding diatas diantaranya yaitu: 1.

Fitur forum diskusi untuk sarana diskusi bagi pengunjung, user dan admin web.

2.

Fitur kuis yang berguna untuk mengukur wawasan dan pengetahuan tentang tari-tarian daerah.

3.

Fitur informasi ragam gerak atau bagian tari-tarian yang memberi penjelasan lebih mendalam tentang tarian daerah. Dari kekurangan fitur atau fungsi pada aplikasi web yang ada akan dijadikan

kebutuhan (requirement) dalam aplikasi ensiklopedia tari daerah berbasis web ini.

3.3

Perancangan Aplikasi

Pada tahap perancangan aplikasi ini akan dijelaskan secara detail mengenai perancangan aplikasi ensiklopedia tari daerah berbasis web yang akan dibagi dalam empat bagian, yaitu perancangan ERD (Entity Relationship Diagram), struktur data, perancangan pemodelan dan perancangan antarmuka.

3.3.1

Perancangan ERD dan Struktur Data

3.3.1.1 ERD (Entity Relationship Diagram)

Berikut ini akan ditampilkan ER Diagram untuk aplikasi ensiklopedia berbasis web yang akan dirancang.


45

Gambar 3.1 ER Diagram Aplikasi Ensiklopedia Tari Daerah Berbasis Web

3.3.1.2 Struktur Tabel dan Tipe Data

Dalam aplikasi ensiklopedia tari daerah ini dibentuk satu database relasional yang bernama “db_taripedia”, yang terdapat beberapa tabel untuk menyimpan


46 data. Dan berikut ini penulis akan uraikan Data dictionary (kamus data) yang ada dalam pembuatan aplikasi ensiklopedia berbasis web ini yaitu: 1.

Kamus data pengguna Nama tabel

: tbl_user

Primary key

: id_user

Tabel 3.2 Kamus data untuk data pengguna

2.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_user

integer

3

Id untuk pengguna

2

username

varchar

25

Identitas untuk login

3

password

varchar

50

Password / kata sandi

4

nama_lengkap

varchar

100

Nama lengkap pengguna

5

email

varchar

100

Alamat e-mail pengguna

6

level

varchar

20

Otorisasi pengguna di sistem

7

blokir

enum

8

id_session

varchar

„Y‟,‟N‟ Status pengguna (aktif/diblokir) 100

Session ID tiap user yang login

Kamus data untuk data tarian daerah Nama tabel

: tbl_tarian

Primary key

: id_tarian

Tabel 3.3 Kamus data untuk data tarian daerah No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_tarian

integer

5

Id tarian daerah

2

id_kategori

integer

5

Id kategori tarian

3

id_provinsi

integer

5

Id provinsi tarian

4

nama_tarian

varchar

100

Nama tarian daerah

5

tari_seo

varchar

100

SEO tarian daerah

6

deskripsi1

text

-

7

embed

varchar

100

Deskripsi tarian daerah Link video dari youtube 1


47

Tabel 3.3 Kamus data untuk data tarian daerah ( lanjutan )

3.

8

embed1

Varchar

100

Link video dari youtube 2

9

embed2

Varchar

100

Link video dari youtube 3

10

gambar

Varchar

100

Gambar utama tarian

11

dibaca

Integer

5

Jumlah berapa kali dibaca

Kamus data untuk data provinsi Nama tabel

: tbl_provinsi

Primary key

: id_provinsi

Tabel 3.4 Kamus data untuk data provinsi

4.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_provinsi

integer

3

Id provinsi

2

id_pulau

integer

3

Id pulau

3

nama_provinsi

varchar

100

Nama provinsi

4

ibukota

varchar

100

Ibu kota provinsi

5

situs

varchar

80

Alamat situs provinsi

6

prov_seo

varchar

100

SEO provinsi

7

deskripsi

text

-

Deskripsi provinsi

8

lambang

varchar

100

Lambang provinsi

Kamus data untuk data pulau Nama tabel

: tbl_pulau

Primary key

: id_pulau

Tabel 3.5 Kamus data untuk data pulau No

Nama Field

Tipe Data

Ukuran

1

id_pulau

integer

2

2

pulau

varchar

100

Keterangan Id pulau Nama pulau


48 5.

Kamus data untuk kategori tarian Nama tabel

: tbl_kategori

Primary key

: id_kategori

Tabel 3.6 Kamus data untuk kategori tarian

6.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_kategori

integer

5

2

nama_kategori

varchar

100

Nama kategori tarian

3

kategori_seo

varchar

100

SEO kategori tarian

Id kategori tarian

Kamus data untuk data berita Nama tabel

: tbl_berita

Primary key

: id_berita

Tabel 3.7 Kamus data untuk data berita No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_berita

integer

5

Id berita

2

id_prov

integer

5

3

username

varchar

30

4

judul

varchar

100

Id provinsi Nama pengguna yang menulis berita Judul berita

5

judul_seo

varchar

100

SEO judul berita

6

isi_berita

text

-

Detail isi berita

7

status

varchar

50

Status berita

8

hr

varchar

20

Hari pada saat berita disubmit

9

tgl

date

-

Tanggal pada saat berita disubmit

10

jm

time

-

Jam pada saat berita disubmit

11

tgl_tyang

datetime

-

Tanggal ditayangkannya berita

12

gbr

varchar

100

13

dibaca

integer

5

14

headline

enum

15

prov_seo

varchar

Gambar untuk berita terkait Berapa kali berita dibaca

„Y‟,‟N‟ 100

SEO provinsi


49

7.

Kamus data untuk kategori topik forum diskusi Nama tabel

: tbl_kateforum

Primary key

: id_kateforum

Tabel 3.8 Kamus data untuk kategori topik forum diskusi

8.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_kateforum

integer

5

Id kategori forum

2

nama_kategori

varchar

50

Nama kategori berita

3

kateforum_seo

varchar

100

4

aktif

Enum

5

keterangan

text

SEO kategori topik forum Status kategori forum „Y‟,‟N‟ (aktif/tidak) Keterangan singkat kategori

Kamus data untuk data ragam gerak dan bagian tari Nama tabel

: tbl_bagtari

Primary key

: id_bagtari

Tabel 3.9 Kamus data untuk data ragam gerak dan bagian tari

9.

No

Nama Field

Tipe Data

Ukuran

1

id_bagtari

integer

5

2

id_tarian

integer

5

3

nama_bagtari

varchar

100

4

deskripsi

text

-

5

gbr

varchar

100

Keterangan Id ragam gerak dan bagian tari Id tarian Nama ragam gerak atau bagian tari Deskripsi bagian/ragam gerak tari Gambar untuk ragam/bagian tari

Kamus data untuk data konten (artikel) Nama tabel

: tbl_konten

Primary key

: id_konten

Tabel 3.10 Kamus data untuk data konten (artikel)


50

10.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_konten

integer

5

2

judul

varchar

100

Judul konten

3

nama_konten

varchar

100

SEO konten

4

isi_konten

text

-

5

status

varchar

50

6

tgl_posting

date

-

Tanggal submit konten

7

jam_posting

time

-

8

posting_oleh

varchar

100

9

gambar

varchar

100

Jam submit konten Pengguna yang memposting konten Gambar konten

Id konten

Isi dari konten Status dari konten

Kamus data untuk data komentar pengguna (pengunjung) Nama tabel

: tbl_komentar

Primary key

: id_komentar

Tabel 3.11 Kamus data untuk data komentar pengguna No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_komentar

integer

5

Id komentar

2

id_tarian

integer

5

Id tarian

3

id_konten

integer

5

Id konten

4

id_berita

integer

5

Id berita

5

isi_komentar

text

-

6

komentator

varchar

7

web_pribadi

varchar

8

label

varchar

9

tgl

date

10

jam

time

11

aktif

enum

12

email

varchar

Isi komentar Nama pengguna yang 100 berkomentar Alamat web / situs 100 pengguna 50 Label komentar Tanggal komentar disubmit Jam komentar disubmit Status komentar „Y‟,‟N‟ (aktif/non-aktif) Email pengguna 80 (pengunjung)


51 11.

Kamus data untuk modul-modul administrator Nama tabel

: tbl_modul

Primary key

: id_modul

Tabel 3.12 Kamus data untuk modul-modul administrator

12.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_modul

integer

5

Id modul

2

nama_modul

varchar

50

Nama modul

3

link

varchar

100

4

status

enum

5

Aktif

enum

Link modul Level user yang „user‟,‟admin dapat mengakses ‟,‟wartawan‟ modul „Y‟,‟N‟ Status modul

Kamus data untuk pelaporan user (pengunjung) Nama tabel

: tbl_pelaporan

Primary key

: id_laporan

Tabel 3.13 Kamus data untuk pelaporan user (pengunjung) No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_laporan

integer

5

Id pelaporan

2

id_tarian

integer

5

Id tarian

3

subjek

varchar

100

Link modul

4

pelapor

varchar

100

Level User

5

isi_pelaporan

text

-

6

website

varchar

100

Alamat web pengunjung

7

label

varchar

50

Label pelaporan

8

tanggal

date

-

Tanggal pelaporan

9

jam

time

-

Waktu/jam pelaporan

10

aktif

enum

11

email

varchar

80

Alamat email pelapor

12

link

varchar

150

Url yang dilaporkan

Pesan pelaporan

„Y‟,‟N‟ Status pelaporan


52 13.

Kamus data untuk topik forum diskusi Nama tabel

: tbl_topik

Primary key

: id_topik

Tabel 3.14 Kamus data untuk topik forum diskusi

14.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_topik

integer

5

Id topik forum

2

id_kateforum

integer

5

Id kategori forum

3

id_user

integer

5

Id user/pengguna

4

subjek

varchar

100

Judul topik forum

5

pesan

text

-

Pesan topik

6

tgl_topik

date

-

Tanggal topik diposting

7

jm_topik

time

-

8

dilihat

integer

9

edit_terakhir

datetime

10

aktif

enum

Waktu/jam topik diposting Berapa kali topik 5 dibaca/dilihat Tanggal dan jam perubahan terakhir „Y‟,‟N‟ Status topik (aktif atau tidak)

Kamus data untuk tanggapan forum diskusi Nama tabel

: tbl_tanggapan

Primary key

: id_tanggapan

Tabel 3.15 Kamus data untuk tanggapan forum diskusi No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_tanggapan

integer

5

Id tanggapan user

2

id_topik

integer

5

Id topik forum

3

id_user

integer

5

Id_user (pengguna)

4

tanggapan

text

-

Detail pesan tanggapan

5

tgl_tanggapan

date

-

6

jm_tanggapan

time

-

7

ubah_terakhir

datetime

-

Tanggal tanggapan dipost Waktu/jam tanggapan dipost Pengubahan terakhir


53 15.

Kamus data untuk counter pengunjung Nama tabel

: tbl_counter

Primary key

:-

Tabel 3.16 Kamus data untuk counter pengunjung

16.

No

Nama Field

Tipe Data

Ukuran

1

tgl

date

-

2

jml

integer

15

Keterangan Tanggal data pengunjung terakhir Total jumlah pengunjung

Kamus data untuk pesan atau saran dari pengunjung (contact us) Nama tabel

: tbl_hubungi

Primary key

: id_hubungi

Tabel 3.17 Kamus data untuk pesan atau saran dari pengunjung (contact us)

17.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_hubungi

integer

5

Id hubungi kami

2

nama

varchar

50

Nama pengunjung (user)

3

email

varchar

100

Alamat email pengunjung

4

website

varchar

50

Alamat web pengunjung

5

subjek

varchar

100

Judul / subjek pesan

6

pesan

text

-

Detail pesan dari user

7

tanggal

date

-

Tanggal user kirim pesan

Kamus data untuk statistik pengunjung Nama tabel

: tbl_statistik

Primary key

:-

Tabel 3.18 Kamus data untuk statistik pengunjung No

Nama Field

Tipe Data

Ukuran

1

ip

varchar

20

2

tgl

date

-

Keterangan Ip user online Tanggal user online


54 Tabel 3.18 Kamus data untuk statistik pengunjung ( lanjutan )

18.

3

hits

integer

10

Jumlah hits

4

online

varchar

255

-

Kamus data untuk banner Nama tabel

: tbl_banner

Primary key

: id_banner

Tabel 3.19 Kamus data untuk banner

19.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_banner

integer

5

2

judul

varchar

100

Judul banner

3

url

varchar

100

Url banner

4

gambar

varchar

100

Gambar banner

5

Tgl_posting

date

-

Id banner

Tanggal banner diposting

Kamus data untuk id tarian dan id ragam gerak tarian Nama tabel

: tbl_ragam_tarian

Primary key

: id_ragamtarian

Tabel 3.20 Kamus data untuk id tarian dan id ragam gerak tarian

20.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_ragamtarian

integer

5

Id ragam (bagian) tarian

2

id_tarian

integer

5

Id tarian

3

id_bagtari

integer

5

Id bagian tari (ragam)

Kamus data untuk video tarian Nama tabel

: tbl_video

Primary key

: id_video

Tabel 3.21 Kamus data untuk video tarian


55

21.

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_video

integer

5

Id video

2

id_tarian

integer

5

Id tarian daerah

3

id_provinsi

integer

5

Id provinsi asal tarian

4

nama_video

varchar

100

Nama video tarian

5

video_seo

varchar

100

SEO video tarian

6

deskripsi

text

-

Detail video tarian

7

video

varchar

100

Nama file video tersimpan

8

gambar

varchar

100

Gambar(icon) video tarian

9

ukuran

datetime

-

Ukuran file video tarian

Kamus data untuk profil pengguna (user) Nama tabel

: tbl_profil

Primary key

: id_profil

Tabel 3.22 Kamus data untuk profil pengguna No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_profil

integer

5

Id profil pengguna

2

id_user

integer

5

Id user / pengguna

3

tgl_lahir

varchar

100

Tanggal lahir pengguna

4

gender

varchar

50

Jenis kelamin pengguna

5

website

varchar

100

Alamat web pribadi pengguna

6

foto

varchar

100

Foto profil pengguna

7

facebook

varchar

100

Akun facebook pengguna

8

twitter

varchar

100

9

ym

varchar

100

10

alamat

varchar

150

11

aboutme

text

-

Akun twitter pengguna Akun yahoo messenger pengguna Alamat tampat tinggal pengguna Tentang pengguna

12

tampil

enum

„Y‟,‟N‟ Tampilkan detail profil


56 22.

Kamus data untuk polling pengunjung Nama tabel

: tbl_polling

Primary key

: id_polling

Tabel 3.23 Kamus data untuk polling pengunjung

23.

No

Nama Field

Tipe Data

Ukuran

1

id_polling

integer

5

2

pilihan

varchar

100

3

rating

integer

5

4

aktif

enum

„Y‟,‟N‟

Keterangan Id polling Pilihan polling pengunjung Rating (penilaian) user Status pilihan polling

Kamus data untuk unduh dokumen (file) Nama tabel

: tbl_unduh

Primary key

: id_unduh

Tabel 3.24 Kamus data untuk unduh dokumen (file)

3.3.2

No

Nama Field

Tipe Data

Ukuran

Keterangan

1

id_unduh

integer

5

2

judul

varchar

100

Judul file unduhan

3

nama_file

varchar

100

Nama dokumen unduhan

4

tanggal

date

-

Tanggal file diunggah

5

hits

integer

5

Jumlah hits file unduhan

Id unduhan

Perancangan Pemodelan Pemodelan adalah gambaran dari realita yang sederhana yang dituangkan

dalam bentuk pemetaan tertentu. Pemodelan perangkat lunak digunakan untuk mempermudah langkah berikutnya dari pengembangan sistem sehingga lebih terencana. 3.3.3.1 Use Case Diagram


57 Use Case Diagram adalah teknik untuk mendapatkan functional requirement dari sebuah sistim. Use Case lebih menggambarkan interaksi antara pengguna dan sistem, menjelaskan secara naratif bagaimana sistem akan digunakan. Berikut ini adalah use case diagram dari aplikasi ensiklopedia tari daerah berbasis web yang akan dibuat. Berikut adalah use case dari aplikasi ensiklopedia tari daerah berbasis web dengan aktor user (pengunjung), wartawan dan admin.

Gambar 3.2 Use Case Diagram


58 Dari use case diagram di atas akan dijelaskan dalam skenario-skenario di bawah ini. Tabel 3.25 Skenario use case log in ke aplikasi ensiklopedia berbasis web Use Case

Log in ke aplikasi ensiklopedia berbasis web

Actor Deskripsi

User (Pengunjung Web), Wartawan dan Administrator 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User memilih link Log In pada sisi kiri atas. 3. Sistem akan menampilkan form login dan registrasi pada layar browser user. 4. User memasukkan username dan kata sandi (password) 5. User memilih link Log In. 6. Sistem akan menampilkan halaman utama aplikasi dan menampilkan nama lengkap pengguna di sisi kiri atas yang berarti user sudah masuk ke sistem.

Tabel 3.26 Skenario use case register (registrasi) di aplikasi ensiklopedia berbasis web Use Case

Register (registrasi) di aplikasi ensiklopedia berbasis web

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User memilih tombol Register Now pada sisi kiri atas. 3. Sistem akan menampilkan form login dan registrasi pada layar browser user. 4. User memasukkan nama lengkap, username, email, password dan konfirmasi password. 5. Centang untuk pilihan Mendaftar jadi wartawan(informan), jika user ingin menjadi wartawan. 6. User memilih tombol Sign Up 7. Sistem akan mengecek semua kolom ( field ) dan menyimpan semua data-data user ke dalam database db_taripedia pada tabel tbl_user.


59 Tabel 3.26 Skenario use case register (registrasi) di aplikasi ensiklopedia berbasis web (lanjutan) 8. Sistem akan menampilkan kembali form login dan registrasi.

Tabel 3.27 Skenario use case membaca informasi atau deskripsi tarian daerah Use Case

Membaca informasi atau deskripsi tarian daerah

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User memilih menu Tarian pada menubar di sisi atas. 3. Sistem akan menampilkan daftar semua tari-tarian daerah yang tersimpan dalam database ( dari A – Z ). 4. User menyorot daftar tarian lalu memilih tarian yang akan dibaca informasinya dengan memilih tombol [ Lihat ]. 5. Sistem akan menampilkan detail informasi tari daerah yang dipilih oleh user.

Alternatif

1. User juga dapat membaca detail informasi tari daerah melalui gambar slider yang ada pada halaman beranda ( depan ) dengan cara meng-klik gambar slide yang sedang ditampilkan. 2. Sistem akan menampilkan detail dari tari daerah yang dipilih user.

Tabel 3.28 Skenario use case mencari tarian daerah dengan pencarian cepat. Use Case Mencari tarian daerah dengan pencarian cepat Actor User (Pengunjung Web) dan Wartawan Deskripsi 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User memasukkan kata kunci pencarian pada form pencarian cepat ( quick search ) di sisi kanan atas setiap halaman. 3. User memilih tombol Search untuk mulai pencarian tari daerah. 4. Sistem akan melakukan query pada tabel tbl_tarian terhadap field nama_tarian dan deskripsi1. 5. Sistem

akan

menampilkan

hasil

pencarian

berdasarkan kata kunci ( key word ) yang diinput.


tari

daerah

60 Tabel 3.28 Skenario use case mencari tarian daerah dengan pencarian cepat (lanjutan) Alternatif 1. User membuka form pencarian lanjutan ( advanced search )di sisi kanan atas setiap halaman dengan memilih tombol „Klik disini‟. 2. Sistem

akan

melakukan

query

pada

tabel

tbl_tarian,

tbl_provinsi, tbl_pulau, dan tbl_kategori yang kemudian menampilkan hasil pencarian tersebut jika data ditemukan, jika data tidak ditemukan aplikasi akan menampilkan pesan data tidak ditemukan dalam database.

Tabel 3.29 Skenario use case mencari dan membaca berita Use Case

Mencari dan membaca berita

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot menu Informasi dan memilih Berita pada menubar di sisi atas. 3. Sistem akan menampilkan daftar semua berita yang tersimpan dalam database sesuai tanggal tayangnya. 4. User memasukkan kata kunci untuk mencari berita yang akan dibaca dan klik tombol search. 5. Sistem akan menampilkan berita terkait kata kunci yang diinput oleh user. 6. User memilih berita dan membaca detail berita dengan memilih tombol [ Lihat ]. 7. Sistem akan menampilkan isi detail dari berita.

Alternatif

1. User juga dapat langsung membaca berita dari headline yang ditampilkan secara silde di halaman beranda ( home ).

Tabel 3.30 Skenario use case mencari dan membaca artikel Use Case

Mencari dan membaca artikel

Actor

User (Pengunjung Web) dan Wartawan


61

Tabel 3.30 Skenario use case mencari dan membaca artikel (lanjutan) Deskripsi 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot menu Informasi dan memilih Artikel pada menubar di sisi atas. 3. Sistem akan menampilkan daftar semua artikel yang terdapat dalam database taripedia. 4. User memasukkan kata kunci untuk mencari artikel yang akan dibaca dan klik tombol search. 5. Sistem akan menampilkan artikel terkait kata kunci yang diinput oleh user. 6. User memilih artikel dan membaca detail berita dengan memilih tombol [ Lihat ]. 7. Sistem akan menampilkan isi detail dari artikel.

Tabel 3.31 Skenario use case melihat galeri gambar tari daerah Use Case

Melihat galeri gambar tari daerah

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot menu Galeri dan memilih Gambar pada menubar di sisi atas. 3. Sistem akan menampilkan semua gambar tarian daerah yang terdapat dalam database taripedia. 4. User memilih tombol Play Slideshow untuk melihat gambar tari daerah dengan tampilan slideshow ( tampil otomatis satu per satu ). 5. User memilih tombol Next atau Previous Photo untuk melihat gambar satu per satu secara manual. 6. User memilih tombol Download Image untuk mengunduh ( download ) gambar tarian daerah yang sedang ditampilkan. 7. Sistem akan mengirimkan file gambar yang dipilih user untuk diunduh ke lokal disk komputer user.


62 Tabel 3.32 Skenario use case melihat galeri video tari daerah Use Case

Melihat galeri video tari daerah

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot menu Galeri dan memilih Video pada menubar di sisi atas. 3. Sistem akan menampilkan semua video tarian daerah yang terdapat dalam database taripedia. 4. User memilih video dengan meng-klik icon video yang ada didaftar galeri. 5. Sistem akan menampilkan video yang dipilih user dalam ukuran yang diperbesar. 6. User akan menutup jendela video yang telah diputar dan kembali ke halaman galeri video.

Tabel 3.33 Skenario use case memberi komentar di dalam detail tarian, berita dan artikel. Use Case

Memberi komentar didalam detail tarian, berita dan artikel

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User membuka menu yang akan dikomentari ( tarian, berita atau artikel ). 3. Sistem akan menampilkan detail informasi dari tarian, berita atau artikel yang dipilih. 4. User menuju bagian bawah detail informasi untuk memberi komentar di form komentar pengunjung. 5. User memasukkan nama lengkap, website dan pesan ( komentar ). 6. User memasukkan kode pengaman ( captcha ) di sisi bawah komentar. 7. User memilih tombol Kirim untuk memposting komentar.


63 Tabel 3.33 Skenario use case memberi komentar di dalam detail tarian, berita dan artikel (lanjutan) Alternatif

1. User juga dapat memberi komentar pada berita, artikel atau detail tarian dengan memilih tombol Komentar yang ada disetiap daftar berita, artikel atau tarian. 2. Sistem akan menampilkan form komentar pengunjung pada detail informasi yang dipilih ( berita, artikel atau tarian ).

Tabel 3.34 Skenario use case mengikuti jajak pendapat ( polling ) Use Case

Mengikuti jajak pendapat ( polling )

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot form polling tarian pada sisi kanan bawah di layar. 3. User memilih salah satu pilihan dari jajak pendapat. 4. User memilih tombol Vote untuk memasukkan suara. 5. Sistem akan menambahkan suara pada tarian yang dipilih user dan menampilkan hasil sementara jajak pendapat.

Tabel 3.35 Skenario use case menambahkan berita baru Use Case

Menambahkan berita baru

Actor Deskripsi

Wartawan 1. Wartawan membuka aplikasi ensiklopedia menggunakan browser. 2. Wartawan log in ( masuk ) ke aplikasi ensiklopedia web melalui link Log In di sisi kiri atas. 3. Wartawan memasukkan username dan kata sandi ( password ) sebagai wartawan. 4. Wartawan memilih link Log In untuk masuk. 5. Sistem memverifikasi username dan password, kemudian menampilkan halaman beranda ( home ). 6. Wartawan menyorot menu Informasi dan memilih opsi Berita.


64 Tabel 3.35 Skenario use case menambahkan berita baru (lanjutan) 7. Sistem akan menampilkan daftar semua berita. 8. Wartawan memilih tombol Tambah di sisi kanan atas bagian berita. 9. Sistem akan menampilkan form input berita pada halaman administrator. 10. Wartawan memasukkan judul, kategori berita, pilihan headline, isi berita dan gambar ( jika diperlukan ). 11. Wartawan memilih tombol Simpan untuk menyimpan berita. 12. Sistem akan menyimpan data berita yang diinput wartawan pada tabel tbl_berita dengan status Draf. Alternatif

1. Wartawan juga dapat menuju ke halaman administrator untuk menambahkan berita melalui link yang ada di bagian footer ( bawah ) yaitu link Halaman Admin. 2. Sistem akan menampilkan halaman administrator sesuai otorisasi wartawan.

Tabel 3.36 Skenario use case verifikasi berita yang diinput oleh wartawan Use Case

Verifikasi berita yang diinput oleh wartawan

Actor Deskripsi

Administrator ( Admin ) 1. Admin membuka aplikasi ensiklopedia menggunakan browser. 2. Admin log in (masuk) ke aplikasi ensiklopedia web melalui link Log In di sisi kiri atas. 3. Admin memasukkan username dan kata sandi (password). 4. Admin memilih link Log In untuk masuk. 5. Sistem memverifikasi username dan password, kemudian menampilkan halaman beranda (home). 6. Admin menyorot menu Informasi dan memilih opsi Berita. 7. Sistem akan menampilkan daftar semua berita. 8. Admin memilih tombol Lihat di sisi kanan atas bagian berita. 9. Sistem akan menampilkan daftar berita pada halaman


65 Tabel 3.36 Skenario use case verifikasi berita yang diinput oleh wartawan (lanjutan) administrator. 10. Admin memilih berita yang berstatus Draf dengan menekan tombol Edit ( Ubah ) dan memverifikasi berita tersebut. 11. Sistem akan menampilkan form edit berita. 12. Admin memverifikasi judul, kategori, isi berita dan tanggal tayang. 13. Admin memilih tombol Simpan untuk menyimpan hasil verifikasi berita. 14. Sistem menyimpan hasil verifikasi berita dan menampilkan berita pada halaman pengunjung sesuai tanggal tayangnya. Alternatif

1. Admin dapat juga menuju ke halaman administrator melalui link di bagian footer (bawah) pada link halaman admin.

Tabel 3.37 Skenario use case menghubungi penulis web (Hubungi kami) Use Case

Menghubungi penulis web (Hubungi Kami)

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot menu Hubungi Kami pada menubar di sisi atas. 3. Sistem akan menampilkan form hubungi kami. 4. User memasukkan nama lengkap, alamat email, website, subjek dan isi pesan. 5. User memilih tombol Kirim untuk mengirim saran atau pesan. 6. Sistem akan menyimpan data pesan atau saran ke dalam tabel tbl_hubungi.

Tabel 3.38 Skenario use case bermain kuis taripedia Use Case

Bermain kuis taripedia

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User menyorot menu Ekstra dan memilih opsi Kuis pada


66 Tabel 3.38 Skenario use case bermain kuis taripedia (lanjutan) menubar di sisi atas. 3. Sistem akan menampilkan halaman kuis taripedia. 4. User memilih link „disini‟ untuk menampilkan flash kuis taripedia. 5. Sistem menampilkan flash kuis taripedia di sisi tengah. 6. User mulai bermain kuis dengan memilih tombol „Start‟. 7. Sistem menampilkan flash pertanyaan satu per satu. 8. User memilih opsi jawaban yang disediakan satu per satu, dilanjutkan dengan memilih tombol „Submit‟. 9. Sistem akan menampilkan hasil ( result ) permainan kuis taripedia diakhir flash dengan menampilkan total skor. 10. User memilih tombol Review untuk melihat ulasan hasil permainan kuis. 11. User memilih tombol Print untuk mencetak hasil permainan kuis. 12. User memilih tombol Exit untuk menutup flash kuis taripedia.

Tabel 3.39 Skenario use case mengunduh file dari aplikasi ensiklopedia Use Case

Mengunduh file dari aplikasi ensiklopedia berbasis web

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User memilih tombol Unduh pada menubar di sisi atas. 3. Sistem menampilkan halaman unduh pada sisi kiri. 4. User

memilih file yang

ingin diunduh dari aplikasi

ensiklopedia dengan menekan link pada nama file atau icon unduh. 5. Sistem akan mentransfer file terkait untuk disimpan di lokal komputer user.


67 Tabel 3.40 Skenario use case berkomentar (memberi tanggapan) dan posting topik di forum diskusi Use Case

Memberi komentar dan menambahkan topik di forum diskusi

Actor Deskripsi

User (Pengunjung Web) dan Wartawan 1. User membuka aplikasi ensiklopedia menggunakan browser. 2. User melakukan login ke sistem dengan memilih tombol Login dan memasukkan username dan password. 3. User menyorot menu Ekstra dan memilih opsi Forum pada menubar di sisi atas. 4. Sistem menampilkan halaman forum pada sisi kiri. 5. User memilih salah satu kategori topik forum dengan memilih judul dan meng-kliknya. 6. Sistem akan menampilkan topik-topik yang berkaitan dengan kategori yang dipilih. 7. User memilih salah satu topik yang tersedia. 8. Sistem menampilkan detail diskusi pada topik yang dipilih pengguna dengan beberapa tanggapan / komentar dari pengunjung lainnya. 9. User memilih tombol reply untuk menambahkan komentar / tanggapan pada topik terkait. 10. Sistem menampilkan form input / tambah tanggapan. 11. User menginput isi komentar / tanggapan. 12. Sistem menampilkan topik dan tanggapan-tanggapan terkait.

Alternatif

1. User dapat juga menambahkan topik dan tanggapan dengan memilih tombol di kanan atas masing-masing tabel topik dan tanggapan. 2. User dapat merubah (mengedit) topik forum dengan memilih tombol Edit pada sisi kanan di setiap topik forum.


68 3.3.3.2 Activity Diagram

Activity diagram adalah representasi grafis dari alur kerja tahapan aktifitas. Activity diagram dapat digunakan untuk menjelaskan bisnis dan alur kerja operasional secara step by step dari komponen suatu sistem. Activity diagram menunjukkan keseluruhan dari aliran kontrol. Berikut ini activity diagram yang akan digunakan dalam aplikasi ensiklopedia tari daerah berbasis web. 1.

Activity diagram log in ke aplikasi ensiklopedia berbasis web Pada saat awal aplikasi ensiklopedia berbasis web ini dibuka menggunakan browser akan muncul disetiap halaman sisi kiri atas link login untuk menuju ke form login dan register. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.

Gambar 3.3 Activity diagram log in ke aplikasi ensiklopedia berbasis web

2.

Activity diagram register di aplikasi ensiklopedia berbasis web Pada form yang sama, kita dapat mengakses form register. Yaitu dengan mengakses link Register Now disisi kiri atas setiap halaman. Pada form register pengunjung dapat mendaftarkan diri sebagai user atau sebagai


69 wartawan. Sistem akan menyimpan semua data-data yang diinput user di form ini ke dalam tabel tbl_user.

Gambar 3.4 Activity diagram register di aplikasi ensiklopedia berbasis web

3.

Activity diagram membaca informasi atau deskripsi tarian daerah Pada menu utama diatas, user memilih menu Tarian kemudian sistem akan menampilkan halaman daftar semua tarian yang diurutkan berdasarkan abjad. Pada halaman tarian ini user dapat memilih tarian yang akan dibaca detail informasinya dengan cara memilih link [ Lihat ] atau dengan meng-klik nama tarian yang ada. Setelah itu sistem akan menampilkan isi detail dari tarian berupa informasi-informasi penting, deskripsi dan ragam-ragam gerak serta informasi pendukung lainnya. Proses tersebut dapat digambarkan dengan activity diagram berikut ini.


70

Gambar 3.5 Activity diagram membaca informasi atau deskripsi tarian daerah

4.

Activity diagram mencari tarian daerah dengan pencarian cepat dan lanjutan Pada menu sisi kanan disetiap halaman aplikasi ensiklopedia akan dimunculkan form pencarian (quick atau advanced search). Pencarian cepat (quick) yaitu pencarian menggunakan kata kunci dengan mencocokkan pola kata terhadap field nama_tarian dan deskripsi pada tabel tarian daerah. Sedangkan pencarian lanjutan (advanced) adalah pencarian dengan menggunakan beberapa kategori untuk mempersempit pemfilteran yaitu seperti penambahan kategori pulau, provinsi dan kategori tarian. Proses tersebut dapat digambarkan dengan activity diagram di bawah ini.


71

Gambar 3.6 5.

Activity diagram mencari tarian daerah dengan kata kunci pencarian

Activity diagram mencari dan membaca berita Pada menu utama, user menyorot menu Informasi dan memilih Berita dan kemudian sistem akan menampilkan semua berita yang tersimpan dalam database dan menampilkan sesuai tanggal tayangnya. Jika user ingin mencari berita tertentu, user dapat mencari menggunakan form pencarian yang terletak diposisi atas berita, dengan cara memasukkan kata kunci pada form kemudian sistem akan memfilter judul berita terkait kata kunci tersebut. Setelah memilih berita yang akan dibaca, user dapat memilih link tombol [Lihat] pada sisi kanan berita untuk membaca isi berita lebih detail. Atau juga user dapat membuka detail berita dengan langsung meng-klik judul berita. Proses tersebut dapat digambarkan dengan activity diagram di bawah ini.


72

Gambar 3.7Activity diagram mencari dan membaca berita

6.

Activity diagram mencari dan membaca artikel Pada menu utama, user menyorot menu Informasi dan memilih Artikel dan kemudian sistem akan menampilkan semua artikel yang tersimpan dalam database dan menampilkan sesuai tanggal tayangnya. Jika user ingin mencari artikel tertentu, user dapat mencari menggunakan form pencarian yang terletak diposisi atas artikel, dengan cara memasukkan kata kunci pada form kemudian sistem akan memfilter judul artikel terkait kata kunci tersebut. Setelah memilih artikel yang akan dibaca, user dapat memilih link tombol [Lihat] pada sisi kanan artikel untuk membaca isi artikel lebih detail. Atau juga user dapat membuka detail berita dengan langsung meng-klik judul artikel. Proses tersebut dapat digambarkan dengan activity diagram di bawah ini.


73

Gambar 3.8Activity diagram mencari dan membaca artikel

7.

Activity diagram melihat galeri gambar tari daerah Pada menu utama, user menyorot menu Galeri dan kemudian memilih opsi Gambar. Selanjutnya sistem akan menampilkan semua gambar tari-tarian daerah. Pada halaman galeri gambar ini, user dapat menampilkan semua gambar tari-tarian daerah dengan tampilan slideshow dan juga tampilan manual dengan tombol next dan previous photo. Selain itu user juga dapat mengunduh (download) gambar tari-tarian daerah dengan cara memilih tombol Download Image pada sisi kanan bawah. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


74

Gambar 3.9Activity diagram melihat galeri gambar tari daerah 8.

Activity diagram melihat galeri video tari daerah Pada menu utama, user menyorot menu Galeri dan kemudian memilih opsi Video. Kemudian sistem akan menampilkan semua video tari-tarian daerah. Pada halaman galeri video ini, user dapat memainkan video dengan memilih salah satu icon video yang ada, kemudian sistem akan memainkan video dengan tampilan layar diperbesar. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


75

Gambar 3.10 Activity diagram melihat galeri video tari daerah 9.

Activity diagram memberi komentar di dalam detail tarian, berita dan artikel Pada setiap menu tarian, berita atau artikel, user dapat memilih tombol untuk berkomentar yaitu tombol [Komentar] yang berada disisi kanan. Dengan link tombol ini, sistem akan mengarahkan user pada form komentar yang berada dimasing-masing detail informasi (tarian, berita atau artikel). Dalam form komentar ini user memasukkan nama, website, isi pesan dan juga kode pengaman (captcha). Setelah itu sistem akan menyimpan data komentar user dan menampilkannya disetiap detail informasi tarian, berita atau artikel. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


76

Gambar 3.11 Activity diagram memberi komentar di dalam detail tarian, berita dan artikel 10. Activity diagram mengikuti jajak pendapat ( polling ) Pada setiap halaman aplikasi ensiklopedia berbasis web ini, akan ditampilkan form jajak pendapat yang terletak di sisi kanan bawah halaman. Pada form ini user atau pengunjung web dapat mengikuti jajak pendapat / polling yang sedang diadakan oleh pengelola web. User hanya memilih salah satu pilihan polling yang tersedia dan kemudian memilih tombol vote untuk menyimpannya. Sistem akan menyimpan dan mengakumulasikan data polling terakhir, dan menampilkan hasil polling dalam bentuk diagram bar. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


77

Gambar 3.12 Activity diagram mengikuti jajak pendapat ( polling ) 11. Activity diagram menambahkan berita baru Untuk menambahkan berita user diharuskan untuk login ke aplikasi, yaitu melalui link Log In yang ada disisi kiri atas setiap halaman aplikasi. Link log in tersebut mengarahkan user pada form login dan register, pada form tersebut user diharuskan memasukkan username dan password (kata sandi). Setelah diverifikasi oleh sistem dan login berhasil berarti user sudah masuk log sebagai wartawan, selanjutnya user dapat memilih menu Informasi dan opsi Berita pada menu utama. Pada halaman berita, user memilih tombol Tambah untuk membuka form input berita. Sistem akan menampilkan form input berita yang ada pada halaman administrator, dan tentunya dengan otorisasi yang sudah dibatasi yaitu sebagai wartawan. Pada form tersebut, wartawan menginput judul berita, kategori berita, headline, isi berita dan juga gambar jika diperlukan. Setelah itu wartawan diharuskan memilih tombol Simpan untuk menyimpan berita. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


78

Gambar 3.13 Activity diagram menambahkan berita baru 12. Activity diagram verifikasi berita yang diinput oleh wartawan Untuk melakukan verifikasi berita diharuskan log in ke aplikasi sebagai admin (administrator) dengan memilih link Login yang ada disisi kiri atas setiap halaman, kemudian input username dan password. Selanjutnya admin harus masuk ke halaman administrator dengan memilih link tombol yang ada diarea footer. Sistem akan menampilkan hamalan administrator, dan admin memilih berita dengan status Draf atau berita yang akan direview, dilanjutkan dengan memilih tombol Edit disisi kanan berita. Kamudian sistem akan menampilkan form editor berita, dan pada form ini admin akan memverifikasi berita sekaligus merubah status dari Draf ke Tayang atau Tidak layak, dan diakhir review admin diharuskan memasukkan tanggal tayang berita. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


79

Gambar 3.14 Activity diagram memverifikasi berita yang diinput oleh wartawan 13. Activity diagram menghubungi penulis web ( Hubungi kami ) Untuk menyampaikan pertanyaan atau saran user perlu masuk ke menu Hubungi Kami pada menu utama aplikasi. Selanjutnya sistem akan menampilkan form hubungi kami yang harus dilengkapi oleh user. User harus memasukkan nama, alamat email, website dan isi pesan / saran. Langkah terakhir user memilih tombol Kirim untuk mengirim pesan atau pertanyaan tersebut. Dan secara otomatis sistem akan menyimpan data tersebut dalam database pada tabel tbl_hubungi. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


80

Gambar 3.15 Activity diagram menghubungi penulis web ( Hubungi kami ) 14. Activity diagram bermain kuis taripedia Selain mendapatkan informasi-informasi penting, di aplikasi ensiklopedia berbasis web ini, user juga dapat bermain kuis yang bertujuan untuk menambah wawasan dan pengetahuan serta mengenal budaya bangsa lebih dalam lagi. Tahapannya yaitu user memilih menu Ekstra dan memilih opsi Kuis pada menu utama. Setelah itu sistem akan menampilkan halaman Kuis Taripedia, dan user diharuskan memilih link tombol „disini‟ untuk menampilkan kuis dengan tampilan flash. Selanjutnya user menjawab satu per satu pertanyaan yang ditampilkan dan sistem akan mengakumulasi poin serta menampilkan hasil akhir permainan kuis tersebut diakhir flash. Dari hasil akhir permainan user dapat meninjau ulang (review) jawaban-jawaban yang sudah dijawab sebelumnya, atau user dapat mencetak hasil dari kuis tersebut. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


81

Gambar 3.16 Activity diagram bermain kuis taripedia 15. Activity diagram mengunduh file dari aplikasi ensiklopedia Dalam aplikasi ensiklopedia berbasis web ini dilengkapi juga dengan halaman khusus untuk mengunduh file atau dokumen yang dapat diakses oleh siapapun dan tanpa register (gratis). Langkahnya yaitu user masuk ke menu Unduh pada menu utama. Setelah itu sistem akan menampilkan halaman unduh, dan user dapat langsung memilih file atau dokumen yang akan diunduh dengan mengklik icon file atau nama file. Proses tersebut dapat digambarkan dengan activity diagram dibawah ini.


82

Gambar 3.17 Activity diagram mengunduh file dari aplikasi ensiklopedia 16. Activity diagram memberi komentar (tanggapan) dan menambahkan topik di forum diskusi Fitur lainnya yang menarik dari aplikasi ensiklopedia berbasis web ini yaitu forum diskusi yang telah disediakan. User (pengguna) atau wartawan dapat berbagi informasi melalui forum diskusi taripedia ini. Dalam fitur ini disediakan fasilitas untuk posting topik baru dan juga tanggapan (komentar) pada form yang sudah disediakan. Diharapkan fitur aplikasi ini dapat membantu para pengguna, wartawan maupun admin web ini untuk dapat berbagi informasi, kritik dan saran yang dapat membangun dan ikut serta dalam upaya melestarikan kebudayaan daerah di Indonesia khususnya taritarian daerah. Proses dalam fitur forum diskusi ini dapat digambarkan dengan activity diagram dibawah ini.


83

Gambar 3.18 Activity diagram menambah dan mengubah topik forum


84

Gambar 3.19 Activity diagram menambah, mengubah dan menghapus tanggapan 3.3.3.3 Sequence Diagram Sequence diagram menggambarkan interaksi antar objek di dalam dan di sekitar sistem (termasuk pengguna, display, dan sebagainya) berupa message yang digambarkan terhadap waktu. Sequence diagram terdiri atas dimensi vertikal (waktu) dan dimensi horizontal (objek-objek yang terkait). Berikut ini sequence diagram yang akan digunakan dalam aplikasi ensiklopedia tari daerah berbasis web.


85 1.

Sequence diagram log in ke aplikasi ensiklopedia tari daerah berbasis web Gambar dibawah ini menggambarkan sequence diagram log in ke aplikasi ensiklopedia tari daerah berbasis web.

Gambar 3.20 Sequence diagram log in ke aplikasi ensiklopedia tari daerah berbasis web 2.

Sequence diagram register di aplikasi ensiklopedia tari daerah berbasis web Gambar dibawah ini menggambarkan sequence diagram register ke aplikasi ensiklopedia berbasis web

Gambar 3.21 Sequence diagram register di aplikasi ensiklopedia berbasis web


86 3.

Sequence diagram membaca informasi atau deskripsi tarian daerah Gambar dibawah ini menggambarkan sequence diagram membaca informasi atau deskripsi tarian daerah

Gambar 3.22 Sequence diagram membaca informasi atau deskripsi tarian daerah 4.

Sequence diagram mencari tarian daerah dengan pencarian cepat dan lanjutan Gambar dibawah ini menggambarkan sequence diagram membaca informasi atau deskripsi tarian daerah

Gambar 3.23 Sequence diagram mencari tarian daerah dengan pencarian cepat dan lanjutan


87 5.

Sequence diagram mencari dan membaca berita Gambar dibawah ini menggambarkan sequence diagram mencari dan membaca berita.

Gambar 3.24 Sequence diagram mencari dan membaca berita 6.

Sequence diagram mencari dan membaca artikel Gambar dibawah ini menggambarkan sequence diagram mencari dan membaca artikel.

Gambar 3.25 Sequence diagram mencari dan membaca artikel


88 7.

Sequence diagram melihat galeri gambar tari daerah Gambar dibawah ini menggambarkan sequence diagram melihat galeri gambar tari daerah.

Gambar 3.26 Sequence diagram melihat galeri gambar tari daerah

8.

Sequence diagram melihat galeri video tari daerah Gambar dibawah ini menggambarkan sequence diagram melihat galeri video tari daerah.

Gambar 3.27 Sequence diagram melihat galeri video tari daerah


89 9.

Sequence diagram memberi komentar di dalam detail tarian, berita dan artikel Gambar dibawah ini menggambarkan sequence diagram memberi komentar di dalam detail tarian, berita dan artikel.

Gambar 3.28 Sequence diagram memberi komentar di dalam detail tarian, berita dan artikel 10. Sequence diagram mengikuti jajak pendapat ( polling ) Gambar dibawah ini menggambarkan sequence diagram mengikuti jajak pendapat ( polling ).


90

Gambar 3.29 Sequence diagram mengikuti jajak pendapat ( polling )

11. Sequence diagram menambahkan berita baru Gambar dibawah ini menggambarkan sequence diagram menambahkan berita baru.

Gambar 3.30 Sequence diagram menambahkan berita baru


91 12. Sequence diagram verifikasi berita yang diinput oleh wartawan Gambar dibawah ini menggambarkan sequence diagram verifikasi berita yang diinput oleh wartawan.

Gambar 3.31 Sequence diagram verifikasi berita yang diinput oleh wartawan

13. Sequence diagram menghubungi penulis web ( Hubungi kami ) Gambar dibawah ini menggambarkan sequence diagram menghubungi penulis web ( Hubungi kami )


92

Gambar 3.32 Sequence diagram menghubungi penulis web ( Hubungi kami ) 14. Sequence diagram bermain kuis taripedia Gambar dibawah ini menggambarkan sequence diagram bermain kuis taripedia.

Gambar 3.33 Sequence diagram bermain kuis taripedia


93 15. Sequence diagram mengunduh file dari aplikasi ensiklopedia Gambar dibawah ini menggambarkan sequence diagram mengunduh file dari aplikasi ensiklopedia.

Gambar 3.34 Sequence diagram mengunduh file dari aplikasi ensiklopedia 16. Sequence diagram memposting topik dan tanggapan pada forum diskusi Gambar dibawah ini menggambarkan sequence diagram mengunduh file dari aplikasi ensiklopedia.

Gambar 3.35 Sequence diagram menambah dan mengubah topik


94

Gambar 3.36 Sequence diagram menambah dan mengubah tanggapan

3.3.3 Perancangan Antarmuka (Interface)

Berikut ini akan dijelaskan untuk rancangan antarmuka pengguna (User Interface) aplikasi ensiklopedia tari daerah berbasis web. Berikut ini perancangan awal yang dibuat untuk aplikasi ensiklopedia tari daerah berbasis web (Gambar 3.41).


95

Gambar 3.37 Kerangka Awal Aplikasi ensiklopedia tari daerah berbasis web

3.3.4.1 Desain Halaman Utama (Beranda) Halaman Utama (Beranda) merupakan halaman yang pertama kali ditampilkan ketika aplikasi ensiklopedia tari daerah berbasis web ini dibuka oleh user atau pengunjung menggunakan browser. Beranda (index.php) dari aplikasi web ini berisi kata sambutan (selamat datang) dan menu-menu utama yang dapat dipilih pengguna untuk melihat berbagai macam informasi yang ada di dalamnya. Selain itu, halaman utama ini menyajikan berbagai ringkasan informasi misalnya yaitu slide image atau gambar tarian yang ditampilkan berdasarkan banyaknya jumlah pembaca, headline berita berdasarkan tanggal dan jam inputan, ringkasan tarian terpopuler, ringkasan komentar, ringkasan kategori tarian dan provinsi, ringkasan statistik pengunjung, form pencarian kata, serta form polling mengenai tarian daerah. Perancangan dari halaman utama aplikasi web ini ditunjukkan pada Gambar 3.42.


96

Gambar 3.38 Perancangan Halaman Utama (Beranda)

3.3.4.2

Desain Menu Log In dan Registrasi

Menu Login akan menampilkan form login bagi pengguna atau pengunjung yang akan masuk ke aplikasi ensiklopedia tari daerah berbasis web ini. Sedangkan menu register akan menampilkan registration form untuk pengguna atau pengunjung yang belum pernah mendaftarkan diri di aplikasi web ini. Perancangan form login dan registration form ditunjukkan pada Gambar 3.43.


97

Gambar 3.39 Form Log In and Register

3.3.4.3

Desain Halaman Administrator

Halaman Administrator merupakan halaman dimana semua konten dan modul yang ada di dalam aplikasi berbasis web ini dikelola (Manajemen Konten dan Modul). Halaman Administrator ini hanya dapat diakses dengan level otorisasi sebagai “Admin” yang sudah dikonfigurasikan pada beberapa file di dalam direktori “root_dir/admin/”, kecuali untuk menu tertentu pada halaman administrator masih dapat diakses oleh pengguna misalnya seperti Menu Berita dapat diakses oleh level “Wartawan” (Guna menambahkan berita atau informasi dari pengunjung) dan Menu Ganti Password yang dapat diakses oleh level “User” dan “Wartawan”. Halaman Administrator ini dirancang untuk mempermudah pekerjaan dari pengelola (admin) dan pengembang supaya lebih praktis dan nyaman pada saat menambah, mengubah (mengedit) dan menghapus data yang ada di dalam


98 database MySQL. Perancangan dari halaman administrator aplikasi web ini ditunjukkan pada Gambar 3.44.

Gambar 3.40 Halaman Administrator (Manajemen Konten dan Modul)

3.3.4.4

Desain Menu Berita Menu berita akan menampilkan ringkasan (daftar) data berita yang

tersimpan dalam database dan diurutkan berdasarkan tanggal dan jam yang terakhir (descending). Pada menu berita kita juga dapat mencari berita dengan memasukkan kata kunci pada form pencarian berita yang kemudian akan menampilkan data berita terkait kata kunci tersebut. Selain itu, pada menu berita ini akan menampilkan shortcut atau tombol “Tambah” untuk berbagi informasi atau berita terkait kebudayaan Indonesia (khususnya tari-tarian daerah) serta ditampilkan juga tombol “Ubah” (Edit) untuk mengubah informasi atau berita yang pernah diinput sebelumnya. Hal ini


99 ditujukan untuk memberikan peran aktif pengguna atau pengunjung web agar lebih komunikatif dan dinamis. Perancangan menu berita ditunjukkan pada Gambar 3.45.

Gambar 3.41 Menu Berita

3.3.4.5

Desain Menu Input Berita Menu input berita akan menampilkan form input berita pada halaman

administrator yang hanya dapat diakses dengan level user „admin‟ atau „wartawan‟. Otorisasi pada level wartawan hanya dapat menambahkan dan mengubah berita dari inputan wartawan itu sendiri, dan untuk tahap selanjutnya level admin yang akan memeriksa (review) dan menerbitkan (publish) berita tersebut. Perancangan form input berita untuk wartawan dan admin ditunjukkan pada Gambar 3.46.


100

Gambar 3.42 Menu (form) Input Berita di Halaman Administrator

3.3.4.6

Desain Menu Edit (Update) Berita Menu edit (update) berita ini akan menampilkan form untuk mengubah

(edit) data berita yang sudah diinput atau yang masih dalam status „Pratinjau‟. Pengubahan data berita ini dapat dilakukan oleh user dengan level admin atau wartawan yang membuat berita tersebut. Setiap wartawan mempunyai daftar berita masing-masing sesuai dengan levelnya. Perancangan form ubah atau edit berita dapat dilihat pada Gambar 3.47.


101

Gambar 3.43 Menu (form) Edit Berita di Halaman Administrator 3.3.4.7

Desain Menu Artikel Menu artikel akan menampilkan ringkasan (daftar) artikel pilihan yang

tersimpan dalam database dan diurutkan berdasarkan tanggal dan jam yang terakhir (descending). Pada menu artikel kita juga dapat mencari artikel dengan memasukkan kata kunci pada form pencarian artikel yang kemudian akan menampilkan data artikel terkait kata kunci tersebut. Perancangan menu artikel ini ditunjukkan pada Gambar 3.48.


102

Gambar 3.44 Menu Artikel pada Halaman Pengunjung

3.3.4.8

Desain Menu Galeri Gambar Menu galeri gambar akan menampilkan galeri semua gambar atau foto

tari-tarian daerah yang tersimpan dalam database dan diurutkan berdasarkan id_tarian yang terakhir (descending). Pada menu galeri pengunjung dapat melihat semua gambar dengan dua cara yaitu cara yang pertama dengan menekan tombol „Play Slideshow‟ kemudian gambar akan bergantian ditampilkan secara otomatis, sedangkan cara yang kedua adalah dengan menekan tombol „Next‟ atau „Previous‟ secara manual untuk menampilkan gambar satu per satu sesuai urutan. Selain itu, pengunjung juga dapat mengunggah gambar atau foto tarian daerah yang ditampilkan dengan menekan tombol „Download Image‟ pada kanan bawah. Perancangan menu galeri gambar ini ditunjukkan pada Gambar 3.49.


103

Gambar 3.45 Menu Galeri Gambar pada Halaman Pengunjung

3.3.4.9

Desain Menu Galeri Video Menu galeri video akan menampilkan galeri semua video tentang tari-

tarian daerah yang tersimpan dalam database dan diurutkan berdasarkan id_video. Pada menu galeri video pengunjung dapat melihat semua video dan memainkannya dengan dukungan VideoLightBox, jika icon video diklik akan menampilkan video sekaligus memainkannya dalam ukuran yang diperbesar. Perancangan menu galeri video ini ditunjukkan pada Gambar 3.50.


104

Gambar 3.46 Menu Galeri Video Pada Halaman Pengunjung 3.3.4.10 Desain Menu Bantuan Menu Bantuan akan menampilkan konten statis yang berisi text informasi tentang aplikasi ensiklopedia berbasis web dan juga beberapa informasi lainnya. Perancangan menu bantuan ini ditunjukkan pada Gambar 3.51.


105

Gambar 3.47 Menu Bantuan Aplikasi di halaman Pengunjung

3.3.4.11 Desain Menu Profil Menu profil akan menampilkan konten statis yang berisi text informasi ringkas tentang aplikasi ensiklopedia berbasis web dan tentang latar belakang penulis. Perancangan menu profil ini ditunjukkan pada Gambar 3.52.


106

Gambar 3.48 Menu Profil di halaman pengunjung 3.3.4.12 Desain Menu Hubungi Kami Menu Hubungi Kami akan menampilkan form yang disediakan bagi pengguna / pengunjung web yang ingin berkomunikasi secara langsung lewat email dengan syarat pengguna harus mengisikan beberapa kolom yang sudah disediakan. Perancangan menu hubungi kami ini ditunjukkan pada Gambar 3.53.


107

Gambar 3.49 Menu Hubungi Kami di halaman pengunjung 3.3.4.13 Desain Menu Forum Diskusi Menu Forum Diskusi ini akan menampilkan sebuah forum diskusi dalam aplikasi ensiklopedia tarian daerah ini untuk memfasilitasi para pengguna dalam berkomunikasi atau berbagi informasi penting lainnya khususnya tentang taritarian daerah. Perancangan menu forum diskusi ini ditunjukkan pada Gambar 3.54.


108

Gambar 3.50 Menu Forum Diskusi di halaman pengunjung 3.3.4.14 Desain Menu Tambah Topik Diskusi Menu ini akan menampilkan form untuk menambahkan topik dalam satu kategori diskusi tertentu. Perancangan menu tambah topik diskusi ini ditunjukkan pada Gambar 3.55.


109

Gambar 3.51 Menu Tambah Topik Diskusi di halaman pengunjung 3.3.4.15 Desain Menu Tambah Tanggapan (Komentar) Diskusi Menu ini akan menampilkan form untuk menambahkan tanggapan (komentar) dalam topik diskusi tertentu. Perancangan menu tambah tanggapan diskusi ini ditunjukkan pada Gambar 3.56.


110

Gambar 3.52 Menu Tambah Tanggapan Diskusi di halaman pengunjung


No title

Recommend Documents