{"id":3082,"date":"2023-07-04T13:28:09","date_gmt":"2023-07-04T06:28:09","guid":{"rendered":"https:\/\/bikin.website\/blog\/?p=3082"},"modified":"2024-03-07T13:29:32","modified_gmt":"2024-03-07T06:29:32","slug":"contoh-website-micro-interaction","status":"publish","type":"post","link":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/","title":{"rendered":"5 + Contoh Website dengan Micro Interaction yang Bisa Jadi Inspirasi"},"content":{"rendered":"

Kalau dilihat, <\/span>micro interaction<\/span><\/i><\/a> <\/i>memang jadi unsur kecil dalam keseluruhan UI website maupun aplikasi.\u00a0<\/span><\/p>\n

Namun, seperti yang Anda ketahui nih, dampaknya cukup baik untuk meningkatkan user experience<\/em><\/a><\/span>\u00a0<\/em>para pengunjung.<\/span><\/p>\n

Dengan adanya informasi status sistem terkini, animasi pada tombol atau saat <\/span>loading<\/span><\/i>, website jadi tampil lebih menarik dan dinamis.<\/span><\/p>\n

Meski ini hanya unsur sederhana, tetap butuh riset dan pertimbangan untuk membuatnya. Jangan sampai ini malah jadi fitur tambahan tidak berguna di website Anda.<\/span><\/p>\n

Nah, untuk membantu Anda membuat fitur <\/span>micro interaction<\/span><\/i> yang tepat, kami akan membagikan beberapa contoh website yang bisa Anda jadikan inspirasi.<\/span><\/p>\n

Contoh Website Micro Interaction<\/b><\/h2>\n

Sebelumnya, sudah sempat disinggung nih soal beberapa bentuk <\/span>micro interaction<\/span><\/i>. Seperti animasi saat <\/span>loading<\/span><\/i>, tombol dan contoh <\/span>micro interaction<\/span><\/i> di website lainnya yang sudah disebutkan.<\/span><\/p>\n

Tapi, sebetulnya bentuk <\/span>micro interaction<\/span><\/i> di website sendiri tidak hanya terbatas pada contoh tersebut. Nah, dalam contoh yang akan kami bagikan ini, Anda bisa temukan beragam bentuk <\/span>micro interaction<\/span><\/i> yang juga bisa Anda aplikasikan pada website.<\/span><\/p>\n

1. WWF (World Wildlife Fund)<\/a><\/b><\/h3>\n

Siapa sih yang tidak mengenal WWF? Ini adalah salah satu organisasi <\/span>non-government<\/span><\/i> tingkat dunia yang cukup populer.<\/span><\/p>\n

Seperti yang Anda ketahui nih, WWF merupakan organisasi dunia yang bergerak di pelestarian lingkungan hidup.<\/span><\/p>\n

Misinya pun berada di berbagai negara lho, termasuk Indonesia. Nah, untuk menjalankan misinya ini, WWF menggunakan website sebagai sarana publikasi mereka.\u00a0<\/span><\/p>\n

Yang mana, desain website dari organisasi dunia yang satu ini sangat interaktif. Anda bisa temukan berbagai unsur <\/span>micro interaction<\/span><\/i> dalam UI website WWF.<\/span><\/p>\n

Dari yang paling sederhana saja, mereka menggunakan <\/span>hover<\/span><\/i> warna yang gelap pada tiap tombol CTA-nya.<\/span><\/p>\n

Tidak hanya itu, saat Anda mengarahkan kursor ke menu, Anda akan langsung melihat semua sub menu yang ada.<\/span><\/p>\n

Menariknya, WWF juga memberikan sentuhan <\/span>micro interaction<\/span><\/i> saat para pengunjung <\/span>scroll <\/span><\/i>halaman ke bawah, lho.\u00a0<\/span><\/p>\n

Alih-alih konten yang langsung muncul, <\/span>web developer<\/span><\/i> dari WWF membuat tiap kontennya muncul satu per satu ketika halaman di-<\/span>scroll<\/span><\/i>.<\/span><\/p>\n

Sangat menarik, bukan? Anda bisa nih menjadikan WW sebagai contoh aplikasi fitur <\/span>micro interaction<\/span><\/i> untuk website NGO.<\/span><\/p>\n

2. Anna Jona<\/a><\/b><\/h3>\n

Membuat website untuk bisnis memang tampaknya sangat mudah. Tapi, ini tidak berlaku sama nih untuk Anda yang menjalankan bisnis di bidang F&B.<\/span><\/p>\n

Untuk mempromosikan restoran maupun kafe, Anda harus bisa membawa suasana nyatanya melalui website atau media sosial.<\/span><\/p>\n

Nah, salah satu caranya adalah dengan membuat website yang interaktif dengan beberapa sentuhan <\/span>micro interaction<\/span><\/i>.<\/span><\/p>\n

Anna Jona adalah salah satu contoh website bisnis untuk kafe, bar dan mini bioskop yang apik nih dalam mengaplikasikan <\/span>micro interaction<\/span><\/i> pada UI website mereka.<\/span><\/p>\n

Alih-alih membuat website bisnis yang standar, Anna Jona mengajak Anda untuk <\/span>mampir<\/span><\/i> ke kafenya dengan cara yang unik.\u00a0<\/span><\/p>\n

Mulai dari saat Anda <\/span>scroll <\/span><\/i>halaman website, Anda akan melihat beberapa perubahan warna. Ditambah lagi dengan <\/span>text color<\/span><\/i> yang berubah tiap kata dari gelap ke terang.<\/span><\/p>\n

Lalu, diakhiri dengan <\/span>link<\/span><\/i> reservasi yang juga menggunakan <\/span>micro interaction<\/span><\/i> yang unik, tapi berfungsi dengan baik. Sehingga, Anda bisa tahu nih <\/span>link<\/span><\/i> mana yang Anda klik\u00a0 nantinya.<\/span><\/p>\n

3. Qwords<\/a><\/b><\/h3>\n

Apakah Anda memiliki bisnis yang bergerak di bidang IT? Membuat website bisnis di bidang IT memang tidak bisa se-interaktif Anna Jona atau WWF.<\/span><\/p>\n

Tapi, ini bukan berarti tampilan website IT hanya boleh polos tanpa ada interaksi sama sekali di UI-nya. Anda bisa kok menambahkan unsur <\/span>micro interaction<\/span><\/i> di seluruh bagian website.<\/span><\/p>\n

Nah, Qwords adalah salah satu website bisnis di bidang IT yang bisa Anda jadikan contoh penggunaan <\/span>micro interaction<\/span><\/i> yang menarik nih.<\/span><\/p>\n

Kalau Anda mengakses website Qwords sendiri, unsur <\/span>micro interaction<\/span><\/i> pertama yang bisa Anda lihat adalah pada tombolnya. <\/span>Saat Anda mengarahkan kursor ke tombol, Anda akan melihat perubahan pada warna <\/span>background<\/span><\/i> dan teksnya.<\/span><\/p>\n

Selain itu, Anda juga bisa melihat animasi kado yang bergerak pada menu Promo seakan ingin menarik perhatian Anda untuk mengklaim promo yang berlangsung.<\/span><\/p>\n

Tidak berhenti sampai di situ, konten dalam halaman website Qwords juga tampil satu per satu saat Anda <\/span>scroll<\/span><\/i> ke bawah.<\/span><\/p>\n

Lihat kan, bagaimana website bisnis di bidang IT pun juga bisa tampil interaktif dengan unsur <\/span>micro interaction<\/span><\/i> di dalamnya?<\/span><\/p>\n

4. IKEA<\/b><\/h3>\n

Jika beberapa contoh website di atas menggunakan unsur <\/span>micro interaction<\/span><\/i> yang hampir sama dan beberapa sedikit kompleks, IKEA punya menggunakan unsur yang berbeda.<\/span><\/p>\n

Secara keseluruhan, IKEA memang memiliki tampilan yang standar. Tidak se-interaktif contoh website lainnya di atas.<\/span><\/p>\n

Tapi, ada satu nih yang membuat website IKEA ini unik dan bisa menjadi contoh <\/span>micro interaction<\/span><\/i> yang oke. Yaitu saat Anda mem-<\/span>block<\/span><\/i> kata di dalam website.<\/span><\/p>\n

Alih-alih menggunakan warna biru dengan tulisan putih atau hitam seperti pada umumnya, Anda akan melihat warna yang sama dengan logo IKEA.<\/span><\/p>\n

Yup<\/span><\/i>, IKEA memilih untuk menggunakan latar biru dengan teks kuning saat pengunjung mem-<\/span>block<\/span><\/i> teks tersebut. <\/span>Unsur <\/span>micro interaction<\/span><\/i> yang seperti tidak seberapa ini malah semakin menguatkan ciri khas dari IKEA, lho.\u00a0<\/span><\/p>\n

Selain <\/span>text block<\/span><\/i>, tentu ada beragam <\/span>micro interaction<\/span><\/i> lainnya di dalam website IKEA yang bisa Anda jadikan contoh.\u00a0<\/span>Seperti efek gambar timbul atau teks yang muncul di sebelah <\/span>icon <\/span><\/i>diskon saat Anda mengarahkan kursor.<\/span><\/p>\n

5. Wattpad<\/b><\/h3>\n

Biasanya, saat Anda membaca blog dan <\/span>scrolling<\/span><\/i> halaman ke bawah, fitur apa yang muncul? Bisa ditebak, hampir tidak ada.<\/span><\/p>\n

Wajar saja karena memang kebanyakan blog tidak menggunakan fitur tertentu saat <\/span>scroll<\/span><\/i> halaman. Tapi, Wattpad sangatlah berbeda.<\/span><\/p>\n

Wattpad memang bukan merupakan website bisnis. Tapi, unsur <\/span>micro interaction<\/span><\/i> yang dibuat oleh Wattpad dalam versi website ini bisa Anda jadikan contoh.<\/span><\/p>\n

Kenapa? Karena Anda akan melihat <\/span>line<\/span><\/i> yang bergerak di bagian atas layar seiring dengan halaman yang di-<\/span>scroll<\/span><\/i> ke bawah.<\/span><\/p>\n

Ini memberikan para pembaca tanda sudah seberapa jauh mereka membaca konten tersebut. Pembaca juga jadi bisa tahu nih berapa banyak lagi informasi atau konten yang tersisa.<\/span><\/p>\n

Tidak hanya itu, lho. Bahkan, Wattpad pun juga memberikan informasi berapa menit sisa waktu yang dibutuhkan untuk membaca lewat fitur tersebut.<\/span><\/p>\n

Ini merupakan salah satu contoh unsur <\/span>micro interaction<\/span><\/i> yang bisa Anda terapkan nih pada website blog.\u00a0<\/span><\/p>\n

Lewat fitur ini, pengunjung bisa tahu apakah konten ini masih panjang dan apakah ada bagian penting yang harus mereka baca lagi?<\/span><\/p>\n

6. Hubspot<\/a><\/b><\/h3>\n

Selain Wattpad, ada pula Hubspot yang juga memiliki fitur <\/span>micro interaction<\/span><\/i> yang sama di blog-nya yang bisa Anda jadikan inspirasi.<\/span><\/p>\n

Selain efek <\/span>scroll<\/span><\/i>, Anda juga bisa menemukan berbagai contoh <\/span>micro interaction<\/span><\/i> lainnya dalam UI website mereka.<\/span><\/p>\n

Misalnya nih seperti efek memutar pada <\/span>icon <\/span><\/i>menu website Hubspot dalam tampilan <\/span>mobile<\/span><\/i>. Meski tampaknya sepele, efek ini sebetulnya bisa memberikan pengalaman yang berbeda lho pada pengunjung.<\/span><\/p>\n

Tidak hanya <\/span>micro interaction<\/span><\/i>, Hubspot juga memiliki fitur <\/span>web accessibility<\/span><\/i><\/a> berupa High Contrast yang juga bisa Anda jadikan contoh, lho.<\/span><\/p>\n

Sudah dapat Inspirasi Micro Interaction untuk Website?<\/b><\/h2>\n

Dari berbagai contoh website di atas, Anda bisa melihat nih berbagai bentuk <\/span>micro interaction<\/span><\/i>. Mulai dari animasi pada tombol, <\/span>loading<\/span><\/i>, <\/span>scrolling<\/span><\/i>, <\/span>text block<\/span><\/i> dan sebagainya.<\/span><\/p>\n

Memang mengaplikasikan <\/span>micro interaction<\/span><\/i> seperti berbagai contoh website di atas bisa membuat tampilan website Anda juga menarik.\u00a0<\/span><\/p>\n

Tapi, Anda tidak harus membuat <\/span>micro interaction<\/span><\/i> yang sama, kok. Anda bisa sesuaikan saja dengan jenis website dan tentunya target audiens Anda.<\/span><\/p>\n

Jangan sampai keinginan untuk membuat tampilan lebih menarik dengan <\/span>micro interaction<\/span><\/i> malah membuat website jadi lambat.\u00a0<\/span><\/p>\n

Kalau begini, yang ada <\/span>user experience<\/span><\/i> pengunjung jadi menurun. Untuk itu, supaya Anda tidak salah dan website makin maksimal, Anda bisa nih konsultasikan lebih dulu dengan tim Bikin.Website.<\/span><\/p>\n

Anda bisa konsultasikan konsep website Anda dengan segala unsur <\/span>micro interaction<\/span><\/i> yang ada. Setelah itu, biarkan tim Bikin.Website memproses website Anda.<\/span><\/p>\n

Hubungi Tim Bikin.Website Di Sini!<\/a><\/p>\n

Nah, sampai di sini dulu ya artikel kami kali ini. Semoga Anda bisa mendapatkan inspirasi nih dari contoh yang kami berikan untuk membuat unsur <\/span>micro interaction<\/span><\/i> yang tepat di website Anda.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Kalau dilihat, micro interaction memang jadi unsur kecil dalam keseluruhan UI website maupun aplikasi.\u00a0 Namun, seperti yang Anda ketahui nih, dampaknya cukup baik untuk meningkatkan user experience\u00a0para pengunjung. Dengan adanya informasi status sistem terkini, animasi pada tombol atau saat loading, website jadi tampil lebih menarik dan dinamis. Meski ini hanya unsur sederhana, tetap butuh riset […]<\/p>\n","protected":false},"author":8,"featured_media":3104,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[981,3,835],"tags":[578,1054,1055],"class_list":["post-3082","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-optimasi-website","category-tips","category-website","tag-contoh-website","tag-inspirasi-website","tag-web-micro-interaction"],"yoast_head":"\n5 + Contoh Website Micro Interaction yang Bisa Jadi Inspirasi<\/title>\n<meta name=\"description\" content=\"Fitur micro interaction dapat meningkatkan user experience. Dapatkan inspirasi micro interaction dari berbagai contoh website berikut!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"5 + Contoh Website Micro Interaction yang Bisa Jadi Inspirasi\" \/>\n<meta property=\"og:description\" content=\"Fitur micro interaction dapat meningkatkan user experience. Dapatkan inspirasi micro interaction dari berbagai contoh website berikut!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/\" \/>\n<meta property=\"og:site_name\" content=\"Bikin.Website\" \/>\n<meta property=\"article:published_time\" content=\"2023-07-04T06:28:09+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-07T06:29:32+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/contoh-website-micro-interaction.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1333\" \/>\n\t<meta property=\"og:image:height\" content=\"992\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Severina Ratih\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Severina Ratih\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/\"},\"author\":{\"name\":\"Severina Ratih\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#\\\/schema\\\/person\\\/aa838f6f33fc51efa6b5c41f140ef040\"},\"headline\":\"5 + Contoh Website dengan Micro Interaction yang Bisa Jadi Inspirasi\",\"datePublished\":\"2023-07-04T06:28:09+00:00\",\"dateModified\":\"2024-03-07T06:29:32+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/\"},\"wordCount\":1227,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/contoh-website-micro-interaction.jpg\",\"keywords\":[\"contoh website\",\"inspirasi website\",\"web micro interaction\"],\"articleSection\":[\"Optimasi Website\",\"Tips\",\"website\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/\",\"name\":\"5 + Contoh Website Micro Interaction yang Bisa Jadi Inspirasi\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/contoh-website-micro-interaction.jpg\",\"datePublished\":\"2023-07-04T06:28:09+00:00\",\"dateModified\":\"2024-03-07T06:29:32+00:00\",\"description\":\"Fitur micro interaction dapat meningkatkan user experience. Dapatkan inspirasi micro interaction dari berbagai contoh website berikut!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#primaryimage\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/contoh-website-micro-interaction.jpg\",\"contentUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/contoh-website-micro-interaction.jpg\",\"width\":1333,\"height\":992,\"caption\":\"contoh website micro interaction\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/contoh-website-micro-interaction\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/bikin.website\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"5 + Contoh Website dengan Micro Interaction yang Bisa Jadi Inspirasi\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/\",\"name\":\"Bikin.Website\",\"description\":\"Tips Bikin Website dan Bisnis Online\",\"publisher\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/bikin.website\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#organization\",\"name\":\"Bikin.Website\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/10\\\/logo-blue.png\",\"contentUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/10\\\/logo-blue.png\",\"width\":3342,\"height\":409,\"caption\":\"Bikin.Website\"},\"image\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#\\\/schema\\\/person\\\/aa838f6f33fc51efa6b5c41f140ef040\",\"name\":\"Severina Ratih\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9411c8b4eb3fe830f4c8f9a82aa3fad4efc9579f53fddb86a462773e9d63796b?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9411c8b4eb3fe830f4c8f9a82aa3fad4efc9579f53fddb86a462773e9d63796b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9411c8b4eb3fe830f4c8f9a82aa3fad4efc9579f53fddb86a462773e9d63796b?s=96&d=mm&r=g\",\"caption\":\"Severina Ratih\"},\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/author\\\/severina\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"5 + Contoh Website Micro Interaction yang Bisa Jadi Inspirasi","description":"Fitur micro interaction dapat meningkatkan user experience. Dapatkan inspirasi micro interaction dari berbagai contoh website berikut!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/","og_locale":"en_US","og_type":"article","og_title":"5 + Contoh Website Micro Interaction yang Bisa Jadi Inspirasi","og_description":"Fitur micro interaction dapat meningkatkan user experience. Dapatkan inspirasi micro interaction dari berbagai contoh website berikut!","og_url":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/","og_site_name":"Bikin.Website","article_published_time":"2023-07-04T06:28:09+00:00","article_modified_time":"2024-03-07T06:29:32+00:00","og_image":[{"width":1333,"height":992,"url":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/contoh-website-micro-interaction.jpg","type":"image\/jpeg"}],"author":"Severina Ratih","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Severina Ratih","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#article","isPartOf":{"@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/"},"author":{"name":"Severina Ratih","@id":"https:\/\/bikin.website\/blog\/#\/schema\/person\/aa838f6f33fc51efa6b5c41f140ef040"},"headline":"5 + Contoh Website dengan Micro Interaction yang Bisa Jadi Inspirasi","datePublished":"2023-07-04T06:28:09+00:00","dateModified":"2024-03-07T06:29:32+00:00","mainEntityOfPage":{"@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/"},"wordCount":1227,"commentCount":0,"publisher":{"@id":"https:\/\/bikin.website\/blog\/#organization"},"image":{"@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#primaryimage"},"thumbnailUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/contoh-website-micro-interaction.jpg","keywords":["contoh website","inspirasi website","web micro interaction"],"articleSection":["Optimasi Website","Tips","website"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/","url":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/","name":"5 + Contoh Website Micro Interaction yang Bisa Jadi Inspirasi","isPartOf":{"@id":"https:\/\/bikin.website\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#primaryimage"},"image":{"@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#primaryimage"},"thumbnailUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/contoh-website-micro-interaction.jpg","datePublished":"2023-07-04T06:28:09+00:00","dateModified":"2024-03-07T06:29:32+00:00","description":"Fitur micro interaction dapat meningkatkan user experience. Dapatkan inspirasi micro interaction dari berbagai contoh website berikut!","breadcrumb":{"@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#primaryimage","url":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/contoh-website-micro-interaction.jpg","contentUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/contoh-website-micro-interaction.jpg","width":1333,"height":992,"caption":"contoh website micro interaction"},{"@type":"BreadcrumbList","@id":"https:\/\/bikin.website\/blog\/contoh-website-micro-interaction\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bikin.website\/blog\/"},{"@type":"ListItem","position":2,"name":"5 + Contoh Website dengan Micro Interaction yang Bisa Jadi Inspirasi"}]},{"@type":"WebSite","@id":"https:\/\/bikin.website\/blog\/#website","url":"https:\/\/bikin.website\/blog\/","name":"Bikin.Website","description":"Tips Bikin Website dan Bisnis Online","publisher":{"@id":"https:\/\/bikin.website\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/bikin.website\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/bikin.website\/blog\/#organization","name":"Bikin.Website","url":"https:\/\/bikin.website\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bikin.website\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2019\/10\/logo-blue.png","contentUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2019\/10\/logo-blue.png","width":3342,"height":409,"caption":"Bikin.Website"},"image":{"@id":"https:\/\/bikin.website\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/bikin.website\/blog\/#\/schema\/person\/aa838f6f33fc51efa6b5c41f140ef040","name":"Severina Ratih","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/9411c8b4eb3fe830f4c8f9a82aa3fad4efc9579f53fddb86a462773e9d63796b?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/9411c8b4eb3fe830f4c8f9a82aa3fad4efc9579f53fddb86a462773e9d63796b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9411c8b4eb3fe830f4c8f9a82aa3fad4efc9579f53fddb86a462773e9d63796b?s=96&d=mm&r=g","caption":"Severina Ratih"},"url":"https:\/\/bikin.website\/blog\/author\/severina\/"}]}},"_links":{"self":[{"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts\/3082","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/comments?post=3082"}],"version-history":[{"count":7,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts\/3082\/revisions"}],"predecessor-version":[{"id":3105,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts\/3082\/revisions\/3105"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/media\/3104"}],"wp:attachment":[{"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/media?parent=3082"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/categories?post=3082"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/tags?post=3082"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}