III DATA PERANCANGAN

Transkripsi

1 III DATA PERANCANGAN A. KELOMPOK DATA BERKAITAN DENGAN ASPEK FUNGSI PRODUK RANCANGAN 1. Data Primer Data Primer adalah data yang diperoleh penulis secara langsung (dari tangan pertama) dan data diperoleh menggunakan metode wawancara dengan staf web desain Universitas Mercu Buana. Dari hasil wawancara, penulis memperoleh beberapa data, yakni, setiap webite Fakultas di Universitas Mercu Buana dibuat berbeda dengan situs utama yaitu, perbedaannya yaitu, website fakultas dibuat menggunakan subdomain dari situs utama dan menggunakan CMS (Content Management System) dari Wordpress, sehingga desain web yang digunakan menggunakan template yang sudah ada, yang tersebar banyak di internet. Berbeda dengan situs utama, yang menggunakan CMS buatan sendiri dan desain web yang dibuat sendiri. Penulis juga melakukan pengamatan secara langsung terhadap website fakultas, hasil dari pengamatan, terlihat website tidak terlalu aktif atau jarang mendapat pembaharuan informasi. Informasi yang disajikanpun hanya untuk kalangan internal, tidak menunjukan bahwa fungsi website tersebut ditujukan untuk media promosi serta beberapa data informasi yang disajikanpun kurang lengkap. 13

2 2. Bentuk Desain Website Fakultas Desain dan Seni Kreatif 3. Data Sekunder a. Kepustakaan Kegiatan ini penulis lakukan untuk memperoleh data dari berbagai literatur, seperti artikel, e-book dan buku-buku yang berkaitan dengan perancangan desain website. b. Internet Gambar 3.1 Website FDSK Mercu Buana Sumber: fdsk.mercubuana.ac.id Penulis juga mengumpulkan data dan informasi dari berbagai web, blog maupun media yang terdapat pada internet yang berhubungan dengan studi perancangan desain web. Data maupun informasi yang didapat mendukung penulis dalam proses perancangan website. 1) Pengertian Website Website merupakan kumpulan halaman web yang saling terhubung dan file-filenya saling terkait. Web terdiri dari page atau halaman, dan kumpulan halaman yang dinamakan home page. Home page berada pada posisi teratas, dengan halaman-halaman terkait berada di bawahnya. Biasanya setiap halaman dibawah 14

3 home page disebut child page, yang berisi hyperlink ke halaman lain dalam web (Gregorius, 2001:30). Menurut Honni & Amelia (2011), website adalah suatu ruang informasi dimana sumber-sumber daya yang berguna diidentifikasi oleh pengenal global yang disebut Uniform Resource Identifier (URI) atau juga lebih dikenal dengan istilah yang lebih populer yaitu Uniform Resource Locator (URL). Dengan kata lain, website adalah suatu ruang informasi di dalam internet yang dapat diakses atau dilihat dari berbagai penjuru dunia, kapanpun dan dimanapun, selama mempunyai koneksi internet. Pemakaian website dapat mempromosikan perusahaan, produk, jasa, dan lain sebagainya. Penggunaan website dapat membangun sebuah brand image yang positif dari sebuah perusahaan dengan biaya yang cukup murah, dengan ruang lingkup yang lebih besar. Dokumen pada sebuah website disebut juga dengan web page (halaman web) dan link (alamat) dalam website memungkinkan pengguna untuk berpindah dari satu halaman web ke halaman web lainnya. Halaman web diakses dan dibaca melalui aplikasi web browser seperti Mozilla Firefox, Google Chrome dan Internet Exploler atau berbagai aplikasi web browser lainnya. 2) Kriteria Jenis Website Yang Baik Menurut CNET/Builder ada 7 kriteria yang menentukan sebuah website termasuk website yang baik atau tidak, yaitu : a) Usability Jacob Nielsen sang guru usability, usability adalah dapatkah seorang pengguna menemukan cara untuk menggunakan website tersebut dengan efektif ( doing things right ). Masih menurut Jacob, usability memiliki 5 karakteristik : 15

