PERANCANGAN WEBSITE PORTAL UKM CENTER MENGGUNAKAN UML, PHP dan MySQL

Miftahudin (11104078)

Jurusan Sistem Informasi, Fakultas Ilmu Komputer, Universitas Gunadarma Email : miftah.akew@gmail.com

Abstrak

Beberapa saat yang lalu telah terjadi krisis global yang cukup menyita perhatian

masyarakat di seluruh dunia, salah satunya indonesia yang sangat merasakan dampak dari krisis global tersebut. Baik usaha menengah keatas maupun usaha yang menengah kebawah. Ini juga yang dirasakan UKM(usaha kecil menengah) di indonesia, sampai-sampai mereka gulung tikar menghadapi krisis global tersebut. Semua itu terjadi karena beberapa faktor diantaranya faktor pemerintah yang tidak siap dalam penanganan dan penanggulangan masalah seperti ini.

Upaya yang dikedepankan dalam maslah ini adalah bagaimana UKM ini memilki daya saing yang sama terutama terhadap produk-produk yang dihasilkan. Aspek teknologi adalah salah satu aspek yang dapat membuat ukm-ukm diindonesia memiliki daya saing dan daya tarik tersendiri.

Dalam pemanfaatan aspek teknologi ini dilakukan dengan membuat suatu website portal untuk ukm. Dalam website ini terdapat fasilitas untuk ukm diantaranya menampilkan produk-produk ukm tersebut dan transaksi yang terjadi terhadap barang atau jasanya. Ukm ini nantinya di kelompokan berdasarkan kategori ukm, dimaksudkan agar pembeli dapat dengan mudah memilih barang atau jasa yang diinginkan. Dengan adanya website ini diharapkan menjadi sebuah wadah untuk para usaha menengah kebawah agar dapat bersaing. Berkaitan dengan hal tersebut, maka penulis akan mencoba mengangkat masalah tersebut dengan menyusun suatu penulisan ilmiah yang diharapkan dapat mengimlementasikan ide di atas menjadi solusi untuk membantu masalah dalam lingkup UKM. PENDAHULUAN Latar Belakang

Usaha Kecil dan Menengah (UKM) merupakan salah satu pelaku ekonomi yang signifikan di Indonesia. Sebagai salah satu pelaku ekonomi, UKM merupakan fenomena yang memberi kesinambungan di dalam fondasi perekonomian Indonesia. Upaya dan kebijakan untuk mengembangkan UKM telah menjadikannya obyek pembinaan yang dinamik. Secara umum, UKM belum memiliki sensitivitas terhadap tingkat perubahan dan persaingan di era globalisasi dan komputerisasi saat ini. Kondisi tersebut telah membuat UKM menjadi kurang memiliki daya saing, terutama atas produk-produk yang dihasilkan.

Salah satu aspek yang dapat membuat UKM memiliki daya tarik adalah aspek teknologi. Penerapan teknologi akan dapat dioptimalkan secara positif dalam pembinaan

Usaha Kecil Menengah yang berorientasi pasar. Teknologi sebagai salah satu upaya untuk dioptimalkan secara positif dalam pembinaan Usaha Kecil Menengah yang berorientasi pasar. Salah satunya adalah teknologi informasi atau Internet (homepage) yang dirakit secara komprehensif dan berbasis jaringan informasi pasar serta mudah diakses oleh para pelaku Usaha Kecil Menengah. Internet merupakan teknologi multimedia yang berkemampuan menggantikan beragam teknologi yang telah ada sebelumnya.

Melalui Website (situs), UKM diharapkan dapat meningkatkan kompetensi pembinaan Usaha Kecil yang multi-bidang sehingga terjalin kerjasama (yang sinergis) sinergik antara pihak-pihak yang memiliki kompetensi terkait untuk bersama-sama mengemban tugas pemberdayaan dan pembinaan. Para pelaku Usaha Kecil – Menengah diharapkan dapat menjadi marketer atas produknya secara on-line sehingga tercipta kondisi yang efektif dan efisien dalam pengembangan usahanya.

Berkaitan dengan hal tersebut, maka penulis akan mencoba mengangkat masalah tersebut dengan menyusun suatu penulisan ilmiah yang mengupayakan pemanfaatan teknologi komputer dan informasi dengan judul penulisan “Perancangan Website Portal UKM Center”, dengan menggunakan bahasa pemprograman PHP dan MySql..

Metodologi Metode penelitian yang digunakan dalam Skripsi ini adalah metode gabungan

yaitu dengan : a. Studi pustaka untuk memperoleh data-data dari buku dan dari sumber-sumber

lainnya di internet. b. Studi lapangan dengan melakukan wawancara beberapa pihak yang berhubungan

dengan pembuatan UKM ini untuk mengetahui prosedur apa saja yang dilakukan dalam pemesanan barang di UKM ini.

TINJAUAN PUSTAKA Perancangan Website Dalam perancangan Website Portal UKM Center ini, digunakan diagram UML (Unified Modelling Languange) dengan menggunakan 4 macam diagram yaitu diagram use case untuk mengetahui aktor dan use case yang berperan dan hubungan antara keduanya, diagram activity untuk mengetahui alur kerja dari masing-masing actor, diagram sequence untuk menggambarkan interaksi objek yang disusun dalam suatu urutan waktu dan diagram class untuk mengetahui class apa saja yang terlibat dalam web.

UML (Unified Modelling Language)

Unified Modelling Language (UML) adalah sebuah bahasa yang telah menjadi standar dalam industri untuk merancang, visualisasi dan mendokumentasikan sistem piranti lunak. UML menawarkan sebuah standar untuk merancang model sebuah sistem.

UML mendefinisikan diagram berikut: Use Case Diagram Class Diagram

Behaviour Diagram: Statechart Diagram Actifity Diagram

Interanction Diagram Sequence Diagram Collaboration Diagram

Component Diagram Deployment Diagram

PHP

PHP adalah sebuah bahasa script server-side yang biasa digunakan dengan bahasa HTML atau dokumennya secara bersamaan untuk membangun sebuah aplikasi di web yang sangat banyak kegunaannya. PHP adalah merupakan bahasa yang disertakan dalam dokumen HTML, bekerja di sisi server (server-side HTML-embedded scripting). Artinya syntax dan perintah yang diberikan akan sepenuhnya dijalankan di server tetapi disertakan pada halaman HTML biasa, sehingga script-nya tak tampak di sisi client. PHP dirancang untuk dapat bekerja sama dengan database server dan dibuat sedemikian rupa sehingga pembuatan dokumen HTML yang dapat mengakses database menjadi begitu mudah. Tujuan dari bahasa scripting ini adalah untuk membuat aplikasi-aplikasi yang dijalankan diatas teknologi web browser, tetapi prosesnya secara keseluruhan dijalankan diatas web server.

MySQL

MySQL adalah database server relasional yang gratis dibawah lisensi GNU General Public License. Dengan sifatnya yang Open Source, memungkinkan juga user untuk memodifikasi pada source code_nya untuk memenuhi kebutuhan spesifikasi. MySQL merupakan database multi user dan multi-theaded yang tangguh (robust). Dengan memiliki banyak feature MySQL bisa bersaing dengan database komersial sekalipun. Tidak mengejutkan, bahwa MySQL menjadi database pilihan untuk banyak pengguna PHP. Penggunaan Smarty Engine PHP

Smarty adalah suatu template mesin untuk PHP. Kelebihannya, smarty memiliki fasilitas untuk memisahkan isi dan logika aplikasi dari persentasinya. Ini adalah cara terbaik dalam menghadapi situasi pembuatan website dimana programmer aplikasi dan perancang tampilan menggunakan aturan yang berbeda atau dalam banyak kasus mereka masing-masing adalah dua orang yang berbeda.

Installah Smarty file library yang ada dalam / libs/ direktori itu. Ini adalah PHP file bahwa tidak untuk diedit. File-file ini bersama dengan semua aplikasi dan file ini hanya dapat dibaharui hanya untuk meningkatkan kualitas atau suatu versi Smarty yang baru.

Smarty menggunakan suatu PHP yang tetap yang disebut SMARTY_DIR yang terdapat pada sistem Filepath directori library smarty itu. Pada Dasarnya, jika aplikasi

dapat menemukan Smarty.Class.Php file, berarti tidak harus menetapkan SMARTY_DIR, Smarty akan menggambarkannya sendiri. Oleh Karena Itu, jika Smarty.Class.Php tudak berada didalam include_path, atau tidak menyediakan suatu alur absolut ke include path tersebut di dalam aplikasi, maka harus digabarkan sendiri pada SMARTY_DIR. SMARTY_DIR harus termasuk dalam direktori aktif dati website. Cara penggunaan smarty pada PHP :

1. Mengekstrak isi folder smarty pada web server. 2. Buat folder baru sebagai working folder.

Di dalam working folder buat folder baru bernama ”templates” dan ”templates_c”.

PERANCANGAN WEBSITE Pendahuluan

Usaha Kecil dan Menengah (UKM) merupakan salah satu pelaku ekonomi yang signifikan di Indonesia. Secara umum, UKM belum memiliki sensitivitas terhadap tingkat perubahan dan persaingan di era globalisasi dan komputerisasi saat ini. Kondisi tersebut telah membuat UKM menjadi kurang memiliki daya saing, terutama atas produk-produk yang dihasilkan.

Yang pertama harus dilakukan dalam pembuatan website portal ukm ini adalah melakukan perancangannya. Diantarannya ada perancangan sistem, perancangan database dan perancangan program dari website portal ini.

Perancangan Website Dalam perancangan Website Portal UKM Center ini, digunakan diagram UML (Unified Modelling Languange) dengan menggunakan 4 macam diagram yaitu diagram use case untuk mengetahui aktor dan use case yang berperan dan hubungan antara keduanya, diagram activity untuk mengetahui alur kerja dari masing-masing actor, diagram sequence untuk menggambarkan interaksi objek yang disusun dalam suatu urutan waktu dan diagram class untuk mengetahui class apa saja yang terlibat dalam web.

1. Diagram Use Case

Perancangan sistem menggunakan diagram use case bertujuan untuk mengetahui bagaimana website seharusnya bekerja, siapa atau apa (actors) saja yang terlibat di dalamnya, dan mengetahui kejadian-kejadian yang ditimbulkan oleh actor. Perancangan dimulai dari identifikasi actor dan bagaimana hubungan antara actor dan use case di dalam sistem.

Gambar 3.1 Aktor Dalam Sistem

Gambar 3.2 Diagram Use Case Pendaftaran Member

Admin

Pendaftaran Member

Email

Password

KeteranganNo.Telepon

AlamatNama

<<Include>>

<<Include>>

<<Include>>

<<Include>>

<<Include>>

UserName

No.Fax

<<Include>>

Pembeli

Gambar 3.3 Diagram Use case Pendaftaran Pembeli

Member

AdminPembeli

PasswordUserName

Memesan

Login

<<Include>>

<<Include>><<Include>>

Input Pesanan Bukti Pemesanan

Bukti Pemesanan

Konfirmasi Pesanan

<<Include>>

<<Include>>

Gambar 3.4 Diagram Use Case Transaksi

2. Diagram Activity Activity diagram menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir.

Gambar 3.5 Diagram Activity Member

Membuka Website

Login

Sudah Mendaftar Belum Mendaftar

Logout

YATIDAK

Mendaftar Pembeli

Input Data pembeli

Masukan User Name danPassword

Cek Data Pembeli

Menampilkan HalamanPembeli

Pengecekan DataPembeli

Data Sudah Ada Data Disimpan

Melakukan Transaksi

AdministratorPembeli Member

Pesan Barang

Update PesananBarang

Update Pesanan

TIDAKYA

Pesanan Fix Catat Pesanan

Buat Bukti PesananCetak Bukti Pesanan

Gambar 3.6 Diagram Activity Pemesanan

3. Diagram Sequence Sequence diagram menggambarkan interaksi antar objek di dalam dan di sekitar sistem

Gambar 3.7 Diagram Sequence Pendaftaran Member

Gambar 3.8 Diagram Sequence Pendaftaran Pembeli

Gambar 3.9 Diagram Sequence Pemesanan

4. Diagram Class Merupakan perancangan database sistem.

+Tambah()+View()+Edit()+Delete()

+Kd_Barang : int-Kd_Member : int-Kd_Jenis : char-Nama_Barang : char-harga : int-Ket_Barang : char-Stok : int-Gambar : char-Tipe_File : char-Terlaris : int-Pilihan : int

Barang

+Tambah()+Edit()+Delete()

+Kd_Benner : int-Gambar : char-Tgl_Mulai : Date-Tgl_Selesai : Date-Ket_Benner : char-Tipe_Benner : char-Posisi : int-URL : char

Benner

+Tambah()+Delete()

+Kd_Elearning : int-Kd_Kat_Elearning : int-Nama_File : char-Ket_File : char-Tipe_File : char

Elearning

+Tambah()+Edit()+Delete()

