SISTEM INFORMASI POLA DASAR PAKAIAN BERBASIS WEBSITE TUGAS AKHIR ANGGIE MULYA WARDANI

SISTEM INFORMASI POLA DASAR PAKAIAN BERBASIS WEBSITE. TUGAS AKHIR. ANGGIE MULYA WARDANI 152406091. PROGRAM STUDI D3 TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA MEDAN 2018. UNIVERSITAS SUMATERA UTARA.

SISTEM INFORMASI POLA DASAR PAKAIAN BERBASIS WEBSITE. TUGAS AKHIR DIAJUKAN UNTUK MELENGKAPI TUGAS DAN MEMENUHI SYARAT MEMPEROLEH NILAI AHLI MADYA. ANGGIE MULYA WARDANI 152406091. PROGRAM STUDI D3 TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA MEDAN 2018. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

PERNYATAAN ORISINILITAS. SISTEM INFORMASI POLA DASAR PAKAIAN. LAPORAN TUGAS AKHIR. Saya menyatakan bahwa laporan tugas akhir ini adalah hasil karya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.. Medan, Juli 2018. ANGGIE MULYA WARDANI 152406091. ii UNIVERSITAS SUMATERA UTARA.

SISTEM INFORMASI POLA DASAR PAKAIAN BERBASIS WEBSITE. ABSTRAK. Pada penulisan tugas akhir ini, penulis membuat sistem informasi pola dasar pakaian berbasis website . Pola dasar adalah proses awal dalam pembuatan pola busana sesuai gambar yang didesain sehingga pengetahuan pembuatan pola dasar diperlukan sebagai bekal awal dalam pembuatan berbagai macam pola busana. Pembuatan sistem ini menggunakan bahasa pemrograman PHP, HTML, CSS, MYSQL dan JavaScript. Sistem ini bertujuan sebagai media informasi yang memberikan informasi yang berkaitan dengan pola dasar pakaian untuk memudahkan penjahit melihat kembali pola yangn telah dibuat sebelumnya. Kata Kunci : Informasi, Penjahit, PHP, Pola dasar, Website. iii UNIVERSITAS SUMATERA UTARA.

INFORMATION SYSTEMS ARCHETYPE CLOTHING BASED WEBSITE. ABSTRACT. At the writing of this thesis, the author makes information systems archetype-based clothing website. Archetype is the initial process in the manufacture of apparel pattern fits the picture that is designed so that knowledge is required as a basic pattern making supplies early in the manufacture of a wide range of fashion patterns. The creation of this system using the programming language PHP, HTML, CSS, MYSQL and JavaScript. This system aims as a medium of information that provides information relating to the basic pattern for easy clothing tailors a look back the decision patterns has been created previously. Keywords: Information, Tailor, PHP, Clothing Patterns, Website. iv UNIVERSITAS SUMATERA UTARA.

PENGHARGAAN. Puji dan syukur penulis ucapkan kepada Allah SWT yang telah memberikan rahmat dan hidayah-Nya kepada kita semua sehingga penulis dapat menyelesaikan laporan tugas akhir ini dengan baik. Laporan penyusunan tugas akhir ini masih banyak memiliki kekurangan karena keterbatasan kemampuan dan pengetahuan penulis, sehingga kritik dan saran yang membangun serta dapat memberikan inspritasi yang baik untuk kemajuan tugas akhir ini. Penulis berharap semoga tugas akhir ini dapat berguna bagi siapapun yang membacanya. Selama mempersiapkan tugas akhir ini penulis banyak mendapat bantuan, dorongan dan motivasi baik secara langsung maupun tidak langsung, maka pada kesempatan ini penulis juga menyampaikan terima kasih kepada: 1. Bapak Dr. Suyanto, M.Kom, selaku Dosen Pembimbing penulis dan selaku Ketua Departemen Matematika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara yang telah banyak memberikan bimbingan dan pengarahan kepada penulis dalam menyelesaikan Tugas Akhir ini. 2. Ibu Dra. Normalina Napitupulu, M.Sc, selaku Ketua Program Studi D3 Teknik Informatika FMIPA USU dan Bapak Drs. James Piter Marbun, M.Kom selaku Sekertaris Program Studi D3 Teknik Informatika FMIPA USU. 3. Bapak Dr. Keriesta Sebayang, M.Si, selaku Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara. 4. Teristimewa untuk Ayahanda Muhammad Juhri dan Ibunda Sri Mulyani yang telah memberikan doa, nasehat dan dukungan baik secara maril ataupun materil. 5. Andika Dwi Nugroho dan Ananda Pandu Kurnia sebagai adik penulis yang telah memberikan dukungan yang penuh terhadap saya. 6. Yuni Aflah dan Icha Meirani selaku teman terbaik dan juga rekan pembimbing penulis. Akhir kata, semoga laporan tugas akhir ini dapat memberikan manfaat dan menambah wawasan dan pengetahuan kita dan semoga Tuhan Yang Maha Esa akan membalas atas dorongan dan juga motivasi yang telah diberikan kepada penulis. Medan, 1 Juli 2018. Anggie Mulya Wardani. v UNIVERSITAS SUMATERA UTARA.

DAFTAR ISI. Halaman i ii iii iv v vi vii viii ix. PERSETUJUAN TUGAS AKHIR PERNYATAAN ORISINILITAS ABSTRAK ABSTRACT PENGHARGAAN DAFTAR ISI DAFTAR GAMBAR DAFTAR TABEL DAFTAR LAMPIRAN BAB 1 PENDAHULUAN 1.1 Latar Belakang 1.2 Rumusan Masalah 1.3 Batasan Masalah 1.4 Manfaat Penelitian 1.5 Metode Penelitian 1.6 Sistematika Penulisan. 1 2 2 3 3 4. BAB 2 LANDASAN TEORI 2.1 Pengertian Sistem Informasi 2.2 Sekilas Tentang Pola Dasar Pakaian 2.3 Sekilas Tentang Perancangan Sistem 2.4 Sekilas Tentang PHP 2.5 Sekilas Tentang Database 2.5.1 Konsep Dasar Database 2.5.2 Komponen-Komponen Database 2.6 Sekilas Tentang MYSQL 2.6.1 Query SQL 2.7 Sekilas Tentang HTML 2.7.1 Fungsi HTML 2.8 Sekilas Tentang CSS 2.9 Sekilas Tentang JavaScript 2.10 Sekilas Tentang Bootstrap. 5 5 6 7 7 8 8 10 10 13 14 15 16 18. BAB 3 PERANCANGAN SISTEM 3.1 Perancangan Output 3.2 Perancangan Input. 19 20 vi. UNIVERSITAS SUMATERA UTARA.

3.3 Perancangan Dialog 3.3.1 Perancangan Halaman User 3.3.2 Perancangan Halaman Admin 3.4 Perancangan Database 3.4.1 Tabel Login Admin 3.4.2 Tabel Input Pola 3.5 Data Flow Diagram 3.6 ERD. 20 20 21 23 23 24 25 27. BAB 4 IMPLEMENTASI SISTEM 4.1 Hasil dan Pembahasan 4.2 Implementasi Antar Muka Website Pola. 29 29. BAB 5 KESIMPULAN DAN SARAN 5.1 Kesimpulan 5.2 Saran. 33 33. DAFTAR PUSTAKA LAMPIRAN. 34 35. vii. UNIVERSITAS SUMATERA UTARA.

DAFTAR GAMBAR. 3.1 Perancangan Dialog Output Halaman Utama User. 18. 3.2 Perancangan Dialog Kumpulan Pola. 21. 3.3 Perancangan Halaman Admin. 22. 3.4 DFD Sistem Informasi Pola. 26. 3.5 ERD (Entitas Relation Diagram). 27. 3.6 Flowchart Sistem. 28. 4.1 Halaman Utama User. 29. 4.2 Menu Kumpulan Pola. 30. 4.3 Menu Referensi Pola. 30. 4.4 Pola Kemeja. 31. 4.5 Pola Gamis. 31. 4.6 Pola Rok. 32. vii. UNIVERSITAS SUMATERA UTARA.

DAFTAR TABEL. 3.1 Tabel Input. 19. 3.2 Tabel Login Admin. 23. 3.3 Tabel Input Pola. 23. 3.4 Tabel Referensi Pola. 24. viii. UNIVERSITAS SUMATERA UTARA.

DAFTAR LAMPIRAN. Nomor Lampiran. Judul. Halaman. 1.. Surat Keterangan Dosen. 34. 2.. Kartu Bimbingan. 35. 3.. Surat Uji Program. 36. 4.. Listing Program. 37. ix. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

