Analisa 6 Faktor Design Grafis pada website metrotvnews.com

Interaksi Manusia & Komputer

Prinsip Design Grafis  dari Metrotvnews.com

Oleh :

1.     Arief Widya Brahma Putra

2.     Theofest Marsal Kaisuku

3.     Roy Hanfry Woruntu

PDF Link : 

Link Untuk Melihat Persentasi Dalam Bentuk PDF File 

Metaphor (Metafora) atau metafora adalah aplikasi dari nama atau deskripsi istilah objek lain yang tidak dapat diartikan secara harafiah. Menghubungkan presentasi dan elemen-elemen visual dengan item-item yang berkaitan. Metafora akan membuat para pengunjung seolah-olah berada di tempat yang sebenarnya, atau bisa dikatakan juga bahwa metafora dibuat mirip seperti tempat yang dikunjungi.

Pada berita-berita di metrotvnews.com menunjukkan bahwa suatu berita dilengkapi oleh sebuah video yang membuat seakan-akan pembaca ada di lokasi kejadian, namun video-video itu hanya dapat ditemukan kebanyakan pada berita dalam negri. Bukan berarti berita dari luar negri tidak dilengkapi video seperti berita dalam negri, beberapa dari berita itu juga dilengkapi video. Namun jumlah berita yang ada videonya tidak sebanyak berita dari dalam negri. Biasanya berita yang dilengkapi video adalah sebuah kejadian.

Clarity (Kejelasan) Harus ada alasan yang kuat/masuk akal dan jelas mengapa menggunakan setiap elemen yang berada dalam suatu interface yang kita buat.

Diatas, pada header web, ada beberapa shortcut yang menuju kepada bab yang kita pilih. Bab-bab ini adalah bab-bab populer yang biasanya dicari oleh pembaca sehingga diletakkan di bagian header dari web. Dengan ini maka sangat membantu penataan berita, sehingga tidak membuat pembaca kesulitan untuk mencari berita yang mereka cari. Misalkan kita mengklik “Bola” maka kita akan masuk ke web page khusus berita bola.

Consistency (Ketetapan) Konsistensi dalam tampilan, pewarnaan, gambar, ikon, typography (model form yang digunakan pada suatu website), teks, dll.

Walaupun tampil dengan warna background, penempatan maupun ukuran yang tidak sama, ikon dari metrotvnews.com selalu dapat ditemukan disetiap halaman sub-web metrotvnews.com dan letaknya selalu di header web page tersebut. Ikon ini tidak pernah berubah bentuk atau fungsinya, jika di-klik maka akan mengembalikan pembaca ke halaman utama dari metrotvnews.com. 

Alignment (Perataan) untuk perataan dapat digunakan rata kiri, kanan atau tengah. Pada umumnya suatu teks pada website dimulai dari kiri atas (left alignment), dimana left alignment akan mengijinkan mata untuk menguraikan tampilan dengan lebih mudah. 
Tidak hanya pada metrotvnews.com, pada umumnya suatu teks pada website dimulai dari kiri atas (left alignment) dimana left alignment akan mengijinkan mata untuk menguraikan tampilan dengan lebih mudah. Penting untuk sebuah website untuk meletakkan perataan kiri, karena tanpa ini kenyamanan pengunjung website tersebut bisa berkurang saat membaca. Dan biasanya website-website ternama sangat memperhatikan hal ini saat menulis suatu tulisan, karena perataan kiri atau left alignment sudah menjadi suatu yang umum di mata pembaca.

Proximity adalah item-item yang berkaitan ditampilkan bersama pasti memiliki hubungan karena jarak yang jauh mengimplikasikan bahwa tidak ada hubungan antara item-item tersebut.

Di website ini di bagian atas ada item-item yang ditampilkan bersamaan, sehingga memiliki hubungan yang masih terkait satu sama lain. Sebuah website pasti melakukan hal ini untuk memudahkan pengunjung mencari kategori yang dicari. Tidak mungkin suatu web meletakkan kategori-kategori yang bersangkutan pada jarak yang jauh dalam suatu web page.

Contrast (Keserasian Tampilan) adalah sebuah keserasian tampilan akan membuat pengunjung web tertarik pada web tsb. Kontras juga dapat memandu mata pengunjung untuk melihat keseluruhan interface. Keuntungan dari keserasian adalah untuk memperkuat fokus atau untuk memperkuat suatu interface. Kontras digunakan untuk membedakan aktifitas kendali. Juga dapat digunakan untuk men-set item yang paling utama. Item yang paling utama diberi highlight. Dengan mempergunakan geometri dapat membantu pengurutan. Kontras juga mendukung skimming secara cepat.

Bisa kita lihat pada website ini bahwa tercantum kriteria-kriteria yang memadukan keserasian tampilan di dalamnya, seperti warna background putih, sangat memudahkan para pembaca untuk mencari tulisan yang dicari. Karena biasanya background berwarna menyulitkan pembaca mencari tulisan disebabkan terjadinya tabrakan warna yang membuat warna font membaur dalam background. Header yang berwarna cerah juga dapat menarik perhatian para pembaca. Warna cerah ini seolah-olah membawa kesan kenyamanan desain yang menarik dan membangkitkan semangat untuk melihat lebih lagi dari isi web tersebut. Item-item utama juga diberikan di halaman utama web tersebut, sehingga menarik minat pembaca denganhal-hal yang sedang populer di masyarakat.