+Kd_Faq : int-Kd_Kategori : int-Pertanyaan : char-Jawaban : char

Faq

+Delete()

+Kd_Hstory : int+Nama_User : char-Tanggal : Date

History_Login

+Tambah()+Edit()+Delete()

+Kd_Info : int-Nama_Info : char-Ket_info : char

Info

+Tambah()+Edit()+Delete()

+Kd_Jenis : char-Nama_Jenis : char-Ket_Jenis : char

Jenis_Barang

+Tambah()+Edit()+Delete()

+Kd_Kat_Elearning : int-Nama_Kat_Elearning : char-Ket_Kat_Elearning : char

Kategori_Elearning

+Tambah()+Edit()+Delete()

+Kd_Kategori : int-Nama_Kategori : char-Ket_Kategori : char

Kategori_Faq

+Delete()

+Kd_Komentar : int-Kd_Barang : int-Nama : char-Email : char-Komentar : char-Status : int

Komentar

+Tambah()+Edit()+Delete()

+Kd_Link : int-URL : char-Ket_Link : char

Link

+Tambah()+Edit()+Delete()

+Kd_Member : int-Password : char+Nama_Member : char-Alamat : char-Email : char-Perusahaan : char-No_Telepon : char-Ket_Member : char

Member

+Tambah()+Edit()+Delete()

+Kd_Pembeli : int+Nama_User : char-Password : char-Nama_Pembeli : char-Alamat : char-Email : char-Perusahaan : char-No_Telepon : char-No_Fax : int-Ket_Pembeli : char

Pembeli

+Delete()

+Kd_Statistik : int-Nama_halaman : char-Pengguna : int+Nama_user : char-Tanggal : Date

Statistik

+Detail()+Delete()

+No_Transaksi : char-Kd_member : int-Kd_Barang : int-Kd_pembeli : int-Tanggal : Date-Jumlah : int

Transaksi

+Tambah()+Edit()+Delete()

+Kd_User : int+Nama_User : char-Password : char-Ket_User : char

User

1

1..n 1..n1 1..n

1..n 1..n

1..n1..n

1..n1..n

1..n 1..n

1..n

1..n

1..n1

1..n

+ceksession()

Pengguna

+Tambah()+Edit()+Delete()

+Kd_Kat_Elearning : int-Nama_Kat_Elearning : char-Ket_Kat_Elearning : char

History_Gallery

+Delete()

+Kd_Hstory : int+Pengguna : char-Tanggal : Date

History_Barang

Gambar 3.10 Diagram Class

Tampilan Output

Gambar 4.1 Halaman Utama

Gambar 4.20 Halaman Pembeli Login

Gambar 4.27 Halaman Login Administrator

Gambar 4.52 Halaman Satistik Administrator

Gambar 4.53 Halaman Detile Tanggal Administrator

Gambar 4.54 Halaman Detile Halaman Administrator

Kesimpulan

Dalam penulisan ini telah dibuat Website Portal UKM Center, dimana melalui website ini berbagai macam ukm dapat menampilkan bebagai macam barang atau jasa yang diproduksinya, dengan kata lain barang-barang member tersebut di promosikan via internet. Dalam Hal ini pengunjung atupun pembeli memiliki informasi tenteang ukm-ukm tanpa harus datang langsung ke tempatnya, selama memiliki koneksi internet. Kekurangan dari sistem ini adalah kurangnya animasi yang digunakan agar pengguna website ini dapat lebih tertarik. Kurangnya interaksi antara Pembeli dengan pembeli, antara member dengan member dan antara member dengan pembeli, seperti sebuah forum atau sejenisnya. Daftar Pustaka [1] Munawar, 2005, Pemodelan Visual dengan UML, Penerbit Graha Ilmu,

Yogyakarta. [2] Anonim, Web Programing Using PHP and MySQL., LEPKOM Internet Universitas

Gunadarma., Depok, 2002. [3] Anonim , Pengantar Internet., LEPKOM Universitas Gunadarma, Depok 2000. [4] Sanjaya, Ridwan, Pengolahan Database MySQL 5 dengan Java 2, Andi Yogyakarta, Semarang, 2003. [5] Peranginangin, Kasiman, Aplikasi Web dengan PHP dan MySQL, Andi Yogyakarta,

Semarang, 2006. [6] URL : http://www.ilmukomputer.com/umum/yanti-uml.php. [7] URL :Http://www.jakarta.apache.org. [8] URL : http://www.smarty.php.net.