BAB 1 PENDAHULUAN. 1.1 Latar Belakang. Pakaian merupakan kebutuhan pokok manusia selain makanan dan tempat tinggal. Manusia membutuhkan pakaian untuk melindungi dan menutupi dirinya. Seiring perkembangan kehidupan manusia, pakaian juga digunakan sebagai symbol status, jabatan maupun kedudukan seseorang yang memakainnya. Namun dibalik pembuatan pakaian terdapat hal yang paling penting dalam pengerjaannya yaitu pola. Pola merupakan prototype bagian-bagian dari pembuatan pakaian. Pola dijadikan contoh agar tidak terjadi kesalahan sewaktu menggunting kain, sesuai dengan pendapat Porrie Muliawan (2006, hal.2) yaitu “Pola dalam bidang jahit menjahit adalah potongan kain atau potongan kertas yang dipakai sebagai contoh untuk membuat baju ketika bahan digunting”. Terdapat dua tahap pembuatan pola agar dapat menghasilkan busana yang sesuai dengan bentuk tubuh yang diinginkan yaitu pola dasar dan pecah pola.. Pola dasar merupakan proses awal dalam pembuatan pola busana sesuai gambar yang didesain sehingga pengetahuan pembuatan pola dasar diperlukan sebagai bekal awal dalam pembuatan berbagai macam pola busana. Sewaktu membuat pola, pola harus disesuaikan dengan ukuran-ukuran sesuai bentuk badan. Dan bagian-bagian tertentu seperti ukuran lingkar leher, lebar dada, panjang dada, hingga lingkar pinggang dan panjang punggung yang diukur satu demi satu dengan pita ukur. Pembuatan pola dasar yang akurat sangat penting untuk menentukan ketepatan serta kenyamanan dari pakaian yang dibuat. Sedangkan pecah pola adalah menyesuaikan model atau desain pada gambar pola dengan contoh yang dikehendaki. kemudian memisah-misahkan bagian-bagian model menjadi pola-pola yang siap dijadikan petunjuk untuk menggunting bahan.. UNIVERSITAS SUMATERA UTARA.

2. Pola dasar berbagai busana seperti blus, rok, gaun, atau kemeja sudah dapat dijadikan sebagai contoh dalam menjahit. Namun tidak semua penjahit mengetahui pola pola apa saja yang digunakan dalam pembuatan pola pakaian dikarenakan banyak penjahit yang belajar otodidak tanpa ada pendalaman materi tentang menjahit.. Media berperan sebagai teknologi pembawa informasi (pesan) yang dapat dimanfaatkan untuk keperluan pembelajaran. Salah satu produk teknologi yang dapat dikembangkan dalam penelitian ini sebagai media pembelajarn adalah media hasil teknologi yang berdasarkan komputer. Dimana informasi yang diberikan disimpan dalam bentuk digital, bukan dalam bentuk cetakan ataupun visual dan hanya tersedia didalam komputer.. Berdasarkan uraian tersebut menjadi dasar pemikiran dalam satu karya ilmiah berupa tugas akhir yang berjudul “Sistem Informasi Pola Dasar Pakaian berbasis Website”.. 1.2 Rumusan Masalah. Berdasarkan latar belakang masalah yang telah dikemukakan sebelumnya maka perumusan dalam tugas akhir ini adalah merancang sistem informasi yang dapat mempermudah penjahit otodidak dalam mengetahui pola-pola dasar pakaian.. 1.3. Batasan Masalah. Batasan-batasan masalah dalam pembuatan sistem informasi ini terdapat batasan masalah, yaitu dalam sistem informasi ini khusus menyajikan pola tidak sampai menyajikan gambaran untuk mencocokan pakaian yang akan disediakan kepada konsumen.. UNIVERSITAS SUMATERA UTARA.

3. 1.4 Manfaat Penelitian. Adapun manfaat dari pembuatan dari sistem informasi ini adalah antara lain: 1. Menambah pengetahuan tentang penelitian yang berkaitan dengan pola dasar menjahit. 2. Mengetahui referensi dan solusi yang diberikan penjahit untuk pelanggan dalam membuat pakaian.. 1.5 Metode Penelitian. Metode penelitian adalah langkah-langkah sistematik yang digunakan untuk mengerjakan atau menyelesaikan suatu masalah. Meode penelitian digunakan sebagai pedoman dalam melaksanakan penelitian agar hasil yang dicapai tidak menyimpang dari tujuan yang dibuat sebelumnya. Dan untuk mempermudah dalam mendapatkan data yang dibutuhkan maka penulis mengunakan metode sebagai berikut :. 1. Studi pustaka yang bertujuan untuk mengumpulkan referensi, mencari serta mempelajari buku-buku, jurnal maupun situs internet mengenai pola dasar pakaian. 2. Materi penelitian ini penulis dapatkan dari narasumber langsung maupun didapat dari buku-buku baik cetak maupun digital. 3. Membuat kerangka kerja sistem yang akan membantu pengerjaan awal dalam membangun antarmuka. Dengan bantuan alat bantu pembangun sistem seperti flowchart dan erd. 4. Tahap pengerjaan sistem untuk pola dasar pakaian menggunakan beberapa alat bantu software dalam membangun sistem seperti software XAMPP yang berguna sebagai pengganti jaringan (jaringan XAMPP bersifat local (localhost) atau hanya berfungsi pada 1 komputer yang digunakan dan juga berfungsi sebagai database local (mysql)), sublime text yang berguna untuk membuat kodingan yang akan membuat sistem, dan sistem ini menggunakan bahasa pemrograman PHP, Java Script, HTML dan CSS.. UNIVERSITAS SUMATERA UTARA.

4. 5. Uji coba kelayakan sistem. Uji coba diperlukan untuk mengetahui apakah sistem sudah bekerja dengan baik atau masih ada kendala yang membuat sistem tidak berjalan. 6. Membuat Laporan Tugas Akhir Membuat laporan tugas akhir sebagai laporan tentang hasil penelitian ke jurusan.. 1.6 Sistematika Penulisan. Sistematika penulisan yang diuraikan untuk memberikan kerangka atau gambaran dari tugas akhir ini, sebagai berikut:. BAB I : PENDAHULUAN Pada bab ini berisi tentang latar belakang masalah, rumusan masalah, batasan. masalah,. manfaat. penelitian,. metodologi. penelitian. dan. sistematika penulisan laporan. BAB II : LADASAN TEORI Pada bab ini berisi tentang uraian ataupun penjelasan teoritis mengenai pengertian sebuah sistem, software yang dibutuhkan serta bahasa pemrograman yang digunakan. BAB III : PERANCANGAN SISTEM Pada bab ini berisi perancangan aplikasi yang akan dibentuk, pengertian perancangan sistem, flowchart, data flow diagram (DFD), persiapan database serta file yang digunakan serta algoritma program. BAB IV : IMPLEMENTASI SISTEM Pada bab ini akan membahas tentang pembangunan sistem serta cara menjalankan website tersebut. BAB V : KESIMPULAN DAN SARAN Pada bab ini merupakan penutup yang merupakan kesimpulan dari pembahasan serta saran-saran penulis dalam kesimpulan yang terdapat dalam penulisan.. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

BAB 2 LANDASAN TEORI. 2.1 Pengertian Sistem Informasi. Sistem informasi merupakan gabungan dari kata sistem dan informasi, dimana sistem adalah suatu jaringan kerja dari prosedur-prosedur yang saling berhubungan, berkumpul bersama sama untuk melakukan kegiatan atau melakukan sasaran tertentu. Sedangakan informasi adalah data yang diolah menjadi bentuk yang lebih berguna dan lebih berarti bagi penerimanya. Sumber informasi adalah data dimana data merupakan kenyataan yang menggambarkan suatu kejadian-kejadian dan kesatuan yang nyata. Kejadian-kejadian (event) adalah kejadian yang terjadi pada saat tertentu (Jeperson Hutahean : 2014). Jadi dapat disimpulkan sistem informasi adalah kombinasi dari manusia, fasilitas atau alat teknologi, media, prosedur dan pengendalian yang ditujukan untuk mengatur jaringan komunikasi yang penting, proses transaksi tertentu dan rutin membantu manajemen dan pemakai intern dan ekstern dan menyediakan dasar untuk pengambilan keputusan yang tepat (John F. Nash 1995:8).. 2.2 Sekilas Tentang Pola Dasar Pakaian. Pakaian adalah kebutuhan pokok manusia selain makanan dan tempat tinggal (rumah). Manusia membutuhkan pakaian untuk melindungi dan menutup dirinya. Namun seiring dengan perkembangan kehidupan manusia, pakaian juga digunakan sebagai simbol status, jabatan, ataupun kedudukan seseorang yang memakainya. Perkembangan dan jenis-jenis pakaian tergantung pada adat-istiadat, kebiasaan, dan budaya yang memiliki ciri khas masing-masing. Pakaian juga meningkatkan keamanan selama kegiatan berbahaya seperti hiking dan memasak, dengan memberikan penghalang antara kulit dan lingkungan. Pakaian juga memberikan penghalang higienis, menjaga toksin dari badan dan membatasi penularan kuman.. UNIVERSITAS SUMATERA UTARA.

