makalah perancangan web-edit isi
Post on 17-Feb-2018
251 Views
Preview:
TRANSCRIPT
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 1/17
BAB I
PENDAHULUAN
1.1 Latar Belakang
Teknologi semakin hari semakin berkembang. Salah satunya teknologi
informasi, banyak sekali bidang yang memanfaatkan teknologi Informasi. Tuntutan
kebutuhan akan informasi dan penggunaan komputer yang semakin banyak
mendorong terbentuknya sebuah jaringan komputer yang mampu melayani berbagai
kebutuhan tertentu.
Jaringan komputer kita kenal dengan nama internet. Internet bisa diakses dan
dimanfaatkan untuk berbagai keperluan, oleh siapa saja dan dimana saja, kapanpun
kita mau menggunakannya. Salah satunya adalah website, yang mampu
menyediakan informasi dalam bentuk teks, gambar, suara maupun gambar bergerak.
Dengan kemampuan sepeti ini, web menjadi sangat terkenal dan perkembangannya
sangtlah pesat.
Dengan terus majunya roda perkembangan teknologi, web berkembang
menjadi alat bantu yang tidak hanya mampu menyediakan informasi, namun juga
mampu untuk mengolah informasi. Proses pengolahan informasi dengan
memanfaatkan teknologi website menyebabkan website menjadi media yang
dinamis. Hal ini membutuhkan sarana teknis yang yang menentukan. Sarana tersebut
banyak bergantung pada penggunaan perangkat lunak yang kuat, aman, terperaya,
dan epat. Pada kesempatan ini penulis akan membuat website toko kue up up
ake.
1.2 Maksud dan Tujuan
!aksud penulis membuat makalah ini adalah untuk menganalisa, meranang
dan membangaun sebuah website untuk mempermudah konsumen dalam pembelian produk kue yang disediakan.
Tujuan dari pembuatan makalah ini ialah untuk meningkatkan daya saing
dan berino"asi dalam memberikan pelayan serta mempermudah memberikan
informasi kepada pelanggan selain itu mempermudah pengusaha dalam memasarkan
produk kue up up ake.
1.3 Metode Penelitian
1
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 2/17
Dalam penulisan makalah ini penulis menggunakan beberapa metode, adapun
metode yang digunakan adalah sebagai berikut#
$. Pengamatan langsung %Observasi)
Suatu metode yang digunakan untuk menari dan menggumpulkan
data yang langsung dari sumbernya dengan ara pengamatan langsung ke
tempat objek riset.
&. 'awanara % Interview(
Suatu metode pengumpulan data dengan melakukan pengumpulan
data dengan tanya jawab mengenai keterangan yang diperlukan untuk
bahan penulisan makalah.
). Studi Pustaka
Suatu metode yang digunakan untuk pengumpulan data dengan
menari sumber*sumber sekunder baik itu berupa profil perusahaan
ataupun struktur organisasi melalui !edia elektronik yaitu website
ataupun buku buku berkaitan dengan pembuatan website e*ommere.
1. !uang Lingku"
+uang lingkup dari makalah ini adalah pembuatan website penjualan kue up
up ake.
BAB II
PEMBAHA#AN
2.1 Analisa $e%utu&an
!elihat semakin banyaknya masyarakat yang mulai paham dan tertarik
dengan sistem pelayanan berbasis web. Disisi lain penggunaan sistem manual sangat
memperlambat dalam memberikan pelayanan kepada pelanggan dalam pembelian
2
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 3/17
produk kue up up ake yang disediakan seara online. emudian dalam segi
kemudahan dan efesiensi waktu pembeli tidak perlu datang ke toko seara langsung
tetapi tetap dapat melihat produk dan harga kue yang dijual di toko up up ake
tersebut.!aka dari itu perlu adanya resolusi guna memenuhi kebutuhan seperti diatas.
!enurut penulis pembuatan website toko up up ake menjadi salah satu solusi
yang baik dan sangat direkomendasikan .
2.2 Peran'angan Perangkat Lunak
2.2.1 !an'angan Antar Muka
Perananagan antar muka meliputi peranangan tampilan website
penjualan dan informasi toko kue up up ake.
a. Ta("ilan Hala(an Uta(a ) Home*
+anangan tampilan halaman utama dibagi menjadi tiga
bagian, di bagian atas adalah header %$(, sebelah kiri bawah dari header
terdapat area searhing %&(, di bagian tengah terdapat area na"igasi %)(,
pada bagian tengah adalah bagian konten iklan-promosi %(, sedangkan
pada bagian terbawah terdapat footer %/(.
3
2
4
5
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 4/17
%. Ta("ilan Hala(an Pro+il Perusa&aan
Tampilan halaman profil perusahaan tidak jauh berbeda dengan
halaman utama. Tetap mengandung header %$(, area na"igasi %&(, bagian
isi %)(, dan bagian footer %(. 0ang membedakan hanyalah isi yang
berupa profil dari toko kue up up ake.
'. Ta("ilan Hala(an ,ara
Pe(esanan
Tampilan halaman 1ara Pemesanan berisi header %$(, area
na"igasi %&(, bagian isi profil %)(, dan bagian footer %(. 0ang
membedakan dari halaman lain adalah isi yang berupa 1ara Pemesanan dari
toko kue up up ake.
4
Gambar 1.Halaman Beranda
Gambar 2.Halaman
3
4
2
3
4
2
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 5/17
d. Ta("ilan Hala(an $atalog
Halaman atalog berisi tentang gambar*gambar produk kue yang
dijual, pada bagian atas terdapat header %$(, dibawah header terdapat
na"igasi %&(, pada bagian kiri terdapat keterangan gambar %)(, pada bagian
utama terdapat daftar gambar gambar produk yang dijual beserta eterangan
harga %(, seangkan dibagian paling bawah terdapat footer %/(.
e. Ta("ilan
Hala(an Detail Produk
Halaman Detail berisi tentang gambar kue beserta harga, dibagian
atas ada header %$(, disebelah kiri ada keterangan produk %&(, dibagian
bawah header ada na"igasi %)(, dibagian isi terdapat gambar ukuran besar
%( sedangkan pada bagian paling bawah masih sama yaitu footer %/(.
5
Gambar 3. Halaman cara
Gambar 4. Halaman Galeri
4
2
3
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 6/17
+. Ta("ilan Hala(an $eranjang
Halaman keranjang adalah halaman yang berisi tentang detail produk yang ada dikeranjang2dapun tampilanya adalaha sebagai berikut
header %$(, eterangan barang pada keranjang %&(, bagian footer %)(.
g. Ta("ilan Hala(an
Pengisian -or(
Halaman pengisian form adalah halaman yang digunakan untuk mengisi
keterangan pembeli, adapun bentuknya adalah ada Header %$(, kemudian tampilan
isian form yang harus diisi %&(, dan pada bagian paling bawah adalah footer %)(.
6
Gambar 6. Halaman Keranjang
Gambar 5. Halaman Deail Prod!k
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 7/17
&. Ta("ilan Hala(an $ontak ka(i
Halaman ini berisi tentang ara menghubungi kantor perusahaan, adapun
tampilanya adalah header %$(, na"igasi %&(, bagian isi %)(, footer %)(
2.2.2 !an'angan #truktur Naigasi
Struktur na"igasi adalah struktur atau alur dari suatu program yang
merupakan ranangan hubungan %rantai kerja( dari beberapa area yang
berbeda dan dapat membantu mengorganisasikan seluruh elemen
pembuatan 'ebsite.
Dilihat dari pengertian tersebut setelah kami analisa untuk membuat
website ini kami menggunakan struktur na"igasi ampuran, karena menurut
"
Gambar ".Halaman Pemesanan
Gambar #. Halaman Konak
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 8/17
kami strukture na"igasi ampuran lebih mempermudah user dalam
menggunakan website.
2dapun 3agan-Strukturnya adalah sebagi berikut #
2.2.3 !an'angan Basis Data )E!D/ L!#/ dan #"esi+ikasi -ile *
a. E!D )Entit0 !elations&i" Diagra(*
%. L!#
#
Gambar #. $%D &$ni' %elaionshi( Diagram)
Gambar ". *r!k!r +a,igasi
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 9/17
'. #"esi+ikasi -ile
Table.$. Table4Pembeli
5o 6lemen Data 2kronim Tipe Panjang eterangan
$ 5omor pembeli 5o4pem "arhar $7 Primary key
& 5ama pembeli 5ama4pem "arhar &/
) 2lamat 2lamat "arhar $/7 Tanggal Tgl Date-time
/ 5o telepon 5o4telp int
Table.&. Tabel4ue
5o 6lemen Data 2kronim Tipe Panjang eterangan
$ ode kue kode4kue "arhar / Primary key
& 5ama kue 5ama4kue "arhar &/
) Jenis kue Jenis4kue "arhar $/
+asa kue +asa4kue "arhar $7
/ Harga kue Hrg4kue int
8 Stok Stok int
Table.). Table4Transaksi
5o 6lemen Data 2kronim Tipe Panjang eterangan
$ 5o transaksi 5o4trans "arhar $7 Primary key
& 5o pembeli 5o4pem "arhar $7
) 5ama pembeli 5ama4pem "arhar &/
2lamat 2lamat "arhar $/7
/ Tanggal Tgl Date-time8 ode kue ode4kue "arhar /
9 5ama kue 5ama4kue "arhar &/
: Harga kue Hrg4kue Int
; Total bayar Tot4bay Int
2.3 I("le(entasi dan Pengujian
a. I("le(entasi #iste(
-
Gambar -. %* &ogical %elaional *r!c!re)
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 10/17
Implementasi sistem dilakukan setelah peranangan selesai
dilakukan dan selanjutnya akan diimplementasikan pada bahasa
pemrograman yang akan digunakan.
%. I("le(entasi Hardare
Hardware yang digunakan untuk pembuatan 2plikasi Website toko
kue Cup Cup Cake seara optimal menggunakan spesifikasi minimum
komputer sebagai berikut#
Table.. omputer client
Prosesor Pentium I< dengan keepatan $,: =H>
!emori /$& !b
Harddisk 7 =b
!onitor $/ inh, resolusi layar $7& ? 98: pi?el
!ouse @ eyboard A*te
5I1 yang terhubung ke jaringan intranet
'. I("le(entasi #o+tare
Software yang digunakan untuk menjalankan 2plikasi Website
toko kue Cup Cup Cake adalah sebagai berikut #
Table./. Software Pendukung 2plikasi
$ Sistem Bperasi !irosoft 'indows 9
& D3!S !ySC
) 3rowser =oogle 1hrome
Design '63 Dreamwea"er, 6ditEE, 5otepade
/ Design =ambar Photoshop, !aromedia Flash
Implementasi
Halaman beranda
1/
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 11/17
11
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 12/17
Halaman profil
Halaman katalog
Halaman ara pemesanan
12
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 13/17
Hala(an $ontak $a(i
Ta("ilan Detail Produk
13
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 14/17
-!M I#IAN DATA PEMBELI
Ta("ilan $eranjang Belanja
14
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 15/17
BAB III
PENUTUP
15
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 16/17
3.1. $esi("ulan
2dapun kesimpulan sebagai hasil dari pembuatan website toko kue 1up 1up
1ake yang telah dilaksanakan adalah sebagai berikut #
$. Pembuatan website toko kue 1up 1up 1ake sangat membantu danmemudahkan serta memperepat proses pembelian kue.
&. 6fisiensi waktu dalam pembelian tiket yang selama ini terjadi bisa diatasi,
ustomer tidak perlu mengantri dan bersusah payah untuk berbelanja kue.
). 6ngetahui seara detail kualitas harga dan fasilitas yang diberikan oleh toko
kue.
Selain itu, permasalahan mengenai website ini menurut kelompok kami
adalah #
urangnya waktu pengerjaan website dan minimnya pengetahuan tentang 3ahasa
atau aplikasi yang digunakan dalam pembuatan website menyebabkan keterlambatan
dan kurang maksimalnya hasil dari website yang dibuat.
3.2. #aran
2dapun Saran yang bisa kami berikan adalah #
3agi toko kue 1up 1up 1ake #
* Pengembangan website penjualan kue harus lebih dikembangkan baik dalam
peranangan system ataupun tampilan,
3agi !ahasiswa #
* !ahasiswa harus mampu memahami serta memanfaatkan waktu dengan efektif
supaya dalam pengerjaan lebih maksimal
* Pengetahuan tentang 3ahasa pemrograman khususnya dalam pembuatan
website harus ditingkatkan agar system yang dibuat bisa lebih baik
3agi Dosen #
Pemberian waktu dan materi harus seimbang agar penerimaan oleh mahasiswa lebih
maksimal dan hasil yang diapai pun lebih memuaskan.
16
7/23/2019 Makalah Perancangan Web-edit ISI
http://slidepdf.com/reader/full/makalah-perancangan-web-edit-isi 17/17
DA-TA! PU#TA$A
!odul materi peranangan website 3SI tahun &7$/
www.Ilmukomputer.om
www. bsi group.com/
www.hendrisetiawan.com
1"
top related