Menggunakkan Metaphors didalam Web Design
Indonesian (Bahasa Indonesia) translation by Kang Abbad (you can also view the original English article)
Kata metafora mungkin sering ditemukan dibagian dari penulisan, bila digunakan sebagai kiasan sastra untuk efek diskriptif. Namun, kali ini, kita akan berbicara tentang jenis metafora yang berbeda: salah satu visual yang dapat kita gunakan didalam desain.
metafora: sebuah kiasan di mana sebuah ekspresi digunakan untuk merujuk pada sesuatu yang tidak secara harfiah menunjukkan untuk menyarankan suatu kesamaan - WolframAlpha
Di web, kita banyak menggunakkan gambar dan ikon untuk melambangkan hal-hal yang berbeda. Ketika kita mengunjungi sebuah situs web, kita memindai untuk mencoba dan menemukan apa yang kita butuhkan secepat mungkin, dan perbandingan digunakan untuk membantu mempercepat proses itu. Kita bisa mengartikan sesuatu dengan lebih cepat dengan styling dan gambar yang familiar. Contoh, kita bisa segera mengetahui error ketika ada sesuatu seperti tanda seru, atau warna kuning atau warna merah. Itu semua karena familiar.
Terutama belakangan ini, kami telah mulai melihat metafora urban muncul dalam web design, menggunakan elemen yang familiar seperti sebuah rak buku atau sebuah dinding dalam web design. Namun, ada banyak metafora lain yang digunakan dalam desain web untuk menjembatani jarak antara kehidupan nyata dan virtual.
Apakah metafora itu?
Definisi "resmi" dari metafora tidak berubah dari bagian sebelumnya: suatu kiasan di mana suatu ungkapan digunakan untuk merujuk pada sesuatu yang tidak secara harfiah menunjukkan untuk menyarankan suatu kesamaan. Itu sangatlah benar ketika kita melihat web dan penggunaan metafora di platform itu. Di situ, kita menggunakan pixels sebagai pengganti dari objek-objek nyata untuk menjembatani kesamaan antara kehidupan virtual dan nyata.
Ada beberapa jenis metafora yang berbeda yang kita gunakan di web juga: mereka yang berskala lebih kecil yang meniru benda-benda nyata seperti kancing, metafora ikonik yang menyalin asosiasi kehidupan nyata dan menggunakannya di web, dan yang lebih luas di mana seluruh desain dapat berputar di sekitar metafora.
Kehidupan nyata di Web
Tombol di web sebenarnya bukan tombol kan? Tidak, itu adalah sekumpulan pixels yang dibuat agar terlihat seperti tombol karena (a) kami membuatnya begitu dan (b) pengguna kami akan mengenalinya dan tahu bahwa itu adalah sesuatu yang harus ditekan (atau, lebih tepatnya, diklik). Kami membuat tautan ini terlihat seperti sebuah tombol karena terbiasa mengenali sebuah tombol sebagai titik interaksi dalam kehidupan nyata, dan akan dapat membedakan tautan tertentu dari sisa halaman dengan sedikit usaha.
Meniru konvensi kehidupan nyata membantu kita berinteraksi dengan dunia maya. Ini mengesampingkan pengalaman pengguna kami karena web tidak berubah menjadi beberapa antarmuka asing yang membutuhkan banyak pembelajaran untuk berinteraksi. Kita tahu tombol adalah tombol karena mereka terlihat sangat sama dimana-mana, mereka adalah isyarat visual dan pengguna berinteraksi dengan mereka secara alami.


Hal yang sama berlaku untuk windows, desktop, dan tabs di desain UI. Steve Krug, didalam bukunya kegunaanya yang terkenal Don't Make Me Think menggunakan contoh tab folder sebagai penggunaan besar metafora dalam desain antarmuka.
Aku belum bisa membuktikannya (belum), tapi aku sangat curiga bahwa Leonardo da Vinci menciptakan pembagi tab pada akhir abad ke-i5. Sebagai interface devices go, mereka jelas merupakan produk genius. - Steve Krug
Tab adalah contoh klasik dari antarmuka intuitif metafora.
Ikon
Sedikit berbeda untuk metafora identik adalah ikon, seperti yang kita bicarakan sebelumnya. Contoh, tanda seru adalah digunakan untuk mewakili beberapa keadaan penting atau peringatan sehingga kami menggunakan ikon itu dalam konteks yang sama di web. Juga, kita mungkin menggunakan simbol dari telepon atau surat untuk menandakan kontak.