6. Pada zaman dahulu orang telah mengenal bentuk-bentuk pakaian. Bentukbentuk busana pada waktu itu sangat sederhana, dengan wujud geometris yaitu segiempat atau segiempat panjang. Setiap bangsa mempunyai cara sendiri-sendiri dalam mengenakan pakaian dengan bentuk geometris tersebut. Ada pakaian yang dilingkarkan atau dililitkan begitu saja pada tubuh, dibantu dengan tali untuk mengikat, ada pula yang melubangi bagian tengah bidangnya untuk memasukkan kepala. Dalam perkembangannya, bentuk-bentuk maupun cara penggunaan busana tersebut digolongkan menjadi bentuk-bentuk dasar busana, yaitu celemek panggul, ponco, tunika. dan kaftan.. Pembuatan pola juga mengalami perkembangan sesuai perkembangan para ahli pembuat pola. Sehingga, pola dapat terbagi menjadi beberapa macam dan berkembang pula kedalam berbagai sistem. Teknik pembuatan pola (Eri novida 2009:8) dapat dilakukan dengan beberapa cara yaitu :. a. Pola pulir atau Sistem draping Cara pembuatan pola busana berdasarkan bentuk badan bukan berdasarkan ukuran badan. Cara pembuatanya dengan melangsaikan kain atau kertas tela langsung pada paspop/badan seseorang hasilnya dikenal dengan pola draping . b. Pola yang digambar pada kertas atau Sistem konstruksi/drafting Cara pembuatan pola busana berdasarkan ukuran badan seseorang tertentu dengan sistem tertentu pula misalnya sistem praktis, Wilsma, soen, Mayneke, Dress making, Bunka, HO dan lain–lain. Pola yang dihasilkan disebut pola konstruksi.. 2.3 Sekilas Tentang Perancangan Sistem. Perancangan. sistem. merupakan tahap. selanjutnya. setelah analisa. sistem,. mendapatkan gambaran dengan jelas tentang apa yang dikerjakan pada analisa sistem, maka dilanjutkan dengan memikirkan bagaimana membentuk sistem tersebut. Perancangan sistem adalah suatu fase dimana diperlukan suatu keahlian perancangan. UNIVERSITAS SUMATERA UTARA.

7. untuk elemen-elemen komputer yang akan mengunakan sistem yaitu pemilihan peralatan dan program komputer untuk sistem yang baru (Kristanto, 2008 : 61).. 2.4 Sekilas Tentang PHP. PHP merupakan bahasa pemrograman yang digunakan untuk membuat aplikasi berbasis website. Sebagai sebuah aplikasi, website tersebut hendaknya memiliki sifat dinamis dan interaktif. Memiliki sifat dinamis artinya website tersebut bisa berubah tampilan kontennya sesuai kondisi tertentu (misalnya, menampilkan produk yang berbeda-beda untuk setiap pengunjung). Interaktif artinya, website tersebut dapat member feedback bagi user. Kode pemrograman standar untuk mendesain website sebenarnya adalah HTML, namun masalahnya tanpa memanfaatkan PHP, kode HTML tidak dapat digunakan untuk membuat website dengan dua sifat di atas. Dengan kata lain, jika hanya mengandalkan HTML5 saja, tampilan situs yang dilihat oleh user satu dan lainnya relatif sama dan statis (Jubilee Enterprise : 2017).. 2.5 Sekilas Tentang Database. Database adalah kumpulan file-file yang berelasi, relasi tersebut biasa ditunjukkan dengan kunci dari tiap file yang ada. Satu database menunjukkan satu kumpulan data yang dipakai dalam satu lingkup perusahaan atau instansi. Dalam satu file terdapat record-record yang sejenis, sama besar, sama bentuk, merupakan satu kumpulan entity yang seragam. Satu record terdiri dari field-filed yang saling berhubungan untuk menunjukkan bahwa field tersebut saling berhubungan untuk menunjukkan bahwa field tersebut dalam satu pengertian lengkap dan direkam dalam satut record. Untuk menyebut isi dari field maka digunakan attribute atau merupakan judul dari satu kelompok entity tertentu, misalnya attribute Alamat menunjukkan entity alamat dari siswa. Entity adalah suatu obyek yang nyata dan akan direkam (Ir. Harianto Kristanto : 1993).. UNIVERSITAS SUMATERA UTARA.

8. 2.5.1. Konsep Dasar Database. Database memiliki suatu konsep yang dimana konsep tersebut diantaranya: a. Field Dapat di katakan field merupakan suatu bagian dari record atau bagian dari suatu tabel yang merupakan item-item kolom data, atau disebut juga sebagai implementasi dari atribut data. b. Record Kumpulan elemen-elemen yang saling berkaitan menginformasikan tentang suatu entity secara lengkap. Satu record mewakili satu data atau informasi tentang seseorang seperti nomor karyawan, nama karyawan, alamat, kota, tanggal masuk. c. File dan Tabel Kumpulan record-record yang sejenis yang mempunyai panjang elemen yang sama, attribute yang sama, namun berbeda-beda data dan valuenya.. 2.5.2 Komponen-Komponen Database. Komponen-komponen pada database atau basis data diantaranya sebagai berikut ini:. a. Data Pada database data akan tersimpan secara terintegrasi, karena database merupakan suatu kumpulan dari berbagai macam file, sehingga disusun dengan cara menghilangkan bagian-bagian file yang redudansi atau file yang rangkap. Dengan database maka data-data yang tersimpan dapat digunakan secara bersama-sama, database dapat diakses oleh pengguna dalam waktu bersamaan.. b. Hardware Hardware disebut juga dengan perangkat keras yaitu perangkat yang dapat diraba secara fisik atau lebih tepatnya perangkat yang mempunyai fisik. Perangkat keras yang digunakan untuk database misalnya seperti second storage salah satunya yaitu harddisk yang digunakan untuk menyimpan data. Lalu perangkat input. UNIVERSITAS SUMATERA UTARA.

9. misalnya seperti keyboard, dan perangkat output misalnya seperti printer yang digunakan untuk mencetak data.. c. Software Software disebut juga dengan perangkat lunak, perangkat ini tidak memiliki fisik berfungsi sebagai perantara antara user dengan data yang ada pada database. Software yang ada pada sistem database biasanya seperti Database Management System atau disingkat DBMS yang berfungsi untuk membantu user supaya dapat mengakses database.. d. User User yang menggunakan database umumnya dibagi menjadi beberapa bagian seperti: 1. System Engineer Merupakan tenaga ahli yang memiliki tanggung jawab dalam implementasi database, selain itu system engineer juga bertanggung jawab atas mengadakan peningkatan serta melaporkan jika terjadi kesalahan pada sistem tersebut kepada pihak lain yang bersangkutan.. 2. DBA (Database Administrator) Database Administrator merupakan user yang tugasnya mengelola sistem database secara keseluruhan.. 3. Programer Merupakan user yang tugasnya membuat aplikasi menggunakan bahasa pemerograman supaya databese dapat di akses menggunakan aplikasi tersebut.. 4. End-User Merupakan user yang mengakses database menggunakan program aplikasi yang dibuat oleh programer atau end-user dapat dikatakan juga sebagai pemakai database saja jadi tidak melakukan pengelola sistem secara menyeluruh atau memprogram aplikasi.. UNIVERSITAS SUMATERA UTARA.

10. 2.6 Sekilas Tentang MYSQL. MySQL adalah Sebuah program database server yang mampu menerima dan mengirimkan datanya sangat cepat, multi user serta menggunakan peintah dasar SQL ( Structured Query Language ). MySQL merupakan dua bentuk lisensi, yaitu FreeSoftware dan Shareware. MySQL yang biasa kita gunakan adalah MySQL FreeSoftware yang berada dibawah Lisensi GNU/GPL ( General Public License ). MySQL merupakan sebuah database server yang free, artinya kita bebas menggunakan database ini untuk keperluan pribadi atau usaha tanpa harus membeli atau membayar lisensinya (Haris Saputro : 2012). MySQL pertama kali dirintis oleh seorang programmer database bernama Michael Widenius . Selain database server, MySQl juga merupakan program yang dapat mengakses suatu database MySQL yang berposisi sebagai Server, yang berarti program kita berposisi sebagai client. Jadi MySQL adalah sebuah database yang dapat digunakan sebagai client mupun server. Database MySQL merupakan suatu perangkat lunak database yang berbentuk database relasional atau disebut Relational Database Management System ( RDBMS ) yang menggunakan suatu bahasa permintaan yang bernama SQL (Structured Query Language ).. 2.6.1 Query SQL. MySQL adalah multiuser database yang menggunakan bahasa Structured Query Language (SQL). MySQL dalam operasi client-server melibatkan server daemon MySQL disisi server dam berbagai program library yang berjalan disisi client. Dan SQL adalah bahasa standart yang digunakan untuk mengakses database server. Berikut adalah Sintaks query SQL dan fungsinya: 1. CREATE DATABASE nama_database; Perintah CREATE DATABASE berfungsi untuk membuat database baru dalam query MySQL. Contoh: CREATE DATABASE toko_online;. UNIVERSITAS SUMATERA UTARA.

