Logo Design (Final Project)

Graphic User Interface (Final Project)

HOME PAGE

ABOUT US

PRODUCT

PROMOTION

CONTACT US

Proposal Web Design (Final project)

UNIVERSITI MALAYSIA SARAWAK

FAKULTI SENI GUNAAN DAN KREATIF

SEMESTER 1 SESI 2010/2011

GKG 3013 REKABENTUK LAMAN WEB

 

Web Design Proposal (Final Project)

 

Nama: Shah Jhihan Bin Abdullah

No.matrik : 22260

Program: Teknologi Seni Reka (Seni reka Industri)

PENSYARAH:

Cik. Salmiah Bt. Abdul Hamid.

Definisi Rekabentuk Laman Web.

World Wide Web atau WWW atau lebih dikenali sebagai web merupakan perkhidmatan internet yang paling popular. Web merupakan satu perkhidmatan yang menghimpun maklumat. Lazimnya web mempunyai hiper pautan (hyperlinks) teks, imej grafik, audio dan video. Setiap halaman web mempunayi alamat yang unik. Alamat ini dikenali sebagai Uniform Resource Locator (URL). Setiap URL mengandungi dua bahagian utama iaitu protokol dan nama domain. Protokol yang lazim digunakan ialah http:// iaitu singkatan HyperText Transfer Protocol.

“Web Design is the art and process of creating a single Web page or entire Web sites and may involve both the aesthetics and the mechanics of a Web site’s operation although primarily it focuses on the look and feel of the Web site. Some of the aspects that may be included in Web design or Web production are graphics and animation creation, color selection, font selection, navigation design, content creation, HTML/XML authoring, JavaScript programming, and ecommerce development."

Objektif laman web “MAMOST CONCEPT”.

1.  Memperkenalkan jenama automobil baru kepada pengguna yang menawarkan produk-produk kenderaan buatan tempatan yang berkonsepkan moden dan terkini.
2.  Untuk mempromosikan rekabentuk kenderaan baru kepada pengguna dan memberikan perkhidmatan tempahan kenderaan kepada pengguna.
3.  Memberi maklumat kepada pengguna tentang jenis-jenis kenderaan yang dikeluarkan oleh syarikat untuk dibuat mengikut tempahan yang diterima oleh pengguna.
4.  Untuk memajukan industri automobil negara ke peringkat antarabangsa setanding dengan negara-negara maju yang lain.

Konsep rekaan (laman web “MAMOST CONCEPT”)

Konsep yang digunakan dalam laman web ini adalah konsep moden serta sistem pencarian yang memudahkan pengguna. Web ini juga mempunyai Interface yang sama tetapi maklumat atau "Content" yang berbeza

Warna kelabu “Gray”, sebagai warna yang dipilih untuk paramuka lamanweb ini untuk menunjukkan konsep moden dan lebih elegant. Putih, sebagai warna latar belakang  yang paling terang, untuk menunjukkan kontras antara tulisan dan imej dalam web ini.

Daripada warna-warna yang dipilih, dapat dibagi dalam beberapa bagian yang sering dinamakan dengan sistem warna Prang System yang ditemukan oleh Louis Prang pada 1876 atau disebut juga sebagai atribut warna meliputi :

1. Hue, adalah istilah yang digunakan untuk menunjukkan nama dari suatu warna, seperti merah, biru, hijau dsb.
2. Value, adalah dimensi kedua atau mengenai terang gelapnya warna. Contohnya adalah tingkatan warna dari putih hingga hitam.
3. Saturation/Intensity, seringkali disebut dengan chroma, adalah dimensi yang berhubungan dengan cerah atau suramnya warna.

Selain Prang System terdapat beberapa sistem warna lain yakni, CMYK atau Process Color System, Munsell Color System, Ostwald Color System, Schopenhauer/Goethe Weighted Color System, Substractive Color System serta Additive Color/RGB Color System. Diantara bermacam sistem warna diatas, kini yang banyak dipergunakan dalam industri media visual cetak adalah CMYK atau Process Color System yang membagi warna dasarnya menjadi Cyan, Magenta, Yellow dan Black. Sedangkan RGB Color System dipergunakan dalam industri media visual elektronika. Pada monitor, skema jenis RGB adalah sbb:

Penggunaan Warna:

Ø  Tampilkan warna dengan latar belakang (background) cerah.

