there’s something about geometry + architecture

April 1, 2014

THE POWER OF GOLDEN RATIO IN WEBSITE DESIGN

Filed under: Uncategorized — irmapermana @ 21:43
Tags: ,

Seiring berjalannya waktu dan berkembangnya zaman, lifestyle di masyarakat pun turut berkembang. Kini kemajuan teknologi membuat kita selalu berhubungan dengan gadget. Siapa si yang tidak kenal dengan shopping online, socialmedia, dan media online? Hampir semua aktivitas yang kita lakukan berhubungan dengan website. Sehingga kini tampilan sebuah website adalah faktor penting yang perlu diperhatikan untuk menarik pengunjung terutama dalam hal berbisnis. Banyak hal yang dilakukan para designer website agar membuat tampilan website menjadi lebih estetik dan menarik. Sengaja atau tidak sengaja ternyata dibalik kesuksesan para website ternama menyimpan nilai estetik yang mungkin tidak kita sadari namun mempengaruhi alam bawah sadar kita.

Nilai estetik itu berasal dari proporsi golden ratio dengan perbandingan angka-angka yang kebanyakan orang mengatakan sebagai angka tuhan. Masyarakat percaya bahwa golden ratio menyimpan nilai estetik yang mampu menarik perhatian dan mempengaruhi alam sadar kita. Di sini terdapat beberap a website ternama yang memakai golden ratio

 twitter

Twitter

FireShot Screen Capture #082 - 'Great Website Design_ The Golden Ratio' - www_joshuagarity_com_web-design_the-golden-ratio

fastcompany

Selain design website, logo juga menjadi salah satu peran penting untuk memajukan sebuah usaha. Tidak mungkin seorang pengusaha membuat logo tanpa maksud dan sebuah arti. Ternyata banyak juga logo-logo ternama yang menerapkan proporsi golden section untuk tampilan yang estetik, seperti:

Untitled-1

apple – cloud

Hasil tersebut membuat saya cukup bertanya-tanya dan ingin membuktikan sendiri apakah benar banyak website besar yang menggunakan golden section? Saya pun mencoba dengan bantuan uxtriggers.com yaitu sebuah website yang menyediakan pola proporsi golden section. Pada website tersebut kita dapat membuktikan sendiri website design yang menggunakan golden section hanya dengan cara memasukan link atau url website yang ingin kita uji. Kalian juga bisa mencobanya🙂

Ketika saya masukan link media social yang cukup ternama di amerika saya cukup kaget ternyata ada proporsi golden section di beberapa layout website.

FireShot Screen Capture #084 - 'Golden Ratio Web Design Test I UX Triggers' - www_uxtriggers_com_golden-ratio_#

newyorktimes

Saya juga mencoba salah satu website yang cukup terkenal di kalangan arsitektur yang sering saya gunakan. Disini terlihat penyusunan huruf yang sesuai dengan golden section.

FireShot Screen Capture #091 - 'Golden Ratio Web Design Test I UX Triggers' - www_uxtriggers_com_golden-ratio_#

dezeen

Dari sini bisa disimpulkan bahwa estetik dari sebuah layout website memang menjadi faktor penting yang perlu di perhatikan untuk meraih kesuksesan. Bukan hanya dengan tampilan warna namun juga peletakkan logo,teks,dan item-item di dalamnya. Tampilan estetik akan menarik pengunjung untuk terus datang ke website kita, dan golden section dapat membantu kita untuk menciptakan nilai estetik tersebut.

Referensi:

Blog golden ratio in moden designs (http://www.hongkiat.com) diakses tanggal 30 Maret 2014, pukul 09.14
Great Website Design: The Golden Ratio (http://www.joshuagarity.com) diakses tanggal 28 Maret 2014 pukul 19.15
Golden ratio (http://www.uxtriggers.com) diakses tanggal 28 Maret 2014 pukul 19.22
Understanding and using the golden ratio in web design (http://www.pencilscoop.com) diakses tanggal 28 Maret 2014 pukul 19.30

3 Comments »

  1. Menarik melihat bahasan artikel ini. Memang zaman sekarang tak hanya pada desain bangunan, tata kota atau sejenisnya yang memakai prinsip Golden Section, namun juga sudahmerambah ke dunia internet akibat perkembangan teknologi yang pesat belakangan ini. Tak hanya website diatas saja, bahkan saya juga melihat penggunaan prinsip ini pada desain Twitter yang notabene merupakan socmed terkenal di dunia secara conscious.
    Namun bukan berarti website yang tak memakai prinsip ini dinilai tak memiliki jumlah pengunjung yang besar, Tampilan memang sebagai langkah paling awal untuk menarik seseorang untuk berkunjung kesana lagi, tapi perlu diingat tak hanya faktor tersebut saja, melainkaan contain dan inovasi yang dihadirkan oleh website tersebut juga memiliki pengaruh besardalam hal ini.Golden Section dipakai oleh sang desainer untuk membantu melayout data tersebut agar terkesan lebih menarik.

    Comment by pelangiiiii — April 2, 2014 @ 10:24

  2. Selain karena keindahan kemungkinan penggunaan golden section pada website dimaksudkan untuk mengatur alur pandangan pembaca. Bagian dengan ratio lebih besar akan memiliki kemungkinan lebih besar untuk dibaca dan dilihat terlebih dahulu daripada bagian dengan ratio lebih kecil. Tetap saja akan selalu muncul pertanyaan apakah golden ratio ini benar digunakan pada saat pembuatannya ataukah hanya akal-akalan orang saja mengaitkan ini dengan teori golden ratio yang sudah ada

    Comment by ummuhasnalathifa — April 2, 2014 @ 20:55

  3. Saya pernah mencoba mencari golden section pada batik indonesia karna konon banyak yang berpendapat kalau batik indonesia memiliki suatu nilai keindahan di dalamnya. Dan…ternyata pada beberapa batik yang menggunakan motif alam terdapat konsep golden section. Mungkin golden section memang menjadi suatu tolak ukur di alam untuk menentukan suatu hal yang dinilai indah…pernah tersirat dalam benak saya…kenapa golden section (1,618)…..kenapa bukan angka lainnya seperti 0,75 atau 0,25 atau 2/5..yang jika dibuat segmennya pada bidang datar juga menunjukkan sesuatu yang tidak simetris. Mungkin Golden section dapat dikatakan sebagai suatu konsep yang universal karena berlaku di banyak hal.

    Untuk desain web atau desain grafis lainnya saya melihat Golden Section merupakan suatu cara untuk melatakkan POI (Point Of Interest) sehingga komposisi yang didapatkan jadi lebih seimbang dan menarik. Sama halnya seperti dalam film atau fotografi.

    Comment by ranynasir — March 30, 2015 @ 03:31


RSS feed for comments on this post. TrackBack URI

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Create a free website or blog at WordPress.com.

%d bloggers like this: