Contoh website Interaktif modern

Contoh website Interaktif modern

Baca Juga

Website interaktif atau situs interaktif yaitu komunikasi dua arah. Dua arah antara si pemilik web dengan pengunjung web itu sendiri. Jadi dalam web itu memungkinkan para pembaca untuk berinteraksi dengan penulis atau dengan pembaca lain. Misalnya bertanya atau berkomentar atau mungkin juga saling menambah informasi dari apa yang mereka baca,


Berikut ini adalah beberapa contoh website interaktif yang layak untuk Anda kunjungi, lihat, perhatikan dan bahkan dijadikan inspirasi untuk project Anda berikutnya.

Cavalier

cavalier
Cavalier adalah eksperimen yang luar biasa kerena dibuat dengan WebGL dan SVG, menghasilkan 3D game berbasis browser website.

Humboldt California

humboldt california
Jelajahi keindahan Humboldt California menggunakan navigasi yang aneh untuk membantu pengunjung mengekplorasi dan menandai lokasi yang ditampilkan dalam video fullscreen untuk membuat jadwal perjalanan.

Panera

panera bright
Panera membawa pengunjung untuk melalui tiga permodelan rumit dan animasi foodscapes saat melakukan aksi dan misi pada website tersebut.

Villes & Paysages

villes paysages
Villes & Paysages adalah agensi arsitektur dan badan perencanaan kota internasional yang menggunakan gestur dan peta interaktif untuk mengekplorasi berbagai proyek yang pernah mereka kerjakan.

Cobay.es

cobayes
Cobay.es menawarkan kesempatan untuk membentuk pendapat Anda sendiri tentang pengujian hewan melalui pengalaman interaktif yang melibatkan sebagian besar pada pilihan dan melakukan scroll.

Instant Caribbean Vacation

carnival instant caribbean-vacation
Website liburan Instant Caribbean Vacation merupakan website dengan tampilan antarmuka yang memiliki fitur video 360 derajat. Pengguna dapat memilih petualangan mereka sendiri yang mereka ambil dalam pemandangan dan suara dari pelayaran.

Retro Minder

retro movies
Website game HTML5 yang menyenangkan ini menampilkan gambar dari film retro dan menantang Anda untuk mengetik aktor secepat yang Anda bisa untuk mendapatkan skor yang tinggi.

Residente

residente
Artis musik Residente mendokumentasikan perjalanannya diseluruh dunia. Situs ini dilengkapi dengan peta interaktif dimana kita semua terhubung satu sama lain.

Timelikes

timelikes

Apakah Anda pernah bertanya-tanya halaman Facebook apa saja yang sudah Anda like? lalu kapan Anda melakukan hal tersebut? Website interaktif bertema Timelikes ini menampilkan semua like yang pernah Anda lakukan besarta tahun Anda melakukannya, website ini dilengkapi dengan timeline 3D yang terlihat luar biasa keren. Untuk bisa melakukan ini Anda harus menghubungkan website ini dengan Akun Facebook Anda, Anda bisa melakukan navitasi dengan maju mundur di timeline tersebut.

Eyezen

eyezen fanatic esports
The Eyezen Challenge adalah sebuah game menarik yang memungkinkan Anda untuk menghadapi bintang Fanatic eSport yaitu Martin “Rekkles” Larsson, gunakan mata Anda saja ya..

Radio Garden

tune radio
Radio Garden membawa kita Jelajahi dan dengarkan radio-radio yang ada diseluruh dunia dengan website ini, radio Indonesia juga ada lho, Anda akan digiring langsung untuk memilih radio yang berada disekitar lokasi Anda berada saat ini, berdasarkan koneksi internet yang Anda gunakan.

Window Wonderland

window wonderland
Berjalan-jalan melalui tradisi liburan New York, Anda bisa melihat 18 toko yang berbeda dan menampilkan sihir mereka melalui efek parallax 360 yang sangat menarik di website Window Wonderland.

The Kennedy Center

jfkc
Animasi GSAP, snap.svg dan cerita visual hadir bersamaan dalam pembuatan sebuah restrospektif mendalam dari Pusat Antariksa Kennedy.

Weareuprising

digital uprising
Website portofolio dari agensi digital ini menggunakan berbagai librari Javascript diantaranya triangle.js, angular.js, underscore.js, dan hammer.js untuk mendemonstrasikan skill tampilan antarmukanya yang mumpuni. Ini adalah contoh penggunaan fitur yang menekankan pada apa yang dipilih oleh pengguna dan lebih lanjut tentang microinteraction dan penggunaan suara.

Air View

air view
Pada website Air View ini Anda bisa melihat kualitas udara yang Anda hirup saat ini berdasarkan data visualisasi dari WHO dan Google Street View. Klik pada setiap titik untuk membuka informasi lebih detail tentang masing-masing bagian.

Syria Stories

syria stories
Syria Stories adalah seri video singkat dari zona peperangan yang terjadi di Suriah. Interaksi pengguna adalah sebuah bagian utama yang berfungsi untuk melanjutkan setiap bagian video, menghanyutkan pengguna dan akhirnya membuatnya bersedia untuk memberikan donasi.

Lyndsey Belle Tyler

lyndsey belle tyler
Tampilan interaktif dari seniman, penulis Lyndsey Belle Tyler ini dimulai dengan sebuah pilihan dan menawarkan sebuah audio visual untuk menjelajahi kategori berbeda dari portfolionya. Jangan lupa untuk melakukan klik-kanan untuk menampilkan menu dari setiap bagian.

Explore Japan Burma Vietnam

explore japan burma indochina
Jelajahi Jepang, Burma dan Vietnam dengan sebuah website yang menampilkan peta interaktif dari setiap pilihan tujuan yang ditawarkan dengan menggunakan pemandangan foto 360 derajat, website ini dibuat dengan Angular dan GSAP.

Hollow

hollow
Ketika Anda masuk ke Hollow Anda akan dikelilingi oleh jutaan tahun evolusi dan sejarah manusia. Interaksi menggunakan gestur untuk bergerak dan memberi Anda dua sudut pandang untuk mengeksplorasi diri. Website ini dibangun dengan WebGL dan Firebase.

BUAT WEBSITE INTERAKTIF ANDA SENDIRI

Anda juga bisa membuat website interaktif Anda sendiri karena saat ini cukup banyak tools yang bisa dimanfaatkan untuk hal tersebut. Tutorial juga sudah sangat mudah ditemukan di internet. Anda bisa memulai dengan mengikuti kursus simulasi website interaktif dengan HTML yang dibuat oleh Weber State University untuk membantu kita memahami bagaimana website interaktif itu sebenarnya.
Kemudian meloncat ke kursus pembuatan website interaktif yang disediakan oleh CodeCademy.
Anda juga bisa menggunakan resources dibawah ini untuk belajar beberapa script dalam pembuatan website interaktif yang kekinian.
  • GSAP Animation
  • Underscore.js
  • Hammer.js
  • Three.js
Itulah sejumlah resources dan contoh website interaktif yang dibuat dengan kekuatan HTML5, CSS dan Javascript yang bisa Anda nikmati dan jadikan inspirasi untuk project Anda berikutnya. Semoga apa yang Jurnalweb.com sajikan ini berguna bagi Anda semua.

Tidak ada komentar