Ø  Pilih warna yang cerah untuk foreground (kelabu,putih dll)

Ø  Hindari penggunaan warna coklat dan hijau untuk background

Ø  Kecerahan dan kombinasi warna pada foreground dan background kontras

Ø  Gunakan warna yang sesuai,reka bentuk dibuat dalam b/w dan ditambahkan warna lain yang sesuai.

Ø  Gunakan warna untuk menarik perhatian user, komunikasi terarah, identifikasi status, menjalin hubungan antara elemen

Ø  Hindari penggunaan warna pada pekerjaan yang sifatnya non-task, untuk layar yang kebanyakan terdiri dari teks, warna dapat membantu ketika user harus mencari /membedakan bagian2 tertentu

Ø  Hal-hal yang perlu dipertimbangkan dalam penggunaan warna, iaitu:

- Pengkod ekstra meningkatkan tampilan interface

Ø  Konsisten dalam penggunaan warna

Ø  Membatasi pengkodean warna menjadi 8 warna (4 warna lebih baik)

Ø  Gunakan warna b/w atau abu-abu, atau b/w saja untuk mnunjukkan interface

Ø  Untuk menunjukkan keragaman bagian-bagian pada layar

Ø  Pereka sering menggunakan visual dengan menggunakan 4-5 warna

Isi kandungan laman web “MAMOST CONCEPT”

Isi kandungan “content” laman web yang dibuat terbahagi kepada 5 bahagian iaitu “HOME ,ABOUT US, PRODUCT, PROMOTION, CONTACT US”. Laman web ini direka untuk tujuan mempromosikan kenderaan syarikat kepada pengguna dan pandu arah laman web juga perlu ringkas dan memudahkan pengguna. Oleh itu, laman web ini di reka dengan pandu arah yang mudah dan ringkas untuk kemudahan pengguna.

            Selain itu, link “content” di letakkan dibahagian atas dan bawah laman untuk memudahkan pengguna menekan link untuk pergi ke laman yang seterusnya tanpa “scroll” ke bahagian atas laman web.

            Secara ringkas laman ini mempunyai isi kandungan yang ringkas dan padat dengan imformasi tentang syarikat dan memudahkan pengguna untuk melayarinya tanpa sebarang masalah yang timbul seperti tidak tahu dimana mereka berada di lamanweb tersebut.

Penutup

Secara keseluruhannya dalam rekabentuk laman web ini perlulah konsisten dengan tujuan penggunaan laman web tersebut di wujudkan, sama ada untuk tujuan pendidikan atau untuk makluman umum. Rekabentuk laman web yang dibuat perlulah sesuai dengan pengguna yang ditujukan samaada untuk pelajar, masyarakaat umum atau golongan-golongan tertentu. Penggunaan font dan warna juga perlu konsisten dengan motif yang dipilih dan laman tidak terlalu padat dengan imej atau text. Dalam penghasilan laman web ini, para pelajar akan dapat mempraktikkan apa yang dipelajari dalam kursus GKG Rekabentuk Laman dan seterusnya mencapai objektif yang dikehendaki.

Site Map/Information architecture (Final Project)

WEB NAVIGATION

Sketches of ideas and concepts (Final Project)

"User Testing Report"

UNIVERSITI MALAYSIA SARAWAK

FAKULTI SENI GUNAAN DAN KREATIF

SEMESTER 1 SESI 2010/2011

GKG 3013 REKABENTUK LAMAN WEB

 

“User Testing Report”

Nama: Shah Jhihan Bin Abdullah

No.matrik : 22260

Program: Teknologi Seni Reka (Seni reka Industri)

PENSYARAH:

Cik. Salmiah Bt. Abdul Hamid.

ISI KANDUNGAN

PERKARA   

Pengenalan.

1.    Konsep rekabentuk

2.    Pengalaman pengguna (User Experience)

3.    Permukaan design (Interface Design)

4.    Komen pengguna.
5.Masalah yang dihadapi.

Kesimpulan.

Pengenalan.

Laman web Kuching Design Week 2011 Festival yang berkonsepkan kepulauan Borneo ini dibuat adalah sebagai projek pertama untuk kursus GKG 3013 REKABENTUK LAMAN WEB yang perlu dibuat oleh setiap pelajar teknologi senireka. Laman web yang telah siap dibuat perlu membuat percubaan daripada pengguna. Setiap laman yang dibuat perlu di komen oleh pengguna untuk membuat laporan “user testing”. Oleh itu beberapa orang rakan telah dipilih sebagai pengguna yang akan memberi komen pada laman web yang telah dibuat.

