10 Tren Web Design 2015

Berbicara mengenai web desain, ini merupakan hal yang luas, termasuk di dalamnya adalah interaksi terhadap penggunanya, banyak developer mengkreasikan ide mereka hingga mendapatkan hasil yang menganggumkan.

Perkembangan web desain dari tahun ke tahun membuat banyak inovasi bermunculan.
Seperti di artikel sebelumnya mengenai 10 Tren Web Design 2014, pada kesempatan kali ini akan di ulas mengenai 10 Tren Web Design 2015.
Banyak desain di tahun 2014 yang masih menjadi favorit di tahun 2015 ini, dengan sedikit kreasi dan perubahan web desain tampak semakin apik.

Berikut ulasannya :

1. Make it Big!
Sama seperti web desain sebelumnya, menggunakan gambar background yang besar hingga memenuhi layar. Background yang dipakai bisa berupa gambar animasi, gambar statis, maupun video yang bisa disajikan dalam bentuk slider. Background dapat dibuat lebih dominan dengan menghilangkan beberapa menu navigasi dan menu-menu yang lain. Lalu dimanakan menu navigasi tersebut? Anda dapat menyediakan satu icon atau tombol dimana ketika user mengklik tombol tersebut, maka menu navigasi akan muncul, ini diadaptasi dari tampilan web responsive, sehingga dapat dikatakan menu navigasi agak tersembunyi.
Contoh websitenya adalah : Borngroup dan Voidandform

2. Multimedia Experience.
Berikan pengalaman multimedia kepada pengunjung sebelum pengunjung mengetahui lebih lanjut tentang website Anda. Anda dapat menggunakan flash dan HTML5 pada website Anda. Tampilkan sebuah presentasi unik tentang produk atau website anda pada beranda dan ajak pengunjung website Anda untuk menggunakan scroll pada mouse untuk memainkannya, atau sajikan tombol unik seperti peta harta karun agar ketika pengunjung mengeklik nya mereka akan dibawa kepada suatu halaman tertentu. Anda juga dapat menyisipkan sebuah instrumental lagu yang akan dimainkan ketika pengunjung mengunjungi website Anda.

Contoh websitenya adalah : Jack Daniel’s, Jviewz dan Raisetheriver

3. Efek Parallax
Ini masih menjadi favorit developer di tahun 2014 ini, yang sebenarnya dari tahun 2013 yang lalu parallax scrolling juga sudah ada, namun kepopularitasannya tidak sebesar di tahun 2014 dan 2015 ini. Parallax scrolling adalah teknik scroll dimana background dan foreground gambar maupun teks bergerak seperti animasi sesuai dengan scroll yang user lakukan. Ini memberikan kesan website lebih hidup.
Ada beberapa kreasi parallax scrolling.
Yang pertama, Scrolling dan menampilkan handwriting animation. Jika anda seorang penulis atau bisnis anda bergerak dalam bidang karya tulis, kreasi satu ini dapat menjadi pilihan. Seperti pada website Mintdesigncompany perusahaan ini menggunakan animasi handwriting.
Yang kedua, innovative scrolling. Anda dapat menyatukan dua jenis scrolling animation (horizontal dan vertikal) dalam satu scroll mouse, contoh websitenya adalah : Quoplus

4. Animated Storybook
Desain ini mirip dengan skema parallax, dengan memanfaatkan scroll bar, animasi akan dimainkan ketika halaman muncul di screen layar pada posisi yang sudah disesuaikan. Dengan meminimalisir kata-kata, pengunjung akan menyaksikan sebuah informasi yang disajikan dalam bentuk animasi visual. Anda dapat mengunjungi website www.boldking.com sebagai referensi Anda.

Website lain yang menggunakan animated storybook adalah website Colinanddewi. Sebuah situs pernikahan yang sederhana, dimana aminated storybook ini dipakai agar pengunjung dapat lebih fokus pada cerita kehidupan Colin dan Dewi. Anda dapat memadupadankan animasi tersebut dengan parallax scrolling, seperti wesbite Habitatweb. Pada website tersebut, animasi akan bergerak sesuai dengan garakan mouse.

5. Flat Design
Masih sama seperti tahun lalu, kepopularitasan web design dengan gaya flat ini masih menjadi pilihan oleh banyak developer. Karena website ini lebih mengusung design yang sederhana, ini menjadi nilai plus tersendiri agar informasi yang disampaikan juga lebih sederhana namun dapat lebih dimengerti oleh pengunjung. Tanpa banyak memberikan efek-efek pada CSS seperti shadows, emboss, gradient dll namun Anda juga dapat menyisipkan beberapa animasi, Flat Web Design benar-benar desain dengan efek tampilan 2 dimensi saja. Anda perlu memperhatikan konsep flat design sebelum mengaplikasikannya kepada website Anda. Kreasikan desain Anda dengan memanfaatkan konsep seperti pada nomor 1. Sembunyikan menu navigasi Anda, dan sediakan sebuah icon button sebagai penggantinya. Anda dapat mengunjugi website Colinanddewi atau Lab21.

