17
Perancangan Website Sebagai Media Pameran Fotografi Digital Berbasis PHP & MySQL Farida Amalya Universitas Gunadarma [email protected] AbstrakPameran fotografi merupakan suatu kegiatan yang dilakukan oleh seorang atau beberapa fotografer yang berusaha untuk menyampaikan gagasan atau idenya dalam bentuk foto kepada masyarakat. Namun, fotografer mengalami kendala dalam pelaksanaannya dikarenakan mahalnya keperluan pameran fotografi seperti menyewa galeri seni dan mencetak foto. Hal ini menyebabkan para fotografer yang berpotensi memiliki karya terbaiknya menjadi terhambat. Tujuan penelitian ini dilakukan untuk membantu fotografer yang mengalami kesulitan dalam memamerkan karyanya dengan membuat pameran fotografi berbasis website yang perlu dikembangkan di era digital ini. Metode yang digunakan adalah analisis, desain, pengkodean, implementasi dan uji coba. Berdasarkan penelitian yang dilakukan, Website Aplikasi Pameran Fotografi Digital sudah berhasil dibuat. Website ini bertujuan untuk membuat dan melihat pameran yang akan menjadi wadah bagi para fotografer dalam memajang karyanya melalui pameran fotografi digital berbasis website. Website ini dibuat menggunakan HTML 5 dan PHP Laravel sebagai bahasa pemrograman, database MySQL Kata KunciDigital, Fotografi, Laravel, MYSQL, PHP, Pameran, Website. BAB I. PENDAHULUAN Peneliti tertarik dalam meneliti secara mendalam tentang pameran yang dialokasikan ke digital agar membantu fotografer yang mengalami kesulitan dalam memamerkan karyanya. Adapun alasan yang menguatkan peneliti dalam melakukan penelitian dikarenakan mahalnya keperluan pameran fotografi seperti menyewa galeri seni dan mencetak foto mengakibatkan para fotografer kesulitan dalam memajang karya mereka. Hal ini menyebabkan para fotografer yang berpotensi memiliki karya terbaiknya menjadi terhambat. Penggunaan Bahasa PHP memiliki kelebihan berupa open source yang dimana dapat dikembangkan secara gratis, selalu diperbaharui secara teratur guna mengikuti tren terbaru, scripting server, Bahasa yang popular. Sedangkan basis data Mysql memiliki kelebihan berupa open source, memiliki spesifikasi yang minimum terhadap penggunaan RAM, struktur tabel yang fleksibel, keamanan yang terjamin. Kelebihan tersebut merupakan alasan penggunaan Bahasa pemrograman PHP serta Basis Data Mysql dalam pembuatan aplikasi Pameran Fotografi Berbasis Website yang perlu dikembangkan di era digital ini. Pameran fotografi digital pada dasarnya merupakan galeri online yang dibuat sebagai wadah bagi para fotografer maupun pecinta fotografi untuk memajang karya-karyanya maupun melihat karya orang lain. 1.1 Rumusan Masalah merancang dan membuat website pameran fotografi

Perancangan Website Sebagai Media Pameran Fotografi

  • Upload
    others

  • View
    20

  • Download
    1

Embed Size (px)

Citation preview

Page 1: Perancangan Website Sebagai Media Pameran Fotografi

Perancangan Website Sebagai Media Pameran Fotografi Digital

Berbasis PHP & MySQL

Farida Amalya

Universitas Gunadarma

[email protected]

Abstrak— Pameran fotografi merupakan suatu kegiatan yang dilakukan oleh

seorang atau beberapa fotografer yang berusaha untuk menyampaikan gagasan

atau idenya dalam bentuk foto kepada masyarakat. Namun, fotografer mengalami

kendala dalam pelaksanaannya dikarenakan mahalnya keperluan pameran

fotografi seperti menyewa galeri seni dan mencetak foto. Hal ini menyebabkan

para fotografer yang berpotensi memiliki karya terbaiknya menjadi terhambat.

Tujuan penelitian ini dilakukan untuk membantu fotografer yang mengalami

