PENGEMBANGAN WEBSITE KOMUNITAS STUDI KASUS : KOMUNITAS FOTOGRAFI
TUGAS AKHIR
Disusun sebagai salah satu syarat untuk kelulusan Program Strata 1, Program Studi Teknik Informatika, Universitas Pasundan Bandung
oleh : Agung Febry Darmawan nrp. 11.304.0202
PROGRAM STUDI TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS PASUNDAN BANDUNG JUNI 2015
DAFTAR ISI
ABSTRAK .....................................................................................................................
i
ABSTRACT ...................................................................................................................
ii
KATA PENGANTAR ....................................................................................................
iii
DAFTAR ISI ................................................................................................................
iv
DAFTAR TABEL .........................................................................................................
vi
DAFTAR GAMBAR .....................................................................................................
vii
DAFTAR LAMPIRAN .................................................................................................
viii
DAFTAR SIMBOL .......................................................................................................
ix
BAB 1 PENDAHULUAN 1.1
Latar Belakang ..............................................................................................
1-1
1.2
Identifikasi Masalah ......................................................................................
1-2
1.3
Tujuan ............................................................................................................
1-2
1.4
Batasan Masalah .............................................................................................
1-2
1.5
Metodologi Penelitian .....................................................................................
1-3
1.6
Sistematika Penulisan ....................................................................................
1-5
BAB 2 LANDASAN TEORI 2.1
Komunitas Fotografi .......................................................................................
2-1
2.2
Metode Waterfall ............................................................................................
2-5
2.3
MySQL ...........................................................................................................
2-6
2.4
SQL .................................................................................................................
2-7
2.5
Hypertext Preprocessor (PHP) ........................................................................
2-7
2.6
Apache ...........................................................................................................
2-7
2.7
HTTP(Hypertext Transfer Protocol)...............................................................
2-8
2.8
Website ..........................................................................................................
2-9
2.9
UML (Unified Modelling Language) .............................................................
2-9
BAB 3 ANALISIS DAN PERANCANGAN SISTEM 3.1
Kerangka Tugas Akhir (TA) .........................................................................
3-1
3.2
Analisis Sistem ...............................................................................................
3-2
3.2.1.
Analisis Sistem Yang Sedang berjalan .......................................................
3-2
3.2.2.
Kegiatan Komunitas Fotografi PT Telekomunikasi Indonesia...................
3-3
3.2.3
Analisis Kebutuhan Website ......................................................................
3-4
3.2.4
Fungsi Website ..........................................................................................
3-4
Fitur Website ...........................................................................................................
3-5
Analisis Pengguna (User) .............................................................................................
3-5
Analisis Kebutuhan Informasi .................................................................................
3-5
3.2.5 3.3 3.3.1.
3.4
Perancangan Sistem......................................................................................................
3-7
3.4.1
Use Case Diagram .....................................................................................................
3-7
3.4.2
Use Case Skenario ....................................................................................................
3-8
3.4.3
Activity Diagram ......................................................................................................
3-11
3.4.3.1
Activity Diagram Penambahan Event .........................................................
3-11
3.4.3.2
Activity Diagram berita / artikel ..................................................................
3-12
3.4.3.3
Activity Diagram upload gambar.................................................................
3-13
3.4.4. Sequence Diagram ....................................................................................................
3-14
3.4.5. Class Diagram ...........................................................................................................
3-15
3.5
Pemodelan Data ...........................................................................................................
3-17
3.6
Struktur Perancangan Program ...................................................................................
3-18
Halaman Utama Website(Frontend) .........................................................................
3-18
3.6.1
BAB 4 IMPLEMENTASI DAN PENGUJIAN 4.1
Implementasi ................................................................................................................
4-1
4.2
Implementasi SIstem ...................................................................................................
4-1
4.3
Kebutuhan Perangkat Keras ........................................................................................
4-1
4.4
Kebutuhan Perangkat Lunak .......................................................................................
4-1
4.5
Implementasi Database ................................................................................................
4-2
4.6
Implementasi Antarmuka ............................................................................................
4-5
4.6.1
Halaman Admin .......................................................................................................
4-5
4.6.2
Halaman utama .........................................................................................................
4-7
4.7
Pengujian Perangkat Lunak ........................................................................................
4-10
4.7.1
Pengujian Fungsional ................................................................................................
4-11
4.7.2
Kasus dan Hasil Pengujian ........................................................................................
4-11
BAB 6 KESIMPULAN DAN SARAN 5.1
Kesimpulan ..................................................................................................................
5-1
5.2
Saran .............................................................................................................................
5-1
DAFTAR PUSTAKA LAMPIRAN
DAFTAR GAMBAR
Gambar 1.1 Diagram Metodologi Penelitian ...............................................................................
1-4
Gambar 2.1 Waterfall Model (Sommerville,2003)......................................................................
2-7
Gambar 3.1 Skema Analisis .......................................................................................................
3-2
Gambar 3.2 Use Case Diagram ..................................................................................................
3-7
Gambar 3.3 Activity Diagram Penambahan Event .....................................................................
3-11
Gambar 3.4 Activity Diagram Penambahan Artikel ...................................................................
3-12
Gambar 3.5 Activity Diagram Upload Gambar ..........................................................................
3-13
Gambar 3.6 Sequnce Diagram Buat Akun ..................................................................................
3-14
Gambar 3.7 Sequence Diagram Melihat Informasi Konten ........................................................
3-14
Gambar 3.8 Sequence Diagram Komentar .................................................................................
3-15
Gambar 3.9 Class Diagram .........................................................................................................
3-16
Gambar 3.10 Struktur Menu Website (Frontend) ......................................................................
3-18
Gambar 3.11 Halaman Login (Backend) ....................................................................................
3-19
Gambar 3.12 Halaman Utama (Backend) ...................................................................................
3-19
Gambar 3.13 Halaman Utama (Frontend) ...................................................................................
3-20
Gambar 3.14 Halaman Galleri ....................................................................................................
3-21
Gambar 3.15 Halaman Berita .....................................................................................................
3-22
Gambar 3.16 Halaman Event.......................................................................................................
3-23
Gambar 4.1 Tabel Admin ...........................................................................................................
4-2
Gambar 4.2 Tabel Artikel ...........................................................................................................
4-2
Gambar 4.3 Tabel Event .............................................................................................................
4-2
Gambar 4.4 Tabel Anggota .........................................................................................................
4-3
Gambar 4.5 Tabel Galleri ...........................................................................................................
4-3
Gambar 4.6 Tabel Iklan ...............................................................................................................
4-4
Gambar 4.7 Tabel Kategori Gambar ...........................................................................................
4-4
Gambar 4.8 Tabel Komentar ......................................................................................................
4-4
Gambar 4.9 Tampilan Login Admin) ..........................................................................................
4-5
Gambar 4.10 Tampilan Utama Admin (Backend) ......................................................................
4-5
Gambar 4.11 Tampilan Management User..................................................................................
4-6
Gambar 4.12 Tampilan Edit User ................................................................................................
4-6
Gambar 4.13 Tampilan Halaman Utama (Frontend) ..................................................................
4-7
Gambar 4.14 Tampilan Galleri ...................................................................................................
4-8
Gambar 4.15 Tampilan Berita ....................................................................................................
4-8
Gambar 4.16 Tampilan Event .....................................................................................................
4-9
Gambar 4.17 Tampilan Daftar ....................................................................................................
4-9
DAFTAR TABEL
Tabel 2.1 Use Case Diagram Simbol .........................................................................................
2-17
Tabel 2.2 Activity Diagram Simbol ...........................................................................................
2-18
Tabel 3.1 Kerangka TA ...............................................................................................................
3-1
Tabel 3.2 Deskripsi Aktor ...........................................................................................................
3-5
Tabel 3.3 Kategori Isi Informasi pada Website ...........................................................................
3-6
Tabel 3.4 Deskripsi Daftar .........................................................................................................
3-8
Tabel 3.5 Deskripsi Lihat Galleri ...............................................................................................
3-9
Tabel 3.6 Deskripsi Lihat Berita ................................................................................................
3-9
Tabel 3.7 Deskripsi Lihat Event .................................................................................................
3-10
Tabel 3.8 Deskripsi Lihat Iklan ..................................................................................................
3-10
Tabel 3.9 Modul Sekuensial .......................................................................................................
3-15
Tabel 3.10 Artikel ......................................................................................................................
3-17
Tabel 3.11 Daftar ........................................................................................................................
3-17
Tabel 3.12 Event .........................................................................................................................
3-17
Tabel 3.13 Galleri Iklan .............................................................................................................
3-17
Tabel 3.14 Iklan .........................................................................................................................
3-17
Tabel 3.15 Galleri .......................................................................................................................
3-18
Tabel 3.16 Komentar ..................................................................................................................
3-18
Tabel 3.17 Komentar Artikel .....................................................................................................
3.18
Tabel 3.18 Penjelasan Struktur Utama (Frontend) .....................................................................
3-19
Tabel 4.1 Skenario Pengujian Aplikasi ......................................................................................
4-11
Tabel 4.2 Pengujian ....................................................................................................................
4-11
DAFTAR SIMBOL
TabelSimbol Use Case Diagram NO
GAMBAR
NAMA
1.
Use case
2.
Aktor / actor
3.
Asosiasi / association
4.
5.
6.
KETERANGAN Fungsionalitas yang disediakan sistem sebagai unitunit yang saling bertukan pesan antar unit atau aktor, biasanya dinyatakan dengan menggunakan kata kerja di awal frase nama use case. Orang, proses, atau sistem lain yang berinteraksi dengan sistem informasi yang akan dibuat diluar sistem informasi yang akan dibuat itu sendiri, jadi walaupun simbol dari aktor adalah orang tapi belum tentu merupakan orang, biasanya dinyatakan menggunakan kata benda di awal frase nama aktor. Komunikasi antara aktor dan use case yangberpartisipasi pasa use case atau use case memiliki interaksi dengan aktor.
Ekstensi / extend
Relasi Use case tambahan ke sebuah Use case dimana Use case yang ditambahkan dapat berdiri sendiri walau tanpa Use case tambahan itu, mirip dengan prinsip inheritance pada pemerograman berorientasi objek, biasanya Use case tambahan memiliki nama depan yang sama dengan Use case yang ditambahkan.
Generalisasi / generalization
Hubungan Generalisasi dan spesialisasi (umum – khusu ) antara dua buah use case dimana fungsi yang satu adalah fungsi yang lebih umum dari lainnya.
Include
Ada dua sudut pandang yang cukup besar mengenai include di use case : a. Include berarti use case yang ditambahkan akan selalu dipanggil saat use case tambahan dijalankan. b. Include berarti use case yang tambahan akan selalu melakukan pengecekan apakah use case yang ditambahkan telah dijalankan sebelum use case tambahan dijalankan.
Tabel Simbol Class Diagram NO
GAMBAR
NAMA
KETERANGAN
Nama_kelas 1.
+ atribut
Kelas
Kelas pada struktur sistem.
+oprasi()
2.
Antarmuka / interface
3.
Asosiasi / association
4
Sama dengan konsep interface dalam pemerograman berorientasi objek. Relasi antar kelas dengan makna umum, asosiasi juga disertai dengan multiplicity
Relasi antar dengan makna kelas yang satu Asosiasi berarah / digunakan oleh yang lain, asosiasi biasanya juga association disertai dengan multiplicity
5
Generalisasi
6
Kebergantungan / dependency
7
Agregasi / aggregation
Relasi antar kelas dengan makna Generalisasispesialisasi (umum khusus) Relasi antar kelas dengan makna kebergantungan antar kelas Relasi antar kelas dengan makna semua bagian (whole - part)
Tabel Simbol Sequence Diagram NO GAMBAR
NAMA
1.
Aktor
2.
Garis hidup / lifeLine
3.
Waktu aktif
KETERANGAN Orang, proses, atau sistem lain yang berinteraksi dengan sistem informasi yang akan dibuat diluar sistem informasi yang akan dibuat itu sendiri, jadi walaupun simbol dari aktor adalah orang tapi belum tentu merupakan orang, biasanya dinyatakan menggunakan kata benda di awal frase nama aktor. Menyatakan kehidupan suatu objek.
4.
Nama_objek : nama kelas
Objek
Menyatakan objek dalam keadaan aktif dan berinteraksi pesan
Menyatakan objek berinteraksi pesan
5.
Pesan tipe create
Menyatakan suatu objek membuat objek lain, arah panah mengarah pada objek yang dibuat.
6.
Pesan tipe send
Menyatakan bahwa suatu objek mengirim data / masukan/ inpformasi ke objek lainnya.
7.
Pesan tipe retrun
Menyatakan bahwa suatu objek telah menjalankan suatu oprasi atau metode menghasilkan suatu kembalian ke objek tertentu.
8.
Pesan tipe call
Menyatakan suatu objek memanggil oprasi/metode yang ada pada objek lain atau dirinya sendiri.
TabelSimbol Activity Diagram NO
GAMBAR
NAMA
KETERANGAN
1.
Status awal
Status awal aktivitas sistem, sebuah diagram aktifitas memilki sebuah status awal
2
Aktivitas
3
Status akhir
Aktivitas yang dilakukan sistem, aktivitas biasanya diawali dengan kata kerja. Status akhir yang dilakukan sistem, sebuah diagram aktivitas memiliki sebuah status akhir.