Untuk contoh yang sempurna, kita bisa melihat di dashboard WordPress. Setiap item menu di sisi kiri menampilkan semacam metafora, seperti push-pin untuk mewakili tulisan dan balon bicara untuk komentar.
Dorongan untuk menggunakan metafora semacam itu identik dengan yang ada di bagian sebelumnya: itu menciptakan beberapa kecocokan - "tautan" jikakamu mau - ke dunia nyata yang membantu pembaca untuk mengartikan dan menavigasi halaman dengan relatif mudah.
Metafora Aktif
Kita telah mengambil sebuah tour singkat dari mereplikasi objek dunia nyata dan menggunakan icons untuk tautan form, tetapi ada satu lagi jenis metafora yang penting: mereka yang melampaui satu elemen. Contoh paling mencolok yang dapat saya pikirkan bukanlah situs web, melainkan aplikasi. iBooks tidak terlihat seperti aplikasi iPad biasa karena ini dimaksudkan untuk meniru tampilan dan nuansa rak buku nyata untuk menambahkan rasa keakraban bagi pembaca. Kamu lihat pada iBooks dan kamu secara langsung tahu itu ada hubungannya dengan buku. Jika dilakukan dengan baik, jenis situs web ini dapat berubah menjadi sangat luar biasa!
Metafora yang diperpanjang kurang umum digunakan pada jenis lain yang digunakan pada sebagian besar desain situs web di seluruh web.
Meskipun "metafora diperpanjang" mungkin merupakan terminologi yang salah, jenis metafora ini masih merupakan tipe terluas yang bisa kamu dapatkan. Mereka menawarkan jendela kecil di browser kamu ke dalam kehidupan nyata, dan dapat menjadi metode instan untuk membuat kesan pertama tentang apa situs web itu.
Mengapa Menggunakan Metafora?
Dalam tulisan, kami menggunakan metafora untuk mengekspresikan, menjelaskan, dan mendeskripsikan. Metafora dapat menjadi cara yang berguna untuk menghubungkan ide dengan yang tidak secara harfiah mirip dengan (di mana suatu kemungkinan akan digunakan sebagai pengganti), tetapi di mana keduanya dapat digunakan bersama untuk mewakili satu sama lain.
Metafora dalam desain web, seperti menulis, digunakan sebagai mekanisme deskriptif dengan menghubungkan objek dan ide kehidupan nyata dengan pixel di situs web. Ini mungkin tampak sangat kecil, dan sesuatu yang bisa diabaikan, tetapi pembaca web memiliki rentang perhatian yang lebih pendek daripada pembaca cetak sehingga waktu adalah esensi saat menjelajah situs web. Dan, dalam keadaan itu, metafora menjadi berguna dengan menyalin asosiasi kehidupan nyata (seperti warna merah dengan bahaya, atau kaca pembesar dengan pencarian) dan menggunakan mereka di web sehingga proses pemindaian halaman web dipercepat.
Daya tarik
Sebagai desainer, kita dapat memanfaatkan metafora untuk meningkatkan daya tarik pada desain, dan membuat desain kita mudah diingat. Kami ingin pengguna untuk terhubung dengan situs web, dan, sudah, sebagian besar situs web memiliki beberapa bentuk metafora yang digunakan untuk menyesuaikan dengan target pemirsa mereka. Situs web mencerminkan konsep kehidupan nyata, perusahaan, orang, dan objek, dan gaya yang dipilih tidak berbeda dengan yang ada di kehidupan nyata. Metafora bukan hanya menciptakan rasa keakraban di antara pixel di laman web dan materi kehidupan nyata, tetapi juga dapat digunakan untuk terhubung ke khalayak tertentu.
Mari kita ambil BBC's CBeebies homepage sebagai contoh. Situs ini dibangun dengan latar belakang yang menggambarkan sebuah taman dengan pohon-pohon dan pelangi, gambaran idealistik dunia yang umum di banyak media yang berorientasi pada anak-anak. Metafora taman online menyambut anak-anak untuk menggunakan situs tersebut, sedangkan jika dirancang seperti beranda Microsoft, tidak akan begitu menarik bagi anak-anak untuk digunakan.


Kesimpulan
Metafora digunakan di semua media untuk mengekspresikan sesuatu sebagai sesuatu yang lain, dan, di situs web, mereka adalah cara yang hebat untuk mengomunikasikan keakraban dan menarik perhatian pembaca ke desain. Ketika kita mempertimbangkan ini dalam skala dunia 4,5 miliar tahun, web masih merupakan sarana yang sangat baru sehingga menciptakan hubungan antara nyata dan virtual adalah ukuran peralihan tetapi itu berhasil.
Metafora dalam Tindakan
Flourish
Flourish adalah biro desain web yang menganggap namanya serius. Dengan flourish didefinisikan sebagai "tumbuh atau berkembang dengan cara yang sehat atau kuat", konsep pohon yang tumbuh di tanah tandus dan desain berbasis alam yang menyeluruh disajikan.


Desain interior XHTML Template
Template "Desain Interior" adalah item ThemeForest yang ditata untuk mewakili kantor, contoh sempurna dari metafora yang sedang dimainkan.


Launch
Launch adalah item ThemeForest yang lain, tetapi yang satu ini mengibaratkan peluncuran situs web untuk peluncuran roket, seperti halnya banyak desain serupa.


Mutant Labs
sebuah perusahaan pengembangan perangkat lunak, mengambil "lab" bagian dari nama mereka ke dalam konteks ilmiah demi desain situs mereka.