4 Mudah untuk dipelajari. Efisien untuk digunakan. Mudah untuk diingat. Tingkat frekuensi kesalahan. Tingkat kepuasan pemakai. Karakteristik yang telah ditentukan oleh Jacob Nielsen akan sangat sulit kita terapkan 100%, apalagi kalau sudah menyangkut kepentingan klien web, tetapi paling tidak bisa menjadi acuan yang membantu kita untuk merancang layout suatu website, agar website tersebut : Mudah dipelajari penggunaannya oleh pengunjung. Mudah diingat dan digunakan navigasinya oleh pengunjung. Dapat digunakan secara efisien. Memperkecil tingkat kesalahan pemakaian oleh pengunjung dalam mengoperasionalkan web. Memuaskan pengunjung hingga akhirnya tertarik untuk kembali lagi. b) Sistem Navigasi Navigasi yang mudah dipahami oleh pengunjung secara keseluruhan c) Desain Grafis Pemilihan grafis, layout, warna, bentuk maupun typografi yang menarik visual pengunjung untuk menjelajahi website. d) Konten Isi/konten yang bermanfaat ( 'Content is king, but without good design, Content is a naked king' ), kecuali website tersebut adalah website eksperimental/show off. 16

5 e) Kompatibilitas Seberapa luas sebuah webite didukung kompabilitas peralatan yang ada, misalnya web browser dengan berbagai plug-in nya ( Internet Explorer, Mozilla, Opera, Netscape, Lynx, Avant, Maxthon dan masih banyak lagi dengan berbagai versi dan plugin nya). f) Loading Time Waktu panggil (loading time), walaupun ada banyak faktor yang akan mempengaruhi waktu panggil (loading time) website yang akan kita buka, diantaranya: besar bandwith/koneksi pengakses, kondisi webserver pada saat diakses, aplikasi yang digunakan dalam membangun website, dsb. Anda memiliki waktu 8 detik pertama untuk meyakinkan pengunjung untuk meneruskan menjelajahi website anda atau menutup browser dan pergi ke website lain. Oleh karena itu, letakkan 'sesuatu' di 8 detik pertama tersebut yang bisa menarik perhatian pengunjung. Hint: ukuran sebuah halaman web html dengan image di dalamnya (tanpa flash) adalah kurang lebih kb. g) Fungsionalitas Ini akan melibatkan programmer dengan script, misal PHP, ASP, Java, CGI, dsb, untuk menciptakan sebuah website yang dinamis, interaktif dan 'hidup' yang bisa mengajak pengunjung berkomunikasi secara langsung. Seberapa baik sebuah website bekerja dari aspek teknologikal nya. 17

6 3) Jenis Website Berdasarkan SIfatnya Berdasarkan sifatnya, website dibagi menjadi dua, yaitu : a. Website Statis Web statis adalah web yang tetap (static), dalam arti tampilan, navigasi, dan content tidak berubah secara otomatis. Ketika ingin meng-update sebuah berita, harus membuka file asilnya. Umumnya berita atau artikel yang ditampilkan tetap untuk jangka waktu yang cukup lama. Tipe website ini umumnya hanya mengandalkan tag HTML saja, jadi tidak memerlukan database. Selain memanfaatkan HTML, website yang menggunakan flash juga dapat dikategorikan sebagai website statis (Riyanto, 2009:21). b. Website Dinamis Website dinamis merupakan suatu jenis website yang disiapkan untuk memudahkan pengelolaan konten tanpa dibatasi waktu dan tempat. Kapanpun dan dimanapun, selam tersedia koneksi internet, Administrator web dapat menambah/memperbarui konten website. Dengan kata lain, dengan website dinamis, mengelola konten website dapat dilakukan langsung di internet bahkan tanpa menggunakan software HTML Editor apapun. Contoh website jenis ini adalah portal berita, sosial networking, forum diskusi dan masih banyak lagi (Permana, 2012:5). 4) Pengertian SEO (Search Engine Optimization) SEO adalah sebuah ilmu yang membahas cara, tips dan trik agar dapat tampil teratas dalam hasil mesin pencari seperti Google, yang pada akhirnya bertujuan untuk meningkatkan pengunjung ke sebuah situs. Bagaimana cara untuk dapat tampil di bagian teratas hasil pencarian adalah tujuan dari SEO (Search Engine Optimization) (Pratama, 2015:49). 18