11. Selain itu ada juga query CREATE TABLE nama_table (nama_field1 tipe_data1, nama_field2 tipe_data2 … ); , perintah ini berfungsi untuk membuat table dalam database yang telah dibuat sebelumnya. Contoh: CREATE TABLE buku (id_buku int(7), judul varchar(100), jenis varchar(30), penerbit varchar(30), penulis varchar(30), harga (int) ); 2. USE nama_database Untuk membuat table-table di dalam sebuah database, terlebih dahulu kita buka dulu database tersebut dengan perintah USE nama_database. Contoh: USE toko_online; Perintah USE boleh tidak menggunakan akhiran titik koma(;). 3. INSERT INTO nama_table (field1, field2, field3, …) VALUES (field1, field2, field3, …); Query ini berfungsi untuk memasukkan data pada suatu table yang telah dibuat. Contoh: INSERT INTO buku (judul, jenis, penerbit, penulis, harga) Values („Spiderman‟, „Komik‟, „Marvel Publishing‟, „Peter Parker‟, 15000); 4. SELECT (field1, field2, … ) FROM nama_table; Query SELECT berfungsi untuk mengambil dan menampilkan data dalam kolom(field) pada suatu table. Contoh: SELECT judul, penulis, penerbit FROM buku; Dan untuk melihat semua kolom(field) pada suatu table, digunakan perintah sebagai berikut: SELECT * FROM nama_table; Selain itu didalam query SELECT juga terdapat perintah untuk menyaring dan menampilkan data sesuai Kriteria tertentu, sintaksnya sebagai berikut: SELECT (field1, field2, … ) FROM nama_table WHERE Kriteria;. UNIVERSITAS SUMATERA UTARA.

12. atau SELECT (field1, field2, … ) FROM nama_table WHERE Kriteria LIKE „seperti ini‟; Contoh: SELECT judul FROM buku WHERE jenis = „komik‟; Bisa juga dituliskan : SELECT. judul. FROM. buku. WHERE. jenis. LIKE. „komik‟;. 6. DELETE nama_table WHERE Kriteria; Sesuai format sintaksnya, perintah ini digunakan untuk menghapus data record sesuai kriteria yang di inginkan. Contoh: DELETE FROM buku WHERE penulis = „Peter Parker‟; Untuk menghapus seluruh record pada suatu table, gunakan perintah DELETE tanpa menetukan kriterianya. Namun perlu waspada dalam menggunakan perintah ini karena data yang telah terhapus tidak dapat dikembalikan lagi: DELETE FROM nama_table; 7. UPDATE nama_table SET nama_field1=nilai_baru1, nama_field2=nilai_baru2, … WHERE Kriteria; Perintah ini berfungsi untuk memodifikasi nilai kolom (field) dari suatu record. Contoh: UPDATE buku SET judul = „Pengobatan Alternatif‟ WHERE penulis = „Peter Parker‟; Untuk memodifikasi nilai suatu kolom (field) secara keseluruhan, gunakan perintah UPDATE tanpa menentukan kriterianya.. UNIVERSITAS SUMATERA UTARA.

13. 2.7 Sekilas Tentang HTML. HTML adalah bahasa markup internet (web) berupa kode dan simbol yang dimasukkan kedalam sebuah file yang ditujukan untuk ditampilkan didalam sebuah website. Singkatnya, HTML adalah bahasa markup yang digunakan untuk membuat website. Website yang dibuat dengan HTML ini, dapat dilihat oleh semua orang yang terkoneksi dengan internet. Tentunya dengan menggunakan aplikasi penjelajah internet (browser) seperti Internet Explorer, Mozilla Firefox dan Google Chrome.. Seperti yang sudah saya jelaskan sebelumnya, HTML adalah singkatan dari Hyper Text Markup Language. Tapi mengetahui singkatannya saja tidak akan cukup. Karena itu saya akan menyajikan arti dari kata kata tersebut. . HyperText adalah metode dimana kita "berpindah" disekeliling web, dengan mengeklik sebuah teks yang bernama hyperlink. Hyperlink adalah sebuah teks khusus di internet, dimana saat teks tersebut diklik, akan membawa kita ke. . halaman web selanjutnya/halaman web lain yang telah ditentukan. . Markup adalah hal yang dilakukan oleh tag HTML kepada teks yang ada didalamnya. HTML menandai teks yang berada didalamnya sebagai tipe teks tertentu. Misalnya saja jika kita menandai sebuah teks dengan tag html <i>, maka teks tersebut akan berubah menjadi italic (huruf yang miring). Sedangkan jika kita menandainya dengan <b>, maka teks tersebut akan berubah menajadi bold. . (huruf tebal). . Language yang berarti bahasa. HTML adalah sebuah bahasa, yang memiliki kata  kata berupa kode dan syntax seperti bahasa yang lain.. Saat ini bahasa HTML masih terus dikembangkan Hal ini dikarenakan pengguna internet semakin hari semakin berkembang pesat. Oleh karena itu bahasa HTML harus ditingkatkan lagi agar bisa menciptakan halaman web yang lebih berkualitas. Untuk itulah dibentuk sebuah organisasi yang bertanggungjawab mengembangkan bahasa HTML. Organisasi ini bernama W3C.. UNIVERSITAS SUMATERA UTARA.

14. 2.7.1 Fungsi HTML (HyperText Markup Language). HTML (HyperText Markup Language) adalah suatu bahasa yang menggunakan tanda-tanda tertentu (tag) untuk menyatakan kode-kode yang harus ditafsirkan oleh browser agar halaman tersebut dapat ditampilkan secara benar. Secara umum, fungsi HTML adalah untuk mengelola serangkaian data dan informasi sehingga suatu dokumen dapat diakses dan ditampilkan di Internet melalui layanan web. Fungsi HTML yang lebih spesifik yaitu (Agil Faiz Wirawan : 2015) :. 1. Membuat halaman web. 2. Menampilkan berbagai informasi di dalam sebuah browser Internet. 3. Membuat link menuju halaman web lain dengan kode tertentu (hypertext).. Struktur dasar HTML ini biasanya selalu ada dalam setiap file HTML. Penulisan struktur dasar HTML dasar juga harus berurutan atau mengikuti standar struktur HTML yang ada. Struktur dasar HTML terdiri beberapa tag-tag HTML, setiap tag HTML bisa memiliki tag pembuka dan penutup, tapi ada juga yang tidak memiliki tag penutup. <html> <head> <title> </head> <body> </body> </html>. Tag <html> adalah tag pembuka dari keseluruhan halaman web. Semua kode HTML tersebut harus berada didalam tag ini. Dimulai dengan <html> dan ditutup dengan </html>. Tag <head> adalah tag yang umumnya berisi tentang definisi halaman, kode CSS, Javascript, dan kode yang lain. Kode tersebut tidak akan ditampilkan di. UNIVERSITAS SUMATERA UTARA.

15. web browser. Tag <title> adalah tag yang digunakan untuk menampilkan judul dari halaman web yang akan dibuat. Tag ini diawali dengan <title> dan diakhiri dengan tag </title>, penempatan tag ini harus berada didalam tag <html>. Tag <body> adalah tag yang didalamnya dapat diisi dengan elemen-elemen yang akan ditampilkan dalam halaman web seperti gambar, paragraf, link, dll. Tag ini diawali dengan <body> dan ditutup dengan </body>.. 2.8 Sekilas Tentang CSS. CSS (Cascading Style Sheet) ini adalah salah satu bahasa desain web (style sheet language) dimana mampu mengontrol format tampilan sebuah halaman web yang ditulis dengan menggunakan penanda atau deisebut dengan (markup laguage). Umumnys CSS ini digunakan dalam mendesain sebuah halaman HTML dan juga XHTML, akan tetapi sekarang CSS dapat diaplikasikan pula untuk segala dokumenXML, termasuk juga di dalam nya SVG dan juga XUL bahkan sampai dengan sistem operasi Android (Dwiky Andika : 2016).. CSS diciptakan guna memisahkan antara konten utama dengan tampilan dokumen yang termasuk layout, font dan juga warna. Pemisahan ini berguna untuk meningkatkan daya akses konten pada web, kemudian menyediakan lebih banyak fleksibilitas dan juga kontrol dalam spesifikasi dari sebuah karakteristik pada sebuah tampilannya, dimana juga dapat memungkinkan untuk membagi halaman untuk sebuah formatting dan mengurangi kesulitan dalam penulisan kode dan juga struktur dari konten, misalnya dalam teknik tableless pada desain web.. CSS ini juga memungkinkan sebuah halaman untuk menampilkan dalam berbagai style dengan menggunakan metode pembawaan yang berbeda pula, contohnya adalah on-screen, in-print, by voice, dan lain sebagainya. Selain itu, pemilik konten web juga bisa menentukan link yang menghubungkan konten dengan file CSS (Cascading Style Sheet). Tujuan utama dari CSS dikembangakan ialah agar dapat membedakan konten dari dokumen dan dari tampilan dokumen. Maka dari itu, pembuatan dalam pemrograman. UNIVERSITAS SUMATERA UTARA.

16. ulang web pun akan lebih mudah dilakukan. Hal-hal yang terlibat dalam desain web itu adalah warna, ukuran dan formatting. Dengan adanya CSS ini, konten dan desain web akan tampak mudah saat dibedakan, jadi memungkinkan juga untuk melakukan pengulangan pada tampilan-tampilan tertentu pada suatu web, sehingga akan sangat memudahkan dalam hal membuat halaman web yang banyak, dimana pada akhirnya bisa menghemat waktu dalam pembuatan web.. Fungsi utama dari css ialah mendesain, merancang, merubah, dan juga membentuk halaman pada website ataupun blog dan isi dari halaman website itu ialah tag-tag html, logikanya css itu bisa mengubah tag-tag html yang sederhana sehingga bisa menjadi lebih fungsional dan juga menarik.. 2.9 Sekilas Tentang Javascript. Javascript adalah bahasa yang berbentuk kumpulan skrip yang berjalan pada suatu dokumen HTML. Bahasa ini adalah bahasa pemrograman untuk memberikan kemampuan tambahan terhadap bahasa HTML dengan mengijinkan pengeksekusian perintah perintah di sisi user, yang artinya di sisi browser bukan di sisi server web. Javascript diperkenalkan pertama kali oleh Brendan Eich yang bekerja di Netscape pada tahun 1995. Pada awalnya bahasa ini dinamakan “LiveScript” yang berfungsi sebagai bahasa sederhana untuk browser Netscape Navigator 2. Kemudian sejalan dengan sedang giatnya kerjasama antara Netscape dan Sun (pengembang bahasa pemrograman “Java” ) pada masa itu, maka Netscape memberikan nama “Javascript” kepada bahasa tersebut pada tanggal 4 desember 1995. Berikut ini satu tabel yang berisi beberapa perbandingan mendasar antara Java dan Javascript (Ade Nugraha : 2015).. Javascript. Java. Bahasa yang dijalankan langsung. Bahasa yang dijalankan oleh program. oleh browser. eksternal (Java Virtual Machine) diintegrasikan ke dalam browser. Didefinisikan dengan tag <script> pada. Didefinisikan dengan tag <applet>. UNIVERSITAS SUMATERA UTARA.

17. halaman HTML Kode program bersifat terbuka dan dapat. Kode program dapat bersifat tertutup. dibaca melalui browser Tidak memerlukan proses kompilasi. Perlu kompilasi untuk menghasilkan. menjadi file lainnya. file .class. Javascript adalah bahasa yang “case sensitive” artinya membedakan penamaan variabel dan fungsi yang menggunakan huruf besar dan huruf kecil, setiap instruksi dapat diakhiri dengan karakter titik koma (;). Penulisan Kode Javascript ·. Menggunakan tag <SCRIPT> Kode javascript dalam HTML dituliskan dengan menggunakan tag <script> dengan format sebagai berikut : <script language=”javascript”> ...... </script>. · Menggunakan file eksternal Cara berikutnya adalah menuliskan kode program Javascript dalam suatu file teks dan kemudian file teks yang berisi kode Javascript di panggil dari dalam dokumen HTML (khusus Netscape mulai versi 3 keatas). Kode yang kita sisipkan kedalam dokumen HTML adalah sebagai berikut : <script language=”javascript” src=”lokasi/file.js”></script> · Melalui event tertentu Event adalah sebutan dari satu aksi yang dilakukan oleh user, contohnya seperti klik tombol mouse, pembahasan lebih lanjut ada di materi lainnya. Kodenya dapat di tulis sebagai berikut : <tag eventHandler="kode Javascript yang akan dimasukkan">. UNIVERSITAS SUMATERA UTARA.

18. Dokumentasi Program sangat dianjurkan untuk menambahkan komentar-komentar di dalam skrip atau kode program yang dibuat untuk keperluan dokumentasi pengembangan. Hal ini berguna antara lain : a. Sebagai pengingat bagian-bagian khusus di dalam skrip tersebut, jika akan merubah sesuatu di dalamnya, mungkin beberapa bulan kemudian sudah tidak ingat lagi dengan detail dan alur dari skrip tersebut. b. Untuk membuat orang yang tidak tahu program yang dibuat jadi mengerti dengan membaca petunjuk-petunjuk yang dibuat melalui komentar-komentar.. 2.10 Sekilas Tentang Bootstrap. Bootstrap adalah framework front-end yang intuitif dan powerful untuk pengembangan aplikasi web yang lebih cepat dan mudah. Bootstrap menggunakan HTML,CSS dan JavaScript. Bootstrap dikembangkan oleh Mark Otto dan Jacob Thornton dari Twitter. Framework ini diluncurkan sebagai produk open source ada Agustus 2011 di GitHub. Bootstrap memiliki fitur-fitur komponen interface yang bagus seperti Typography, Forms, Buttons, Tables, Navigations, Dropdowns, Alerts, Modals, Tabs, Accordion, Carausel, dan lain sebagainya. Dengan menggunakan Bootstrap tamplan layout situs menjadi responsive dengan mudah (Jubilee Enterprise : 2016).. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

BAB 3 PERANCANGAN SISTEM. 3.1. Peracangan Output. Output merupakan produk dari sistem informasi yang dapat dilihat. Output ini dapat berupa hasil yang dikeluarkan di media keras (kertas dan lain-lain) dan output yang berupa hasil dikeluarkan ke media lunak (tampilan dilayar) (Ida Bagus Ketut Surya Arnawa, S.Kom : 2012). Output juga dapat diartikan sebagai informasi yang dikirim pengguna melalui sistem informasi dalam bentuk internet, extranet ataupun world wide web (www).. Header. Content. Footer. Gambar 3.1 Perancangan Dialog Output Halaman Utama User. UNIVERSITAS SUMATERA UTARA.

20. 3.2. Perancangan Input. Input merupakan data yang masuk ke dalam sistem informasi, ini diperlukan ada karena bahan dasar dalam pengolahan informasi, input yang masuk ke dalam sistem dapat langsung diolah menjadi informasi atau jika belum dibutuhkan sekarang dapat disimpan terlebih dahulu dalam bentuk basisdata (Ida Bagus Ketut Surya Arnawa, S.Kom: 2012). Kualitas sistem input juga akan menentukan kualitas hasil dari output. Sistem input yang digunakan antara lain:. Tabel 3.1 Tabel Input Entitas Admin. Input Kode Pola Nama Pola Pakaian Gambar Pola Pakaian Keterangan Pola Pakaian Kata kunci pencarian data. User. Pencarian data. 3.3 Perancangan Dialog. Perancangan website Sistem Informasi Pola Pakaian ini terbagi menjadi rancangan tampilan website untuk halaman user/ pengguna dan tampilan halaman administrator.. 3.3.1 Perancangan Halaman User Tampilan awal untuk website harus dibuat semenarik mungkin dan juga isi yang ditampilkan harus sesuai serta lengkap. Karena para pengguna akan merasa tertarik dan juga merasa website yang diberikan menyampaikan isi yang sesuai dengan apa yang diinginkan pengguna tersebut. Berikut tampilan untuk halaman pengguna antara lain :. UNIVERSITAS SUMATERA UTARA.