kesulitan dalam memamerkan karyanya dengan membuat pameran fotografi

berbasis website yang perlu dikembangkan di era digital ini. Metode yang

digunakan adalah analisis, desain, pengkodean, implementasi dan uji coba.

Berdasarkan penelitian yang dilakukan, Website Aplikasi Pameran Fotografi

Digital sudah berhasil dibuat. Website ini bertujuan untuk membuat dan melihat

pameran yang akan menjadi wadah bagi para fotografer dalam memajang

karyanya melalui pameran fotografi digital berbasis website. Website ini dibuat

menggunakan HTML 5 dan PHP Laravel sebagai bahasa pemrograman, database

MySQL

Kata Kunci— Digital, Fotografi, Laravel, MYSQL, PHP, Pameran, Website.

BAB I. PENDAHULUAN

Peneliti tertarik dalam meneliti secara mendalam tentang pameran yang dialokasikan

ke digital agar membantu fotografer yang mengalami kesulitan dalam memamerkan

karyanya. Adapun alasan yang menguatkan peneliti dalam melakukan penelitian

dikarenakan mahalnya keperluan pameran fotografi seperti menyewa galeri seni dan

mencetak foto mengakibatkan para fotografer kesulitan dalam memajang karya mereka.

Hal ini menyebabkan para fotografer yang berpotensi memiliki karya terbaiknya

menjadi terhambat.

Penggunaan Bahasa PHP memiliki kelebihan berupa open source yang dimana dapat

dikembangkan secara gratis, selalu diperbaharui secara teratur guna mengikuti tren

terbaru, scripting server, Bahasa yang popular. Sedangkan basis data Mysql memiliki

kelebihan berupa open source, memiliki spesifikasi yang minimum terhadap

penggunaan RAM, struktur tabel yang fleksibel, keamanan yang terjamin. Kelebihan

tersebut merupakan alasan penggunaan Bahasa pemrograman PHP serta Basis Data

Mysql dalam pembuatan aplikasi Pameran Fotografi Berbasis Website yang perlu

dikembangkan di era digital ini. Pameran fotografi digital pada dasarnya merupakan

galeri online yang dibuat sebagai wadah bagi para fotografer maupun pecinta fotografi

untuk memajang karya-karyanya maupun melihat karya orang lain.

1.1 Rumusan Masalah

merancang dan membuat website pameran fotografi

Page 2: Perancangan Website Sebagai Media Pameran Fotografi

1.2 Tujuan Penelitian

Tujuan dari penelitian ini adalah membuat website pameran sebagai wadah bagi

para fotografer dalam memajang karyanya melalui pameran fotografi digital berbasis

website.

1.3 Manfaat Penelitian

Manfaat dari penelitian ini adalah melalui pameran fotografi digital berbasis

website dapat membantu para fotografer yang ingin membuat pameran namun

terkendala dari segi biaya menjadi lebih praktis, mudah dan tidak perlu mengeluarkan

biaya seperti pameran semestinya.

BAB II. TINJAUAN PUSTAKA, KERANGKA PEMIKIRAN DAN HIPOTESIS

2.1 Tinjauan Pustaka

2.1.1 Fotografi

Istilah fotografi berasal dari dua kata Yunani phos dan graphe. Phos berarti cahaya,

sementara graphe berarti melukis atau menggambar.

2.1.2 Pameran

Pameran merupakan suatu kegiatan penyajian karya seni rupa untuk

dikomunikasikan sehingga dapat diapresiasi oleh masyarakat luas.

2.1.3 Fotografer

Fotografer atau juru foto merupakan kumpulan orang-orang yang membuat gambar

dengan cara menangkap cahaya dari subyek gambar dengan kamera maupun peralatan

fotografi lainnya, dan umumnya memikirkan seni dan teknik untuk menghasilkan foto

yang lebih bagus serta berusaha mengembangkan ilmunya.

2.1.4 Website

Dalam dunia teknologi yang pesat ini diperlukan suatu jaringan yang bias

mempermudahkan serta mempercepat penyampaian informasi secara luas, dan dapat

dengan mudah dan cepat oleh siapapun yang mendapatkan akses internet.