7 Menurut Swara dan Tohirudin (2012:6), SEO adalah serangkaian proses sistematis untuk meningkatkan volume atau kualitas kunjungan melalui mesin pencari menuju situs tertentu dengan memanfaatkan mekanisme kerja atau algoritma mesin pencari. Secara sederhana, tujuan SEO adalah menempatkan situs pada posisi teratas atau setidaknya pada halaman pertama hasil pencarian berdasarkan kata kunci yang ditargetkan. 5) Pengertian SEO (Search Engine Optimization) Menurut Abdulrehman A. Mohamed, Cheruiyot W.K, PhD, Richard Rimiru, PhD, & Collins Ondago (2014) dalam jurnalnya yang berjudul Responsive Web Design influid Grid Concept Literature Survey menjelaskan Responsive Web Design sebagai berikut : RWD (Responsive Web Design) adalah pendekatan desain web yang menyesuaikan tampilannya mulai dari ponsel ke monitor, komputer, dan desktop, sehingga mempermudah pelanggan dalam mengakses web tersebut di device apapun serta memberikan pengalaman melihat tampilan web dengan optimal. RWD (Responsive Web Design) juga diartikan sebagai sebuah teknik yang digunakan untuk membuat layout website menyesuaikan diri dengan tampilan device pengunjung, baik ukuran maupun orientasinya. Jadi tampilan yang berada di desktop komputer dengan tampilan yang diakses melalui Smartphone akan berbeda tampilannya. Responsive Web Design juga merupakan sebuah pendekatan untuk desain website yang bertujuan untuk menyusun situs untuk memberikan tampilan yang optimal dan pengalaman interaksi membaca yang mudah serta navigasi dengan minimal mengubah ukuran, panning, dan berfokus di berbagai perangkat (dari desktop, monitor, komputer ke ponsel). 19

8 Halaman website harus terlihat baik, dan mudah digunakan, terlepas dari perangkat. Halaman web tidak harus meninggalkan atau tidak memasukkan informasi untuk menyesuaikan perangkat yang lebih kecil, melainkan isinya harus sesuai untuk semua perangkat yang digunakan. B. KELOMPOK DATA BERKAITAN DENGAN ESTETIKA FUNGSI PRODUK RANCANGAN Semua media komunikasi visual, dari segi bentuk maupun jenisnya, memiliki ciri khas atau karakteristik tersendiri antara yang satu dengan yang lainnya. Namun semuanya memiliki unsur-unsur visual yang sama, diantaranya seperti, warna, gambar, garis, bentuk, huruf, ukuran, dll. Pemahaman mengenai unsurunsur dasar visual tersebut sangat penting untuk menghasilkan media visual yang optimal. Dalam perancangan desain website juga memiliki unsur-unsur visual yang sama, diantaranya : 1. Huruf Tipografi diartikan sebagai segala disiplin yang berkenaan dengan huruf. Tipografi telah digunakan untuk bidang-bidang seperti multimedia dan animasi, web dan online media lainnya, dan lain-lain. Tipografi juga bisa didefinisikan sebagai suatu proses seni untuk menyusun menggunakan huruf cetak dengan merancangnya sehinga menjadi komposisi untuk mendapatkan efek tampilan yang dikehendaki, menurut (Surianto Rustan, 2011:16). Font merupakan kumpulan karakter dari satu ukuran dan jenis yang dimiliki oleh keluarga typeface tertentu. Typeface merupakan keluarga dari karakter grafis yang menyertakan banyak ukuran dan jenis, contoh typeface adalah Heltevica, Courier dan Times New Roman. Sedangkan contoh font adalah Times New Roman 12 point dicetak tebal (Binanto, 2010:26). 20

9 Teks merupakan konten utama dan paling penting pada sebuah website, meskipun sebuah website dirancang terfokus kepada multimedia (gambar dan video), namun teks tetap digunakan untuk membuat deskripsi dan keterangan. Tipografi dalam desain web diaplikasikan menggunakan CSS, jenis huruf yang akan tampil pada sebuah halaman web ditentukan oleh pembuat desain web, lalu web browser (Google Chrome, Mozilla Firefox, dll) akan mencari jenis huruf pada komputer pengguna, jika jenis huruf yang ditentukan tidak tersedia pada komputer pengguna, maka secara otomatis web browser akan mencari jenis huruf lain (tergantung dari pengaturan awal web browser) (Albert, 2013). 2. Warna Pada permulaannya para seniman mempergunakan warna semata-mata berdasarkan naluri keindahan saja atau untuk tujuan simbolis semata. Setiap warna memiliki karakteristik tertentu. Yang dimaksud karakteristik dalam hal ini adalah ciri-ciri atau sifat-sifat khas yang dimiliki oleh suatu warna. Sebagian orang berpendapat karena warna mempuyai pengaruh terhadap emosi dan asosiasinya terhadap macam-macam pengalaman, maka setiap warna mempunyai arti perlambangan dan makna yang bersifat mistik (Darmaprawira, 2002). Dalam desain web, tentu saja warna juga memiliki peranan penting, pemberian tema warna pada web biasanya mewakili tujuan, seperti tema warna hitam, biasanya digunakan untuk website game, hacking, dll. Pengaplikasian warna pada desain web menggunakan kode CSS dan mengenal beberapa model penulisan warna, yaitu RGB, RBGA, HSL dan Keyword (Pratama, 2016:155). 21