21. Header. Home. Kumpulan. Referensi. Pola. Pola. Search. Content. Footer. Gambar 3.2 Perancangan Dialog Kumpulan Pola. Tampilan halaman tersusun dari beberapa elemen antara lain: 1. Header. : Kepala Website biasanya berupa nama website.. 2. Menu terdiri dari. . . Home. : Halaman utama pengguna. . Pola. : Halaman yang berisi berbagai pola pakaian yang dibutuhkan. . Referensi : Merupakan informasi yang berisi referensi pola baru. . Search : Digunakan untuk pencarian cepat. 3. Footer : Bagian bawah dari website. 3.3.2 Perancangan Halaman Admin. Halaman administrator adalah halaman website yang hanya bisa dibuka oleh pemilik atau pengurus website. Dari halaman ini pengurus website mengubah isi website melalui program yang telah disiapkan oleh jasa pembuatan website. Setiap perubahan yang dilakukan di halaman ini akan ditampilkan di halaman frontpage secara otomatis. Tampilan halaman admin antara lain:. UNIVERSITAS SUMATERA UTARA.

22. Header. Home. Kumpulan Pola. Referensi Pola. Search. Tabel Kumpulan Pola. Footer. Gambar 3.3 Perancangan Halaman Admin. Tampilan halaman tersusun dari beberapa elemen antara lain: 1. Header. : Kepala Website biasanya berupa nama website.. 2. Menu terdiri dari . Home. . Kumpulan Pola. : Halaman Awal Pengguna : Halaman yang yang digunakan untuk melihat dan. memasukkan pola yang telah didokumentasikan. . Referensi Pola. : Halaman yang yang digunakan untuk melihat dan. memasukkan referensi pola baru. . Search. : Digunakan untuk pencarian cepat. 3. Tabel Kumpulan Pola : Berisi hasil inputan pola yang dimasukkan di Kumpulan Pola maupun Referensi Pola. 4. Footer : Bagian bawah dari website.. UNIVERSITAS SUMATERA UTARA.

23. 3.4 Perancangan Database. Dalam pembuatan website Sistem Informasi Pola Pakaian ini dibutuhkan database yang berfungsi untuk menyimpan informasi yang telah dimasukkan. Berikut adalah rancangan database untuk website Sistem Informasi Pola Pakaian. Query untuk membuat database baru dengan query CREATE db_pola; dan memanggilnya kembali dengan query USE db_pola. 3.4.1 Tabel Login Admin Tabel login admin digunakan untuk masuk ke halaman utama administrator dan mengelola isi database administrator atau orang yang berhak mengelola sistem website. Query membuat tabel login admin yaitu : CREATE tbl_login( id_admin int(11), username varchar(50), password varchar(50), primary key(id_admin) ); Tabel 3.2 Tabel Login Admin Field id_admin username password. Tipe Int Varchar varchar. Ukuran 11 50 50. Keterangan Primary Key. 3. 4.2 Tabel Pola Tabel input pola digunakan untuk menyimpan data yang akan ditampilkan di pola halaman user. Query membuat tabel pola CREATE tbl_pola( kode_pola int(11), nama varchar(50), keterangan varchar(100), gambar varchar(55), gambar1 varchar(55), gambar2 varchar(55),. UNIVERSITAS SUMATERA UTARA.

24. gambar3 varchar(55), gambar4 varchar(55), gambar5 varchar(55), primary key(kode_pola) ); Tabel 3.3 Tabel Pola Field kode_pola nama keterangan gambar gambar1 gambar2 gambar3 gambar4 gambar5. Tipe Varchar Varchar Varchar Varchar Varchar Varchar Varchar Varchar Varchar. Ukuran 50 50 100 55 55 55 55 55 55. Keterangan Auto Increment. 3. 4.2 Tabel Referensi Pola Tabel referensi_pola digunakan untuk menyimpan data yang akan ditampilkan di pola halaman referensi pola. Query membuat tabel referensi CREATE referensi_pola( kode_pola int(11), nama varchar(50), keterangan varchar(100), gambar varchar(55), gambar1 varchar(55), gambar2 varchar(55), gambar3 varchar(55), gambar4 varchar(55), gambar5 varchar(55), primary key(kode_pola) );. UNIVERSITAS SUMATERA UTARA.

25. Tabel 3.4 Tabel Referensi Pola Field kode_pola nama keterangan gambar gambar1 gambar2 gambar3 gambar4 gambar5. Tipe Varchar Varchar Varchar Varchar Varchar Varchar Varchar Varchar Varchar. Ukuran 50 50 100 55 55 55 55 55 55. Keterangan Auto Increment. 3.5 DFD (Data Flow Diagram). Data Flow Diagram (DFD) atau yang disingkat DFD merupakan suatu diagram yang menggambarkan aliran data dalam suatu entitas ke sistem atau sistem ke entitas. DFD juga diartikan sebagai teknik grafis yang menggambarkan alir data dan transformasi yang digunakan sebagai perjalanan data dari input atau masukan menuju keluaran atau output (Agus Saputra 2014:8). Tampilan Data Flow Diagram untuk sistem ini sebagai berikut:. UNIVERSITAS SUMATERA UTARA.

26. Admin -Info admin. Data pola. -Info Pola -Info Search -Info Referensi Pola. Sistem Informasi Pola Dasar Pakaian. -Info Pola. Pengguna/Penjahit. -Info Referensi Pola -Info Search. Gambar 3.4 DFD Sistem Informasi Pola. UNIVERSITAS SUMATERA UTARA.

27. 3.6 ERD. Entity. Relationship. Diagram(ERD). adalah. model. konseptual. yang. mendeskripsikan hubungan antara penyimpanan. ERD digunakan untuk memodelkan struktur data dan hubungan antar data.. kode_pola. Mencari. Search nama_pola. Mengelola. user. Id_admin. password. admin username. Mencari. nama_pol gambar_pol kode_pol. Mengelola keterangan_po. pola. Gambar 3.5 ERD (Entitas Relation Diagram). UNIVERSITAS SUMATERA UTARA.

28. User. Admin. Login. Tidak Menginput data Pola. Mencari Pola Data Lengkap?. Simpan data Pola Iya. Menampilkan Hasil. Database Pola. Pencarian Pola. Pencarian Pola Pakaian. Gambar 3.6 Flowchart Sistem. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

BAB 4 HASIL DAN PEMBAHASAN. 4.1. Hasil dan Pembahasan Implementasi yang dibuat dari perancangan sistem yang telah dilakukan terdiri dari implementasi database dan implementasi tampilan antar muka aplikasi pengguna dan admin.. 4.1.1 Implementasi Antar Muka Website Pola Implementasi dari website pola baju terdiri dari menu login yang digunakan oleh user dan admin hingga melihat pola untuk user serta pengelolaan sistem informasi pola yag dikelola oleh admin. a.. Halaman Utama User Halaman utama ini merupakan menu yang berisi menu menu kumpulan pola dan referensi pola.. Gambar 4.1 Halaman Utama. UNIVERSITAS SUMATERA UTARA.

30. b.. Menu Kumpulan Pola Menu Kumpulan Pola berisi pola-pola yang sudah pernah dibuat dan didokumentasi. Menu kumpulan pola berisi menu pola Kemeja, Gamis, Kebaya, Celana Kulot, Rok Span .. Gambar 4.2 Menu Kumpulan Pola. c.. Menu Referensi Pola Menu referensi pola merupakan menu yang menyajikan pola pola referensi yang bisa digunakan dalam membuat pola baru.. Gambar 4.3 Menu Referensi Pola. UNIVERSITAS SUMATERA UTARA.

31. d.. Halaman Pola Kemeja Halaman ini berisikan pola kemeja yang didokumentasikan agar dapat melihatnya kembali. Dihalaman ini berisi gambar gambar dari pola kemeja.. Gambar 4.4 Pola Kemeja. e.. Halaman Pola Gamis Sama halnya dengan halaman kemeja, halaman ini juga berisikan pola gamis yang didokumentasikan agar dapat melihatnya kembali. Dihalaman ini berisi gambar gambar dari pola gamis. . Gambar 4.5 Pola Gamis. UNIVERSITAS SUMATERA UTARA.

32. f.. Halaman Rok di Menu Refensi Pola Sama halnya juga dengan halaman kemeja dan gamis, halaman ini juga berisikan pola rok yang didokumentasikan sebagai bahan referensi dalam membuat pola terbaru. Hanya saja Halaman Rok ini berada pada menu Referensi Pola. Dihalaman ini berisi gambar gambar dari pola rok.. Gambar 4.5 Pola Rok. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

BAB 5 KESIMPULAN DAN SARAN. 5.1 Kesimpulan. Dari hasil dan pembahasan yang telah dilakukan dalam pembuatan Sistem Informasi Pola Pakaian ini maka diperoleh kesimpulan antara lain sistem informasi pola pakaian ini dirancang untuk memudahkan pengguna untuk mengingat kembali pola yang telah dibuat tanpa harus kembali membuka pola yang lusuh karena terlalu lama disimpan. Dan sistem ini juga menyediakan referensi pola yang diperuntukkan sebagai referensi baru dalam membuat pola. 5.2 Saran. Berdasarkan kesimpulan diatas, adapun beberapa saran penulis dalam pembuatan sistem ini adalah pola yang dimasukkan belum termasuk gambar pakaian yang telah jadi dan penulis terkendala dalam membuat hasiln upload di sistem user dapat ditampilkan dalam satu halaman sistem informasi dikarenakan kurangya pengetahuan. dalam. pengkodingan. sistem.. Oleh. sebab. itu. penulis. akan. mengembangkan sistem infomasi ini lebih baik di masa yang akan datang.. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

DAFTAR PUSTAKA. Andika, Dwiky.2016.Pengertian CSS (Cascading Style Sheet) https://www.itjurnal.com/pengertian-css-cascading-style-sheet (diakses tanggal 1 Juli 2018) Arnawa, Ida Bagus Ketut Surya S.Kom.2014.Rancang Bangun Sistem Informasi Perkuliahan Pada STMIK STIKOM Bali Berbasis Web Responsive. STMIK STIKOM Bali : Bali Enterprise, Jubilee.2016.Pemrograman Bootstrap untuk Pemula.PT.Elex Media Komputindo:Jakarta Enterprise, Jubilee.2017. PHP Komplet.PT.Elex Media Komputindo:Jakarta F Nash, John, diterjemahkan oleh La Midjan.2003.”Sistem Informasi Akuntansi I Pendekatan Manual Pratika Penyusunan Metode danProsedur”:.Bandung : Lembaga Informatika Akuntansi Hutahean, Jeperson.2014.Konsep Sistem Informasi.Kisaran : Deepublish Kadir, Abdul.2002.Dasar Pemrograman Web Dinamis menggunakan PHP.Yogyakarta: Andi Kenneth, E Kendall, Jullie, E Kendal. 2003.Analisis dan Perancangan Sistem Jilid I.Jakarta: PT.Index Kelompok Gramedia Kristanto, Andri.2008.Perancangan Sistem Informasi dan Aplikasinya.Gava Media: Yogyakarta Kristanto, Harianto Ir.1993.Konsep dan Perancangan Database.Andi:Yogyakarta Nugraha, Ade.2015.Pengertian JavaScript dan Contohnya https://bukanlagiaku.blogspot.com/2015/05/pengertian-javascript-dan contohnya.html?m=1 (diakses tanggal 1 Juli 2018) Saputra, Agus.2014.Website periklanan PHP. CV. ASFA Solution : Jakarta Saputro, Haris.2012. Modul Pembelajaran Praktek Basis Data (MySQL).Universitas Dian Nuswantoro:Semarang //http://dinus.ac.id/repository/docs/ajar/materi_1.pdf (diakses tanggal 1 Juli 2018) Wirawan, Faiz Agil.2015. Pengertian HTML, Fungsi HTML serta Sejarah HTML http://www.burung-net.com/2015/05/pengertian-html-fungsi-html-serta-sejarahhtml.html (diakses tanggal 1 Juli 2018). UNIVERSITAS SUMATERA UTARA.

Wibowo, Chintia Akni, etc.2016.Makalah Sistem informasi jasa penjahit busana wanita (studi kasus : olive collection).Surabaya : Universitas Narotama Surabaya. UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

UNIVERSITAS SUMATERA UTARA.

LAMPIRAN index.php. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Pola Pakaian</title> <!-- Bootstrap --> <link rel="icon" type="image" href="img/ikon.jpg"> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.mi n.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js "></script> <![endif]--> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="./jquery.min.js"></script> <script type="text/javascript" src="./polajahit/js/bootstrap.js"></script> </head> <body> <div class="header"> <img src="img/logobaru.png" height="100px" width="100px"> </div>. align="left". <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="user.php"><font color="#000000">Pola Pakaian</font></a> </div> <ul class="nav navbar-nav"> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Kumpulan Pola</font>. UNIVERSITAS SUMATERA UTARA.

<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="kemeja.php">Kemeja</a></li> <li><a href="gamis.php">Gamis</a></li> <li><a href="kebaya.php">Kebaya</a></li> <li><a href="kulot.php">Celana Kulot</a></li> </ul> </li> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Referensi Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="rok.php">Rok</a></li> <li><a href="blouse.php">Blouse</a></li> <li><a href="kamisol.php"> Camissole</a></li> <li><a href="dress.php">Long Sleeve Dress </a></li> <li><a href="celana.php">Celana Pleated Trousers</a></li> <li><a href="blazer.php">Colarless Blazer</a></li> </ul> </li> </ul> <ul class="nav navbar-nav navbar-right"> <form class="navbar-form navbar-left" role="search" method="get" action="cari.php"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search" name="cari"> </div> <button type="submit" class="btn value="Cari">Search</a></button> </form>. btn-warning". </ul> </div> <div class="content"> <img src="img/jahit7.jpg"> </div> <div class="footer"> <center>&copy Sistem Informasi Pola Pakaian by Anggie Mulya Wardani 2018</center> </div>. UNIVERSITAS SUMATERA UTARA.

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquer y.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>. style.css. .container-fluid{ background: #e6e600; padding:20px; } .footer{ height:50px; line-height:50px; background:#333; color:#fff; }. cari.php. <?php include 'koneksi.php'; ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Pola Pakaian</title> <!-- Bootstrap --> <link rel="icon" type="image" href="img/ikon.jpg"> <link href="css/bootstrap.min.css" rel="stylesheet"> <script type="text/javascript" src="js/bootstrap.js"></script> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]>. UNIVERSITAS SUMATERA UTARA.

<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.mi n.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js "></script> <![endif]--> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="./jquery.min.js"></script> <script type="text/javascript" src="./polajahit/js/bootstrap.js"></script> </head> <body> <div class="header"> src="img/logobaru.png" <img height="100px" width="100px"> </div>. align="left". <div class="container-fluid"> <div class="navbar-header"> href="index.php"><font <a class="navbar-brand" color="#000000">Pola Pakaian</font></a> </div> <ul class="nav navbar-nav"> <li class="dropdown"> <ul class="dropdown-menu"> <li><a href="kemeja.php">Kemeja</a></li> <li><a href="gamis.php">Gamis</a></li> <li><a href="kebaya.php">Kebaya</a></li> <li><a href="kulot.php">Celana Kulot</a></li> </ul> </li> <li class="dropdown"> data<a class="dropdown-toggle" toggle="dropdown" href="#"><font color="#000000">Referensi Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="rok.php">Rok</a></li> <li><a href="blouse.php">Blouse</a></li> <li><a href="kamisol.php"> Camissole</a></li> <li><a href="dress.php">Long Sleeve Dress </a></li> <li><a href="celana.php">Celana Pleated Trousers</a></li> <li><a href="blazer.php">Colarless Blazer</a></li> </li> </ul>. UNIVERSITAS SUMATERA UTARA.

<ul class="nav navbar-nav navbar-right"> <form class="navbar-form navbar-left" role="search" method="get" action="cari.php"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search" name="cari"> </div> <button type="submit" class="btn value="Cari">Search</a></button> </form>. btn-warning". </ul> </div> </div> <?php if(isset($_GET['cari'])){ $cari = $_GET['cari']; echo "<b>Hasil pencarian : ".$cari."</b>"; } ?> <div class="table-responsive"> <table class="table table-bordered table-striped table-hover"> <?php if(isset($_GET['cari'])){ $cari = $_GET['cari']; $data = mysql_query("select * from pola where nama like '%".$cari."%'"); }else{ $data = mysql_query("select * from pola"); } while($d = mysql_fetch_array($data)){ ?> <?php echo $d['nama']; ?></font><br> <?php echo $d['keterangan']; ?><br> <center> <img src="<?php echo $d['gambar']?>" width="200"><br><br> <img src="<?php echo $d['gambar1']?>" width="200"><br><br> <img src="<?php echo $d['gambar2']?>" width="200"><br><br>. UNIVERSITAS SUMATERA UTARA.

<img src="<?php echo width="200"><br><br> <img src="<?php echo width="200"><br><br> <img src="<?php echo width="200"><br><br> </center>. $d['gambar3']?>" $d['gambar4']?>" $d['gambar5']?>". <?php } ?> </div> <!-- Footers --> <div class="footer"> <center>&copy Sistem Informasi Mulya Wardani 2018</center> </div>. Pola Pakaian by Anggie. <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/j query.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>. cari-referensi.php. <?php include 'koneksi.php'; ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Pola Pakaian</title> <!-- Bootstrap --> <link rel="icon" type="image" href="img/ikon.jpg"> <link href="css/bootstrap.min.css" rel="stylesheet"> <script type="text/javascript" src="js/bootstrap.js"></script> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->. UNIVERSITAS SUMATERA UTARA.

<!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.mi n.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js "></script> <![endif]--> <link rel="stylesheet" type="text/css" href="style.css"> <script type="text/javascript" src="./jquery.min.js"></script> <script type="text/javascript" src="./polajahit/js/bootstrap.js"></script> </head> <body> <div class="header"> <img src="img/logobaru.png" height="100px" width="100px"> </div>. align="left". <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="index.php"><font color="#000000">Pola Pakaian</font></a> </div> <ul class="nav navbar-nav"> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Kumpulan Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="kemeja.php">Kemeja</a></li> <li><a href="gamis.php">Gamis</a></li> <li><a href="kebaya.php">Kebaya</a></li> <li><a href="kulot.php">Celana Kulot</a></li> </ul> </li> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Referensi Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="rok.php">Rok</a></li> <li><a href="blouse.php">Blouse</a></li> <li><a href="kamisol.php">Camissole</a></li>. UNIVERSITAS SUMATERA UTARA.

<li><a href="dress.php">Long Sleeve Dress </a></li> <li><a href="celana.php">Celana Pleated Trousers</a></li> <li><a href="blazer.php">Colarless Blazer</a></li> </ul> </li> </ul> <ul class="nav navbar-nav navbar-right"> <form class="navbar-form navbar-left" role="search" method="get" action="cari-referensi.php"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search" name="cari"> </div> <button type="submit" class="btn value="Cari">Search</a></button> </form>. btn-warning". </ul> </div> </div> <?php if(isset($_GET['cari'])){ $cari = $_GET['cari']; echo "<b>Hasil pencarian : ".$cari."</b>"; } ?> <div class="table-responsive"> <table class="table table-bordered table-striped table-hover"> <?php if(isset($_GET['cari'])){ $cari = $_GET['cari']; $data = mysql_query("select * from referensi_pola where nama like '%".$cari."%'"); }else{ $data = mysql_query("select * from referensi_pola"); } while($d = mysql_fetch_array($data)){ ?> <?php echo $d['keterangan']; ?><br> <center> <img src="<?php echo $d['gambar']?>" width="1080" height="980"><br><br>. UNIVERSITAS SUMATERA UTARA.

<img src="<?php echo $d['gambar1']?>" width="1080" height="980"><br><br> </center> <?php } ?> </div> <!-- Footers --> <div class="footer"> <center>&copy Sistem Informasi Pola Pakaian by Anggie Mulya Wardani 2018</center> </div> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4 /jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>. kemeja.php. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Pola Pakaian</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"> <link rel="icon" type="image" href="img/ikon.jpg"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.mi n.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js "></script>. UNIVERSITAS SUMATERA UTARA.

<![endif]--> </head> <style type="text/css"> .container-fluid{background: #e6e600; padding:20px;} body { background-color: #e5e5e5; } .meta-post { font-size: 12px; margin-bottom: 10px; } .header header { background-color: #fff; padding: 10px 20px; } article.posts { padding: 10px 20px; background-color: #fff; margin-top: 20px; } aside.widgets { padding: 10px 20px; margin-top: 20px; background-color: #fff; } aside.widgets ul { margin:0; padding:0; } aside.widgets li { list-style: none; padding: 0; margin:0; } .widget-title { border-bottom: 4px solid #E74C3C; padding-bottom: 4px; } .content{ font-size: 20px; font-family: "Times New Roman", Times, serif; } </style> <body> <div class="header"> <img src="img/logobaru.png" height="100px" width="100px"> </div>. align="left". UNIVERSITAS SUMATERA UTARA.

<div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="index.php"><font color="#000000">Pola Pakaian</font></a> </div> <ul class="nav navbar-nav"> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Kumpulan Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="kemeja.php">Kemeja</a></li> <li><a href="gamis.php">Gamis</a></li> <li><a href="kebaya.php">Kebaya</a></li> <li><a href="kulot.php">Celana Kulot</a></li> </ul> </li> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Referensi Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="rok.php">Rok</a></li> <li><a href="blouse.php">Blouse</a></li> <li><a href="kamisol.php">Camissole</a></li> <li><a href="dress.php">Dress </a></li> <li><a href="celana.php">Celana</a></li> <li><a href="blazer.php">Blazer</a></li> </ul> </li> </ul> <ul class="nav navbar-nav navbar-right"> <form class="navbar-form navbar-left" role="search" method="get" action="cari.php"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search"> </div> <button type="submit" class="btn btnwarning">Search</button> </form> </ul> </div> </div> <div class="row"> <div class="col-md-12 articles" id="site-content"> <article class="posts">. UNIVERSITAS SUMATERA UTARA.

<h2 class="title-post">Pola Kemeja Pria</h2> <div class="meta-post"> <span><em class="glyphicon glyphiconuser"></em> Bu Sri</span> <span><em class="glyphicon glyphicontime"></em> 23 Juni 2018</span> </div> <div class="content"> <?php include "koneksi.php"; $data = mysql_query("SELECT * FROM pola WHERE nama='Kemeja'"); while($hasil=mysql_fetch_array($data)){ ?> <?php echo $hasil['keterangan']; ?><br> <center> <img src="<?php echo $hasil['gambar3']?>" width="1080" height="980"><br><br> <img src="<?php echo $hasil['gambar4']?>" width="1080" height="980"><br><br> <img src="<?php echo $hasil['gambar']?>" width="1080" height="980"><br><br> <img src="<?php echo $hasil['gambar1']?>" width="1080" height="980"><br><br> <img src="<?php echo $hasil['gambar2']?>" width="1080" height="980"><br><br> <img src="<?php echo $hasil['gambar5']?>" width="1080" height="980"><br><br> </center> <?php } ?> </div> </article> </div> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4 /jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>. UNIVERSITAS SUMATERA UTARA.

gamis.php. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Pola Pakaian</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"> <link rel="icon" type="image" href="img/ikon.jpg"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.mi n.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js "></script> <![endif]--> </head> <style type="text/css"> .container-fluid{background: #e6e600; padding:20px;} body { background-color: #e5e5e5; } .meta-post { font-size: 12px; margin-bottom: 10px; } .header header { background-color: #fff; padding: 10px 20px; } article.posts { padding: 10px 20px; background-color: #fff; margin-top: 20px; } aside.widgets { padding: 10px 20px;. UNIVERSITAS SUMATERA UTARA.

margin-top: 20px; background-color: #fff; } aside.widgets ul { margin:0; padding:0; } aside.widgets li { list-style: none; padding: 0; margin:0; } .widget-title { border-bottom: 4px solid #E74C3C; padding-bottom: 4px; } .content{ font-size: 20px; font-family: "Times New Roman", Times, serif; } </style> <body> <div class="header"> src="img/logobaru.png" <img height="100px" width="100px"> </div>. align="left". <div class="container-fluid"> <div class="navbar-header"> href="index.php"><font <a class="navbar-brand" color="#000000">Pola Pakaian</font></a> </div> <ul class="nav navbar-nav"> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Kumpulan Pola</font> <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="kemeja.php">Kemeja</a></li> <li><a href="gamis.php">Gamis</a></li> <li><a href="kebaya.php">Kebaya</a></li> <li><a href="kulot.php">Celana Kulot</a></li> </ul> </li> <li class="dropdown"> <a class="dropdown-toggle" datatoggle="dropdown" href="#"><font color="#000000">Referensi Pola</font> <span class="caret"></span></a>. UNIVERSITAS SUMATERA UTARA.

<ul class="dropdown-menu"> <li><a href="rok.php">Rok</a></li> <li><a href="blouse.php">Blouse</a></li> <li><a href="kamisol.php">Camissole</a></li> <li><a href="dress.php">Dress </a></li> <li><a href="celana.php">Celana</a></li> <li><a href="blazer.php">Blazer</a></li> </ul> </li> </ul> <ul class="nav navbar-nav navbar-right"> <form class="navbar-form navbar-left" role="search" method="get" action="cari.php"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search"> </div> <button type="submit" class="btn btnwarning">Search</button> </form> </ul> </div> </div> <div class="row"> <div class="col-md-12 articles" id="site-content"> <article class="posts"> <h2 class="title-post">Pola Kemeja Pria</h2> <div class="meta-post"> <span><em class="glyphicon glyphiconuser"></em> Bu Sri</span> <span><em class="glyphicon glyphicontime"></em> 23 Juni 2018</span> </div> <div class="content"> <?php include "koneksi.php"; $data = mysql_query("SELECT * FROM pola WHERE nama='Gamis'"); while($hasil=mysql_fetch_array($data)){ ?> <?php echo $hasil['keterangan']; ?><br> <center> <img src="<?php echo $hasil['gambar5']?>" width="1080" height="980"><br><br> <img src="<?php echo $hasil['gambar2']?>" width="1080" height="980"><br><br> <img. src="<?php. echo. $hasil['gambar1']?>". width="1080" height="980"><br><br>. UNIVERSITAS SUMATERA UTARA.