2.1.5 Visual Studio Code

Visual Studio Code adalah Sofware yang sangat ringan, namun kuat Editor kode

sumbernya yang berjalan dari desktop. Muncul dengan built-in dukungan untuk Java

Script, naskah dan Node.js dan memiliki array beragam ekstensi yang tersedia untuk

bahasa lain, termasuk C ++, C#, Python, dan PHP.

2.1.6 PHP

PHP merupakan salah satu Bahasa pemograman berbasis web adapun sistem yang

diterapkan adalah pada sisi server side. PHP dapat disisipkan diantar askrip-skrip bahasa

HTML dan arena Bahasa server side lainnya, dengan itu maka PHP akan dieksekusi

secara langsung pada server.

2.1.7 MySQL - PhpMyAdmin

MySQL adalah sebuah perangkat lunak sistem manajemen basis data SQL (bahasa

Inggris: database management System) atau DBMS yang multithread, multi-user,

dengan sekitar 6 juta instalasi di seluruh dunia.

Page 3: Perancangan Website Sebagai Media Pameran Fotografi

PhpMyAdmin adalah sebuah aplikasi/perangkat lunak bebas (open source) yang

ditulis dalam bahasa pemrograman PHP yang digunakan untuk menangani administrasi

database MySQL melalui jaringan lokal maupun internet.

2.1.8 HTML

HTML (Hyper Text Mark Up Language) merupakan bahasa yang digunakan untuk

mendeskripsikan struktur sebuah halaman web. HTML berfungsi untuk mempublikasi

dokumen online. Statement dasar dari HTML disebut tags.

2.1.9 CSS

CSS kepanjangan dari Cascading Style Sheet adalah bahasa-bahasa yang

merepresentasikan halaman web. Seperti warna, layout, dan font

2.1.10 Java Script

Javascript adalah suatu bahasa scripting yang digunakan sebagai fungsionalitas

dalam membuat suatu web”.

2.1.11 Vue.Js

Vue.js (dibaca: vyuu atau viuu) merupakan sebuah Framework JavaScript

progresif yang digunakan untuk membangun tampilan user interface dengan mengacu

pada arsitektur MVC (Model, View, Controller).

2.1.12 Framework Laravel

Laravel adalah sebuah MVC web development framework yang didesain untuk

meningkatkan kualitas perangkat lunak dengan mengurangi biaya pengembangan dan

perbaikan serta meningkatkan produktifitas pekerjaan dengan sintak yang bersih dan

fungsional yang dapat mengurangi banyak waktu untuk implementasi (Widodo &

Purnomo, 2016).

2.1.13 UML

Unified Modelling Language (UML) adalah bahasa pemodelan untuk sistem atau

perangkat lunak yang berparadigma berorientasi objek. Abstraksi konsep dasar UML

terdiri dari structural classification, dynamic behavior, dan model management yang

dapat dipahami konsep utamanya sebagai term yang akan muncul pada saat membuat

diagram dan view adalah kategori dari diagram tersebut (Adi, 2010).

UML mendefinisikan diagram-diagram untuk memodelkan aplikasi berorientasi

objek, yaitu:

a. Use Case Diagram untuk memodelkan proses sistem.

b. Conceptual Diagram untuk memodelkan konsep-konsep yang ada di dalam

aplikasi.

c. Sequence Diagram untuk memodelkan pengiriman pesan (message) antar

objects.

d. Collaboration Diagram untuk memodelkan interaksi antar objects.

e. State Diagram untuk memodelkan perilaku objects di dalam sistem.

f. Diagram Activity untuk memodelkan perilaku Use Cases dan objects di dalam

System.

g. Class Diagram untuk memodelkan struktur kelas.

h. Object Diagram untuk memodelkan struktur object.

Page 4: Perancangan Website Sebagai Media Pameran Fotografi

i. Component Diagram untuk memodelkan komponen object.

j. Deployment Diagram untuk memodelkan distribusi aplikasi.

Pada penulisan ini, Penulis hanya menggunakan 3 jenis diagram UML, yaitu Use

