TUGAS AKHIR DESAIN WEB
“OTOMOTIF”
Nama :
|
Dewi Fatikha Sari
|
(13.5.00158)
|
Puji Hastuti
|
(13.5.00142)
|
|
Kriswantoro
|
(13.5.00136)
|
|
Program Studi :
|
Teknik Informatika
|
|
Jenjang
Pendidikan :
|
Strata _1
|
|
Kelas :
|
A
|
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER
STMIK SINAR NUSANTARA
SURAKARTA
2014
DAFTAR ISI
DAFTAR ISI........................................................................................................2
BAB I..................................................................................................................3
PENDAHULUAN..................................................................................................3
BAB 11...............................................................................................................4
KEBUTUHAN FUNGSIONAL DAN NON FUNGSIONAL SISTEM WEB..................4
Penjelasan
tentang judul.........................................................................................4
Konsep web yang
dibuat........................................................................................4
Batasan masalah....................................................................................................5
Penjelasan
tambahan..............................................................................................5
BAB III.................................................................................................................6
- PERANCANGAN ANTAR MUKA.......................................................................6
Navigasi...............................................................................................................6
Hyperlink:.............................................................................................................6
BAB IV................................................................................................................7
PENJELASAN RANCANGAN ANTARMUKA.........................................................7
Navigasi...............................................................................................................7
Hyperlink:.............................................................................................................7
BAB V.................................................................................................................9
LAMPIRAN..........................................................................................................9
BAB 1
PENDAHULUAN
Sebagian
besar orang menganggap bahwa kemampuan menguasai sebuah komputer sama dengan
kecerdasan. Jika anda dapat segera memahami dan menguasai sistem komputer
dengan cepat dan tepat, maka anda akan dianggap sebagai orang yang cerdas.
Kami
telah belajar dan mempraktekkan semua yang telah diajarkan dalam mata kuliah
desain web ini. Hasilnya, mahasiswa yang mampu mempelajari dan mempraktekkannya
dengan tepat dapat dianggap sebagai orang yang cerdas.
Para
ahli yang sudah paham dengan kemampuan ini mendapat julukan jenius, karena
dapat mengerjakan sesuatu dengan komputer dengan cepat dan seakan-akan tanpa
berpikir. Sebenarnya, mempelajari desain menggunakan komputer diawali oleh
hal-hal yang mendasar seperti yang telah dipraktekkan oleh kami yang hasil
laporannya kurang lebih seperti yang ada dalam laporan akhir ini.
Orang-orang
yang telah disebutkan di atas dianggap sebagai orang yang cerdas, dan mereka
diperlakukan oleh teman-teman dan keluarga secara berbeda. “Karena diperlakukan sebagai orang yang lebih cerdas, mereka cenderung
untuk bertindak dengan lebih cerdas”. ~ Bill
Handley
KEBUTUHAN
FUNGSIONAL DAN NON FUNGSIONAL SISTEM WEB
Judul web yang kami buat adalah otomotifku.net. Dari judul yang telah
kami buat, sudah jelas bahwa tema yang kami dapat adalah otomotif.
Otomotif adalah ilmu yang mempelajari tentang alat-alat transportasi darat yang
menggunakan mesin, terutama mobil dan sepeda motor. Otomotif mulai berkembang sebagai cabang ilmu seiring
dengan diciptakannya mesin mobil. Dalam perkembangannya, mobil semakin menjadi
alat transportasi yang kompleks yang terdiri dari ribuan komponen yang
tergolong dalam puluhan sistem dan subsistem.
Konsep web yang dibuat
·
Home (about us)
Pada bagian header kami isi dengan nama web
kami yaitu otomotifku.net yang kami beri tag html
<marquee></marquee>.
Pada bagian isi berisi tentang penjelasan
mengenai web kami dan konten apa saja yang ada dalam web kami.
Pada bagian footer kami sisipkan gambar facebook,
twitter dan beberapa gambar mobil.
·
Product
Pada bagian header diisi dengan nama web :
otomotifku.net, yang diberi tag html marquee dan kami sisipkan sebuah gambar mobil.
Pada bagian footer kami isi dengan tulisan : Desain Web -
uas - Kelompok 1 ti-A, dan
beberapa gambar mobil yang sedang trend.
Pada bagian product ini berisi 3 menu, yaitu
: entry, hot dan new.
a. Entry
Berisi contact person dari perusahaan
sehingga pelanggan dapat menanyakan tentang produk-produk kami lebih lanjut. Di
dalam web juga dituliskan alamat perusahaan kami. Hal ini bertujuan agar
pelanggan dapat mensurvei secara langsung produk yang kami tawarkan dan
memperkuat kepercayaan pelanggan terhadap perusahaan kami sehingga mereka
tidak kecewa dengan produk yang telah
kami tawarkan tersebut.
Juga berisi tentang informasi mobil-mobil
yang paling dicari belakangan ini.
b. Hot
Berisi tentang informasi mobil-mobil yang
sedang ‘hot’ saat ini.
c. New
Berisi tentang informasi mobil-mobil yang
sedang baru saat ini yang tentunya sangat
dicari pelanggan.
Batasan masalah
Mengingat
begitu luasnya ruang lingkup dalam penelitian ini, maka kami membatasi
permasalahan tersebut pada: produk apa yang kami tawarkan, yaitu mobil sehingga
kami hanya fokus tentang penjualan mobil di dalam website kami. Dan dari penawaran tersebut akan berisi:
- harga tiap-tiap mobil yang kami tawarkan,
serta
- merk maupun type dari mobil tersebut serta gambar(kondisi) dari mobil yang kami tawarkan.Perlu diketahui pada dasarnya,ada harga ada barang
jadi boleh dikatakan semakin bagus kondisi dari mobil tersebut maka semakin
mahal pula harga yang ditawarkan.
Penjelasan tambahan
Tiap-tiap
produk yang telah kami tawarkan,kami telah
mencantumkan gambar dari produk kami.Karena setiap gambar serta menu yang ada
diwebsite kami sudah kami link kan semuanya.Jadi jika sekiranya gambar tersebut di klik akan muncul informasi mengenai produk kami
tersebut.Adapun informasi yang dapat
diakses dapat berupa harga ,merk maupun type dari mobil tersebut.
BAB III
PERANCANGAN
ANTAR MUKA
Navigasi
Hyperlink:
Diwebsite
otomotif kami ini,masing-masing menu dan
gambar dapat diakses dengan mudah. Adapun hyperlink tersebut berupa;
-
Product
·
Di menu product ini
masih ada beberapa menu lagi.
-
About us
-
Back
-
Entry
-
Hot
-
New
-
Gambar
BAB IV
PENJELASAN
RANCANGAN ANTARMUKA
Navigasi
Hyperlink:
Pada
umumnya website kami memiliki dua menu
utama yaitu ;
1.
Menu Product
· Jika kami klik di Menu Product ini,maka akan muncul
beberapa menu lagi didalamnya diantaranya yaitu menu Entry,menu Hot dan juga
menu New.Jika kami klik di menu Entry ini maka akan menuju ke halaman
produk-produk yang sedang dicari oleh pelanggan,perlu diketahui bahwasanya
semua menu yang ada diwebsite kami sudah di link-link kan ke semua produk-produk kami.Karena
website kami mengusung tema otomotif maka produk-produk kami berupa mobil.
· Di menu Hot,jika kami klik link Hot ini maka link ini
akan menuju kehalaman produk-produk yang sedang ‘hot’ dikalangan para
pelanggan.Halaman produk-produk tersebut berisi rincian harga produk
tersebut,type & merk tersebut
disertai gambar dari produk itu sendiri.Diwebsite kami menawarkan
produk-produk yang sesuai dengan selera pelanggan.
· Sedangkan jika kita klik di menu New maka link
tersebut akan menuju ke halaman produk-produk keluaran terbaru,yang terupdate
dan tentunya akan menjadi produk yang paling dinanti-nantikan kemunculanya oleh
para pelanggan .Di menu New ini kami menyediakan produk-produk yang terbaru dan
terbagus yang mempunyai desain yang lebih bervariasi dan memiliki suara mesin
yang halus.Kami menyediakan segala jenis mobil sesuai dengan bajet pelanggan.
2.
Menu About Us
· Link yang kami buat di menu about us ini akan menuju
kehalaman profil web kami,disini kami memberikan informasi tentang website
otomotif kami, jadi pelanggan yang ingin
mengetahui website kami dapat mengakses di About us ini.Dengan adanya menu
about us ini diharapkan dapat menjawab rasa ingin tahu pelanggan terhadap
website otomotif kami ini.
-
Product :
jika kami klik link Product ini maka link Product ini
akan menuju ke halaman menu dimana produk-produk
kami berada.
-
About us :
link about us ini
akan menuju
ke halaman profil web kami.
-
Back :
jika kami klik link back ini maka akan menuju ke halaman sebelumnya.
-
Entry :
link entry ini akan menuju ke halaman produk-produk yang sedang
dicari oleh pelanggan.
-
Hot :
jika kami klik link hot ini maka akan menuju ke halaman produk-produk yang sedang ‘hot’ di kalangan para
pelanggan.
-
New :
link new ini
akan menuju
ke halaman produk-produk keluaran terbaru yang tentunya paling
dicari oleh para pelanggan akan kemunculannya.
Masing
– masing gambar dari produk yang telah kami tawarkan juga
bisa di-klik dan kemudian muncul
informasi mengenai produk-produk tersebut.
BAB V
LAMPIRAN
Tampilan menu home(About us)
Tampilan menu hot
Tampilan menu new
Contoh Informasi Produk
Schedule project akhir +
tanggal penyelesaian masing-masing
bagian
No
|
Kegiatan
|
Tanggal
penyelesaian
|
1.
|
Menentukan
judul
|
1 Mei 2014
|
2.
|
Menentukan
konsep
|
10 Mei 2014
|
3.
|
Mengumpulkam
bahan
|
13-19 Mei 2014
|
4.
|
Membuat
tata layout (mackup)
|
22 Mei 2014
|
5.
|
Mendesain
|
24 Mei 2014
|
6.
|
Mendesain
navigasi
|
26 Mei 2014
|
7.
|
Finishing
content
|
1 Juni 2014
|
8.
|
Presentasi
|
9
Juni 2014
|
9.
|
Laporan
|
27
Juni 2014
|