10 3. Layout Layouting merupakan aktivitas penyusunan tata letak elemen-elemen grafis pada suatu halaman kosong. Sarana dan teknik yang dipakai dalam suatu karya akan efektif dan berhasil, tetapi belum tentu sarana dan teknik tersebut akan efektif dan cocok pada karya lainnya. Contoh : Desain sebuah iklan dengan ruang putih yang dominan disamping bidang halaman akan mampu menonjolkan isi pesan serta kesan menarik. Namun dipihak lain, ruang kosong yang dominan disamping halaman Koran bisa membuat teks terkesan tidak rapi sehingga pembaca enggan melihatnya (Adi Kusrianto, 2007:276). 4. Ukuran Dalam dunia desain, ukuran dapat memberikan penekanan tertentu dari besar kecilnya sebuah objek. Besar kecilnya sebuah ukuran dapat memberikan kemudahan bagi para pembaca dalam memilih sebuah informasi yang dianggap penting karena secara tidak langsung pembaca dapat diarahkan langsung kesuatu objek dengan penekanan-penekanan tertentu. C. KELOMPOK DATA BERKAITAN DENGAN ASPEK TEKNIS PRODUK RANCANGAN 1. Pre-Production Dalam pembuatan website, diperlukan dua bidang yang saling berhubungan, yaitu front-end dan back-end. Meski dua bidang yang berbeda, namun pada dasarnya, keduanya tidak bisa dipisahkan dalam perancangan website. a) Front-End Front-end atau jika diartikan adalah bagian depan, meliputi semua hal yang berhubungan dengan web desain dan UI/UX (User Interface/User Experience), seperti pembuatan wireframe (rancangan awal), layout, 22

11 penentuan warna, huruf, penggunaan multimedia, animasi, dll. Pemrograman yang dibutuhkan untuk membuat desain web adalah HTML dan CSS, kedua bahasa coding ini bukan murni bahasa pemrograman, karena tidak memiliki struktur dasar bahasa pemrograman. Selain itu ada Bahasa Pemrograman JavaScript yang berperan dalam desain web untuk membuat website menjadi interaktif. b) Back-End (Web Programming) Back-end atau bagian belakang berhubungan dengan server, aplikasi, database dan kemampuan dibidang web programming, seperti, PHP, Ruby, Python, Java, dan Net. membangun aplikasi, juga menggunakan tools seperti MySQL, Oracle, dan SQL Server untuk menemukan, menyimpan, atau mengubah data. 2. Production Pada tahap produksi perancangan website, meliputi langkah-langkah berikut ini : a) Web Design Dalam proses rancangan awal (wireframe), layout dan elemenelemen grafis untuk web, bisa menggunakan beragam aplikasi desain grafis. b) Coding Langkah ini adalah proses penerapan rancangan awal dan elemenelemen grafis yang telah dibuat kedalam media web browser dimana halaman website akan di tampilkan. Proses ini membutuhkan aplikasi text editor untuk menulis skrip program yang dibutuhkan. 23

12 3. Post-Production Pada tahap ini meliputi langkah-langkah sebagai berikut : a) Publishing Setelah semua proses perancangan website selesai, mulai dari pembuatan elemen-elemen grafis, coding/pemrograman hingga memastikan semua link berfungsi dengan baik, langkah selanjutnya adalah mempublikasikan website agar dapat diakses oleh semua orang lewat internet. Proses publikasi dilakukan dengan cara mengunggah/upload semua file website ke server hosting, serta mendaftarkan alamat domain agar bisa diases di internet. b) Maintenance (Perawatan) Setelah keseluruhan website telah jadi dan siap diakses, langkah terakhir yang harus dilakukan adalah tahap evaluasi atau perawatan pada website, hal ini dilakukan untuk memperbaiki jika adanya bug (cacat desain, kerusakan atau kesalahan pada sistem website). Ini adalah tahap terakhir dalam proses perancangan website. D. KELOMPOK DATA BERKAITAN DENGAN ASPEK EKONOMI PRODUK RANCANGAN Website memiliki salah satu fungsi sebagai media promosi, dengan adanya website tidak perlu lagi membayar mahal untuk sebuah media iklan atau biaya tambahan lainnya seperti pembatan brosur, katalog dan media cetak lainnya. Hanya cukup dengan mengiklankan website dan memasukan seluruh informasi yang dibutuhkan kedalam website, informasi pun dapat dengan cepat dan mudah disampaikan kepada target masyarakat. 24