Case Diagram, Activity Diagram dan Class Diagram.

2.1.17 Struktur Navigasi

Dalam pembuatan website, hal yang harus diperhatikan sebelum merancang

tampilan web adalah pembuatan struktur navigasi. Ada empat struktur dasar yang

digunakan, yaitu linear, hierarkis, nonlinear, dan komposit (Binanto, 2010:269).

BAB III. METODOLOGI PENELITIAN

Metode yang digunakan dalam perancangan dan pembuatan pameran digital

berbasis website ini adalah metode pengembangan perangkat lunak System

Development Life Cycle).

1. Analisis

Pada tahap ini penulis mengumpulkan, membaca dan mempelajari buku atau jurnal,

tutorial dan bahan materi dari internet yang mendukung pembuatan website pameran

fotografi digital.

2. Desain

dalam tahap ini disajikan desain desain dari aplikasi seperti desain antar muka, dan

desain database yang akan diterapkan kedalam System yang akan dibuat mengunakan

model Unified Modelling Language (UML) dengan perancangan user interface pada

website.

3. Pengkodean

Pada tahap ini penulis menerapkan desain database serta desain antar muka kedalam

bahasa pemrograman, dengan aplikasi pengkodean yang sesuai dengan rancangan

aplikasi menggunakan software-sofware diantaranya adalah Web Browser, Visual

Studio Code, Bahasa Pemrograman HTML 5, PHP versi 7 dengan Framework

Laravel, XAMPP serta MySQL sebagai database

4. Implementasi dan uji coba

Tahap ini merupakan tahap untuk memastikan tidak ada kesalahan yang terdapat

pada aplikasi yang telah dibuat dengan cara melakukan uji coba terhadap aplikasi

tersebut. Uji coba aplikasi menggunakan web browser yang terdapat pada komputer

dengan spesifikasi sistem operasi Windows 10 64bit, processor Intel® Core™ i5-7200U

CPU @2.50 4(CPUs) – GHz 2.7GHz, RAM 8192MB, Hard disk 1 TB.

BAB IV. HASIL DAN PEMBAHASAN

1. Analisis Use Case Diagram

Sebuah diagram Use Case adalah sebuah diagram yang menunjukkan hubungan

antara aktor dan kasus penggunaan dalam sistem Diagram ini menggambarkan siapa

yang menggunakan sistem dan apa saja yang dapat dilakukannya. Aktor adalah segala

hal diluar sistem yang akan menggunakan sistem tersebut.

Page 5: Perancangan Website Sebagai Media Pameran Fotografi

Gambar 3.1 Use Case Diagram User

2. Analisis Activity Diagram

Gambar 3.2 Activity Diagram

3.1 Perancangan

3.1.1 Perancangan Database

Perancangan database digunakan untuk memudahkan dalam pengertian

struktur database program. Pada perancangan database akan dijelaskan hubungan

antar entitas dan juga struktur dari database. Dalam pembuatan Website Aplikasi

Page 6: Perancangan Website Sebagai Media Pameran Fotografi

Gambar 3.3 Class Diagram database

3.1.2 Perancangan Struktur Navigasi

1. Struktur Navigasi Halaman Depan (home)

Gambar 3.4 Struktur Navigasi Halaman Depan

Page 7: Perancangan Website Sebagai Media Pameran Fotografi

2. Struktur Navigasi User

Gambar 3.5 Struktur Navigasi Use

1. Rancangan Tampilan Halaman Home

Gambar 3.6 Rancangan Tampilan Halaman Home

Page 8: Perancangan Website Sebagai Media Pameran Fotografi

2. Rancangan Tampilan Panduan Aplikasi

.

Gambar 3.7 Rancangan Tampilan Halaman Panduan Aplikasi

3. Rancangan Tampilan About us

Gambar 3.8 Rancangan Tampilan Halaman About us

4. Rancangan Tampilan Login

.

Gambar 3.9 Rancangan Tampilah Halaman Login

Page 9: Perancangan Website Sebagai Media Pameran Fotografi

5. Rancangan Tampilan Resset Password