6. No more boxes
Memang kita tidak memiliki layar komputer yang berbentuk bulat atu melengkung. Dan screen yang kita pakai berbentuk persegi panjang. Layar persegi panjang memang merupakan frame bagi setiap web design. Namun coba lihat website DANparis, pada website ini developer menggunakan strategi dengan memasukkan beberapa bidang seperti lingkaran, segi enam, dan bahkan bentuk tidak beraturan yang lain, menjadi satu komposisi web design yang keren. Atau dengan memiringkan sedikit horizon? Seperti pada website Lorenzobocchi. Website tersebut menampilkan garis horizon yang dibuat miring dan content-contentnya juga tidak disediakan dengan bentuk tegak lurus, namun miring atau skewed horizon.

Anda dapat memanfaatkan parallax scroll namun halaman tidak mengalami perubahan naik turun dan website di tampilkan dalam satu layar penuh, dan dibuat seperti terbang, contohnya adalah website World of Swiss.

7. Tiles
Jika Anda sudah nyaman dengan bentuk persegi panjang, cara ampuh untuk berkreasi yang lainnya adalah menciptakan sebuah tiles. Anda dapat mengadaptasi dari tiles pada tatap muka Windows 8. Ini akan menjadi lebih mudah ketika website akan disajikan dalam bentuk responsive. Sebagai referensinya, Anda dapat mengunjungi webiste Itsashapechristmas dan Builtbybuffalo.

8. Navigation Widget
Bereksperimen dengan menu navigasi telah menjadi permainan yang favorit dari tahun ke tahun oleh developer. Dan ketika banyak website yang disajikan dalam bentuk flash, ini menjadi puncak bagi developer untuk berlomba-lomba bereksperimen dengan navigasi. Ada masa dimana popularitas web flash menurun dan menu navigasi pun kembali disajikan dalam bentuk statik dan tanpa animasi.

Setelah dari tahun ke tahun, inovasi web design pun kembali ke permukaan, termasuk menu navigasi. Berkreasi dengan menu navigasi saat ini dengan sangat mudah di bantu dengan JavaScript dan interpretasi yang lebih konsisten dengan menggunakan CSS.

Webiste Thedailybeast menyajikan sebuah widget navigasi tetap pada posisinya walupun pengunjung menggulir halaman artikelnya. Website Lesscss menyajikan sebuah widget navigasi yang disebut dengan istilah sticky menu. Maksudnya adalah, menu akan tetap menempel di atas walaupun Anda menggulir layar. Pada website tersebut tampak submenu terexpand ketika user menggulir layar. Kadang-kadang cara ini dikombinasikan dengan script scrollspy untuk membuat widget lebih akurat menunjukkan posisi Anda pada sebuah halaman.

Pada website Humcreative menunjukan posisi menu navigasi berada pada setiap sisi pojok halaman.

Mungkin Anda juga ingin mengaplikasikan teknik street view seperti pada Google Map, pada website Ohdeergames jika Anda menggulir halaman, maka menu-menu navigasi akan menempel pada suatu titik tertentu dan akan mendekat ketika Anda mulai menggulir.

9. Mengintegrasikan Google Map
Tren ini sudah ada di tahun kemarin, namun tidak ada salahnya jika kembali sebagai pilihan di tahun 2015. Seperti website Bestofbritishunsigned yang memanfaatkan Google Map untuk menampilkan artis/musisi pada suatu lokasi tertentu.

Atau website 50problems50days yang menampilkan map 50 masalah yang terjadi dalam 50 hari di wilayah Eropa.

10. Mashup Interfaces
Banyak tantangan yang akan dihadapi ketika ingin berkreasi dengan website yang menyajikan satu halaman dengan banyak konten, bagaimana cara untuk menyediakan suatu informasi dan fungsi pada satu halaman dan halaman harus memiliki tampilan yang modern dan bersih.
Solusinya adalah dengan Mashup Interface, yaitu layout yang terdiri dari banyak ‘lapisan’ dengan menyesuaikan fungsi yang di panggil atau menyesuaikan kontennya.

Website Necotrans memang memiliki sedikit konten, dengan kalimat yang sederhana dan gambar yang tampil secara penuh pada layar. Namun ada terdapat menu navigasi yang tidak begitu besar terlihat yang memungkinkan pengunjung untuk akses ke semua fungsi atau menu penting dalam satu area layar yang sama. Dengan mengombinasikan dengan animasi parallax scrolling, maka website ini akan tampak sangat menarik.

Kesepuluh tren website di atas sebagian telah menjadi tren di tahun-tahun yang lalu. Namun tidak ada salahnya jika Anda ingin berkreasi dan memadupadankan teknik satu dengan yang lainnya.
Mana yang menjadi favorit Anda? Perlu diingat bahwa, sebelum memulai mendesain suatu website, Anda perlu memikirkan apa konten utama yang akan Anda sajikan.

Dikutip dari 99designs.com