Setiap pengguna perlu melihat pada setiap laman dan penggunaan link dan “interface” yang telah dibuat. Pengguna yang telah melihat setiap laman akan membuat komen pada laman web yang telah dibuat untuk memastikan web yang dibuat memenuhi ciri-ciri semertimana yang telah dipelajari.

Segala yang telah dibuat dalam laman web tersebut akan mendapat mendapat maklumbalas daripada pengguna yang telah menggunakannya. Dan seterusnya perojek rekabentuk laman web (Kuching Design Web 2011 Festival) ini akan dinilai oleh pensyarah yang akan memberi markah keseluruhan dalam setiap proses rekabentuk laman web yang telah dibuat, sepertimana yang dikehendaki oleh pensyarah.

1.   Konsep rekabentuk.

Dalam konsep rekabentuk, pengguna mengatakan bahawa konsep yang digunakan ini adalah untuk menunjukkan identiti negeri Sarawak dan kepulauan Borneo. Sepertimana yang dilihat pada rekabentuk laman web yang lain, laman web ini mempunyai kelainan dari segi penggunaan warna dan rekaletak gambar dan font.

            Setiap laman mempunyai “interface” yang sama hanya tajuk sahaja yang berbeza. Bagi bahagian “sponsors”, setiap logo pada web mempunyai link untuk melihat laman web “sponsors” tersebut. Bagi laman-laman yang lain hanyalah mempunyai gambar dan maklumat.

            Konsep yang sama digunakan pada setiap laman dan “interface” adalah konsisten dengan setiap laman untuk memudahkan pengguna membaca dan melihat gambar yang tertera.

            Manakala pada setiap text yang ada di dalam web ini boleh diedit semula apabila mahu membuat perubahan pada text atau maklumat yang berkaitan, dimana boleh ditambah atau dipadam jika diperlukan. Ini akan memudahkan lagi kerja apabila mahu mengubah gambar atau text, kita tidak perlu mengubah pada keseluruhan “interface”. Jumlah keseluruhan laman pada web ini ialah lapan paparan muka yang terdiri daripada, “HOME, PRESIDENT, STAFF BIOS, SPONSORS, WEB & BLOG, PHOTO GALLERIES, LOCATION MAP, CONTACT US”.

2.   Pengalaman pengguna (User Experience)

Melalui penggunaan laman web ini, pengguna akan mendapat informasi tentang Kuching Design Week 2011 Festival. Seterusnya pengguna akan membuat pilihan untuk melihat isi kandungan yang terdapat di dalam laman web ini dengan mengklik pada link yang terdapat pada setiap paparan muka.

Pengguna yang melawat pada setiap laman boleh kembali pada “home” dengan mengklik sahaja pada link home. Hal ini dapat mengelakkan pengguna daripada terperangkap di mana-mana laman dan ini yang perlu ada pada setiap laman web iaitu pandu arah yang betul.

Setiap pengguna yang menggunakan laman web ini mengatakan tiada apa-apa masalah tentang link yang dibuat kerana mereka tidak teperangkap atau sesat di mana-mana laman yang terdapat di dalam web ini. Pengguna yang telah cuba menggunakan laman web ini member maklum balas yang baik dan memuaskan.

3.   Permukaan design (interface design)

  

Dalam rekabentuk laman web ini, rekaan yang dibuat adalah ringkas dan mudah yang bertujuan untuk setiap pengguna memahami setiap langkah dan penggunannya. Oleh itu, laman ini sesuai digunakan oleh setiap golongan lapisan masyarakat. 
Antara lement yang perlu terkandung dalam sesebuah laman web ialah:

Navigation Bar - Navigasi yang konsisten amat perlu untuk setiap     laman Web. Biasanya Navigation bar diletakkan di atas setiap mukasurat laman Web dan hendaklah konsisten antara satu muka dengan muka yang lain. Tidak kurang juga Navigation berada di sebelah tepi sesuatu laman Web. Terdapat juga laman Web yang membahagikan mukasurat mereka kepada dua bahagian: satu mengandungi Navigation bar dan satu lagi mengandungi isi kandungan yang hendak disampaikan. Rekabentuk begini menetapkan Navigator pada kedudukan asal walaupun butang Navigation berlainan ditekan. Navigation bar yang digunakan tidak terhad kepada teks sahaja. Penggunaan grafik akan menampakkan sesuatu laman Web itu lebih cantik dan menarik. Tidak kira anda menggunakan teks atau grafik apa yang penting ialah, setiap butang Navigation bar itu perlu mewakili sambungan-sambungan yang tertentu dengan jelas dan tidak mengelirukan pembaca. Jika perlu warnakan butang mukasurat yang sedang dilawati dengan warna yang berlainan dengan mukasurat-mukasurat lain atau buatkan ia sebagai butang tidak aktif. Sebagai tambahan masukkan  butang "back" dan "foward" ataupun "previous" dan "next" bagi menyenangkan pembaca. 

Mukasurat profil -  Sesetengah laman Web tidak mengandungi mukasurat berkenaan siapa mereka dan bagaimana cara pembaca boleh menghubungi mereka. Lebih menghairankan jika laman Web "misteri" itu terdiri dari mereka yang terlibat di dalam penjualan produk atau perkhidmatan. Pembaca tentu sekali berminat malah merasa lebih terjamin mengetahui tentang individu disebalik tabir. Pastikan terdapat sambungan di dalam laman Web anda yang membolehkan pembaca emel anda.

Borang komen - Ruangan komen membolehkan pembaca meminta maklumat diperlukan secara "online" dan tidak perlu menyalin nombor telefon dan menghubungi anda. Sebaliknya anda hanya  perlu menjawab sebarang pertanyaan melalui emel ataupun surat. Bukan setakat tempat mendapatkan informasi, ruangan ini juga bertindak sebagai alat untuk memperbaiki sebarang kelemahan yang terdapat di dalam laman Web. Juga dapat memperlengkapkan informasi-informasi di dalam laman Web berdasarkan komen-komen dari pembaca. 

Kandungan yang menyeronokkan - Pembaca berharap untuk memperolehi informasi yang dikehendaki apabila melawat sesuatu laman Web. Pereka harus membina laman Web yang dapat memberikan pembaca apa yang mereka mahu. gunakan ayat-ayat yang ringkas untuk menarik pembaca tanpa membebankan mereka dengan perkataan-perkataan yang susah. Jika perkataan-perkataan saintifik perlu digunakan, sediakan maksud perkataan itu sekali. Informasi yang lengkap akan menarik pembaca untuk kembali berkunjung ke laman Web tersebut. Ruangan yang disediakan dalam web adalah tidak terhad.

4.   Komen Pengguna.

Pengguna yang telah menggunakan laman web ini telah membuat beberapa komen, antara komen-komen yang diberikan adalah seperti berikut:

Ø  Penggunaan warna kurang menarik.

Ø  Tiada penggunaan falsh dan gambar yang bergerak.

Ø  Tiada video yang dipaparkan di dalam web.

Ø  Tiada penggunaan muzik atau sound pada web.

Ø  Kurang gambar-gambar yang menarik pengguna.

Ø  Kurang informasi yang perlu ada.

Ø  Laman web yang dibuat mudah dan ringkas.

5.   Masalah yang dihadapi.

Dalam membuat Laman web ini, terdapat beberapa masalah yang dihadapi dan perlu di atasi, antara masalah yang dihadapi ialah:

Ø Link yang dibuat pada proses permulaan tidak berfungsi.

Ø Gambar tidak dapat dipaparkan.

Ø Masalah dalam memasukkan gambar yang telah “slash”

Ø Tersalah dalam format yang dibuat dan terpaksa membuat semula laman web yang lain dengan format yang dikehendaki.

Ø Terlalu banyak link yang tidak dapat dibuat, dan terpaksa mengurangkan link dalam laman web ini.

Kesimpulan.

Laman web merupakan satu alat yang digunakan oleh umum untuk pengguna mendapat informasi tentang sesuatu perkara. Secara keseluruannya laman web yang telah dibuat ini sangat mudah dan ringkat untuk digunakan oleh pengguna dan juga mudah difahami. Pengguna dapat menggunakan web ini tanpa perlu diajar dan panduan dari sesiapa. Dengan hanya mengklik pada link-link yang ada di dalam laman web ini, pengguna boleh mendapat informasi tentang Kuching Design Week 2011 Festival.