Gambar 3.10 Rancangan Tampilah Halaman Reset Password

6. Rancangan Tampilan Register

Gambar 3.11 Rancangan Tampilan Halaman Register

7. Rancangan Tampilan Halaman Pameran

Gambar 3.12 Rancangan Tampilan Halaman Pameran

Page 10: Perancangan Website Sebagai Media Pameran Fotografi

Gambar 3.13 Rancangan Tampilan Halaman Pameran Modal

8. Rancangan Tampilan Halaman Buat Pameran

.

Gambar 3.14 Rancangan Tampilan Halaman Buat Pameran

Page 11: Perancangan Website Sebagai Media Pameran Fotografi

3.2 Tampilan Halaman Home

Gambar 3.15 Tampilan Halaman Home

3.2.1 Tampilan Halaman Panduan Aplikasi

Gambar 3.16 Tampilan Halaman Panduan Aplikasi

Gambar 3.17 Tampilan Halaman Panduan Aplikasi

Page 12: Perancangan Website Sebagai Media Pameran Fotografi

Gambar 3.18 Tampilan Halaman Panduan Aplikasi

3.2.2 Tampilan halaman About us

Gambar 3.19 Tampilan Halaman About us

3.2.3 Tampilan Halaman Login

Gambar 3.20 Tampilan Halaman Login

Page 13: Perancangan Website Sebagai Media Pameran Fotografi

3.2.4 Tampilan Halaman Register

Gambar 3.21 Tampilan Halaman Register

3.2.5 Tampilan Halaman Pameran

Gambar 3.22 Tampilan Halaman Pameran

Gambar 3.23 Tampilan Halaman Pameran

Page 14: Perancangan Website Sebagai Media Pameran Fotografi

Gambar 3.24 Tampilan Halaman Pameran

3.2.6 Tampilan Halaman Upload Pameran

Gambar 3.25 Tampilan Halaman Buat Pameran

3.3 Tahap Implementasi dan Uji Coba

Implementasi akan dilakukan dengan cara menghostingkan website dengan alamat

www.StoryPhoto.org agar bisa dikunjungi oleh semua orang yang ingin berkunjung. Uji

coba dilakukan menggunakan metode blackbox dengan hasil pengujian seperti yang

terdapat pada tabel.

Tabel 3.7 Pengujian Tipe Equivalence Partitioning halaman website

No Uji

Fungsi

Input Hasil yang

diharapkan

Hasil yang

diperoleh

Hasil

uji

1 Menu

Login

Input

data

Dapat masuk ke

halaman

pameran

Masuk

kehalaman

pameran

Valid

2 Menu

register

Tambah

data

Dapat

menampilkan

Form register

Akun dapat

dibuat

Valid

Page 15: Perancangan Website Sebagai Media Pameran Fotografi

serta dapat

membuat akun

user

3 Halaman

Docs

Lihat

data

Membuka tab

baru

menampilkan

halaman github

StoryPhoto

Membuka tab

baru

menampilkan

halaman github

StoryPhoto

valid

4 Halaman

About us

Lihat

data

Dapat

menampilkan

halaman About

us

Menampilkan

halaman About

us

valid

5 Halaman

panduan

aplikasi

Lihat

data

Dapat

menampilkan

halaman

panduan

aplikasi

Menampilkan

halaman

panduan

aplikasi

valid

6 Halaman

pameran

Lihat

data

Dapat

menampilkan

halaman

pameran

Menampilkan

halaman

pameran

valid

7 Tombol

lihat

pameran

Lihat

data

Dapat melihat

pameran Ketika

menekan

tombol

pameran

Melihat

pameran

valid

8 Menu

close

pameran

Lihat

data

Dapat Menutup

pameran

dengan

menekan

tombol close

Menutup

pemeran

valid

9 Halaman

buat

pameran

Lihat

data

Dapat

menampilkan

halaman buat

pameran

Menampilkan

halaman buat

pameran

valid

10 Form buat

pameran

Tambah

data

Dapat

menambah data

pada Form buat

pameran

Menambah

data

valid

11 Menu

logout

- Keluar dari

session user

dan mencabut

hak akses

website

Keluar website valid

Page 16: Perancangan Website Sebagai Media Pameran Fotografi

Tabel 3.8 Pengujian Tipe Error Guessy Halaman Website

No Uji

Fungsi

Input Hasil yang

diharapkan

Hasil yang

diperoleh

Hasil

uji

1 Menu

login

Data username

dan password

pada menu

masuk/ login

dikosongkan

Tidak

dapat

masuk

kehalaman

pameran

Peringatan

input error

Data

valid

2 Menu

register

Form pengisian

data register

dikosongkan

Tidak

dapat

menyimpan

data yang

kosong

Peringaran

input error

Data

valid

3 Menu

buat

pameran

Form pengisian

data buat

pameran

dikosongkan

Tidak

dapat

menyimpan

data yang

kosong

Peringatan

input error

Data

valid

BAB V. SIMPULAN DAN SARAN

5.1 Simpulan

Website Aplikasi Pameran Fotografi Digital sudah berhasil dibuat. Website ini

bertujuan untuk membuat dan melihat pameran yang akan menjadi wadah bagi para

fotografer dalam memajang karyanya melalui pameran fotografi digital berbasis

website. Website ini dibuat menggunakan HTML 5 dan PHP Laravel sebagai bahasa

pemrograman, database MySQL. Dapat dilihat melalui link www.storyphoto.org

5.2 Saran

Penulis menyadari bahwa masih adanya kekurangan dalam website ini, sehingga

penulis mengharapkan adanya pengembangan beberapa fitur, seperti fitur admin, yaitu

berupa admin yang memenejemen halaman pameran agar dapat menghapus/ memberi

peringatan terhadap user yang menyalahgunakan website, Dan juga semoga website ini

dapat bermanfaat, serta dapat menjadi contoh kepada pemula atau pembaca lain yang

ingin membuat website menggunakan PHP Laravel dan database MySQL.

Page 17: Perancangan Website Sebagai Media Pameran Fotografi

DAFTAR PUSTAKA

Bekti, B. H. 2015. Mahir Membuat Website dengan Adobe Dreamweaver CS6, CSS

dan JQuery. Yogyakarta: ANDI.

Bell, C., Kindahl, M & Thalmann, L. 2014. MySQL High Availability: Tools for

Building Robust Data Centers 2nd Edition. O’Reilly Media.

Binanto, Iwan. 2010. Multimedia Digital Dasar Teori dan Pengembangannya.

Yogyakarta: Andi.

Butler, T & Yank, K. 2016. PHP & MySQL: Novice to Ninja, 6th Edition. SiitePoing.

Dyer, R.J.T. 2015. Learning MySQL and MariaDB Heading in the Right Direction with

MySQL and MariaDB. O’Reilly Media.

Henderson, H. 2009. Encyclopedia of Computer Science and Technology. New York:

Facts on File, Inc.

Hidayatullah, Priyanto. 2014. Visual Basic .NET. Edisi Revisi. Bandung: Informatika.

Kadir, Abdul. 2009. From Zero To A Pro -Membuat Aplikasi Web Dengan Php dan

Database Mysql. Andi Publisher: Yogyakarta.

Kasihani K. E Suyanto. 2007. Model Pembelajaran. Malang: Universitas Negeri

Malang.

Maynard, Patrick. 1997. The Engine of Visualization. London: Cornell University Press.

Naista, D. 2016. Bikin Framework PHP Sendiri dengan Teknik OOP dan MVC.

Jakarta: Lokomedia.

Rahmadi, Moch. Luthfi. 2013. Tips Membuat Website tanpa Coding & Langsung

Online. Yogyakarta: Andi.

Schwartz, B., Zaitsew, P & Tkachenko, V. 2012. High Performance MySQL. O’Reily

Media, Inc.

Stephen Bull. 2010. Photography. Oxon: Routledge.

Yeni Kustiyahningsih, Devie Rosa Anamisa, 2011. Pemograman Basis Data Berbasis

Web Menggunakan PHP & MySQL. Graha Ilmu: Yogyakarta.