{"id":1854,"date":"2023-07-07T09:20:13","date_gmt":"2023-07-07T02:20:13","guid":{"rendered":"https:\/\/bikin.website\/blog\/?p=1854"},"modified":"2023-07-10T08:20:41","modified_gmt":"2023-07-10T01:20:41","slug":"perbedaan-ui-dan-ux","status":"publish","type":"post","link":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/","title":{"rendered":"Perbedaan UI dan UX Beserta Cara Kerjanya"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">UI dan UX pada pengembangan website dan juga aplikasi memang sangatlah penting dan akan saling berkaitan.\u00a0<\/span><span style=\"font-weight: 400;\">Tetapi manakah yang akan lebih penting diantara mereka?\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Di dalam artikel ini akan membahas mengenai perbedaan UI dan UX sehingga Anda saat ini berada di artikel yang tepat.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Bukan hanya membahas mengenai perbedaan UI dan UX saja, di artikel ini juga akan membahas mengenai cara kerja dari UI dan UX.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Yuk langsung saja kita bahas tentang perbedaan <a href=\"https:\/\/bikin.website\/blog\/apa-itu-ui-dan-ux\/\" target=\"_blank\" rel=\"noopener\">UI dan UX<\/a> beserta cara kerjanya!<\/span><\/p>\n<h2><b>Perbedaan UI dan UX\u00a0<\/b><\/h2>\n<figure id=\"attachment_1857\" aria-describedby=\"caption-attachment-1857\" style=\"width: 732px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/perbedaan-ui-dan-ux-1.webp\"><img decoding=\"async\" class=\" wp-image-1857\" src=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/perbedaan-ui-dan-ux-1-300x166.webp\" alt=\"perbedaan ui dan ux\" width=\"732\" height=\"405\" srcset=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/perbedaan-ui-dan-ux-1-300x166.webp 300w, https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/perbedaan-ui-dan-ux-1-1024x568.webp 1024w, https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/perbedaan-ui-dan-ux-1-768x426.webp 768w, https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/perbedaan-ui-dan-ux-1.webp 1478w\" sizes=\"(max-width: 732px) 100vw, 732px\" \/><\/a><figcaption id=\"caption-attachment-1857\" class=\"wp-caption-text\">perbedaan ui ux<\/figcaption><\/figure>\n<p>Seperti yang disinggung di awal, UI dan UX merupakan dua komponen yang sering berkolaborasi dalam proses pengembangan aplikasi maupun website.<\/p>\n<p>Tepatnya, UI dan UX nantinya akan bekerja sama dalam pembuatan desainnya. Fungsi kedua komponen ini pun berbeda dalam desain aplikasi dan website.<\/p>\n<p>Nah, berikut ini sudah kami rangkum perbedaan antara UI dan UX dalam desain aplikasi dan website. Yuk, simak!<\/p>\n<h3><b>1. Tujuan desain\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Yang mendasar dari perbedaan UI dan UX ini ialah tujuan desainnya. <\/span><span style=\"font-weight: 400;\">Fokus pembuatan desain pada UI dan UX ini sangatlah berbeda.\u00a0<\/span><\/p>\n<p>UX atau\u00a0user experience sendiri merupakan komponen dalam desain produk yang berfokus pada pengalaman pengguna.<\/p>\n<p>Untuk itu, tujuan dari mengembangkan UX sendiri adalah supaya pengguna atau pengunjung bisa mendapatkan pengalaman terbaik mereka saat menggunakan produk.<\/p>\n<p>Pengalaman ini tentu mencakup banyak hal. Mulai dari fitur-fitur yang ada, teks, konten, tampilan layout dan sebagainya.<\/p>\n<p>Sedangkan, UI atau user interface merupakan bagian dari UX yang tujuannya untuk membuat tampilan atau desain visual dari aplikasi maupun website.<\/p>\n<p>Jadi, bisa dibilang UX ini berfokus pada bagaimana kita menggunakan aplikasi. Sementara UI berfokus pada apa yang kita lihat dari aplikasi tersebut.<\/p>\n<h3><b>2. Proses desain <\/b><span style=\"font-weight: 400;\">\u00a0<\/span><\/h3>\n<p>Melihat tujuan UI dan UX yang berbeda, tentu ada perbedaan pula dalam proses desain keduanya.<\/p>\n<p><span style=\"font-weight: 400;\">Karena fokusnya pada user experience, maka proses desain UX akan berlandaskan pada riset pengguna. Sehingga akan menghasilkan produk yang disukai serta dibutuhkan oleh pengguna.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Prosesnya pun akan melalui banyak tahapan serta membutuhkan peran dari banyak pihak, dimana salah satunya ada UX researcher.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sehabis melakukan riset maka selanjutnya desainer akan merancang sketsa desain dengan prototype dan wireframe.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dan untuk desain UI juga akan memerlukan riset, tetapi riset yang dilakukan ini merupakan riset desain dalam membuat desain menarik serta sesuai dengan konsep.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pada proses ini, desainer UI perlu untuk merancang model desain dengan membuat mockup nya terlebih dahulu.\u00a0<\/span><\/p>\n<h3><b>3. Komponen desain <\/b><span style=\"font-weight: 400;\">\u00a0<\/span><\/h3>\n<p>Dalam poin pertama, sudah dijelaskan bagaimana UI memiliki fokus pada tampilan atau desain visual suatu aplikasi maupun website.<\/p>\n<p>Untuk itu, komponen dalam desain UI akan meliputi segala sesuatu tentang tampilan. Seperti warna, typography, layout, bentuk, gambar, video, animasi dan sebagainya.<\/p>\n<p>Nah, karena UI merupakan bagian yang juga membangun user experience, visual tentu juga menjadi bagian dari UX.<\/p>\n<p>Akan tetapi, UX memiliki komponen yang jauh lebih luas daripada UI. Tidak hanya soal tampilan, di dalam UX juga terdapat struktur, fitur, navigasi, strategi dan sebagainya.<\/p>\n<p>Yang mana, semua komponen ini dikolaborasikan untuk menciptakan pengalaman yang luar biasa bagi pengguna saat menggunakan aplikasi maupun website.<\/p>\n<h3><b>4. Kemampuan yang dibutuhkan\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Menjadi seorang desainer UI dan atau desainer UX memerlukan kemampuan atau skill tersendiri.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Kemampuan yang dibutuhkan untuk menjadi seorang desainer UI ialah desain grafis, creative thinking, design branding, dan juga convergent thinking.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Kemampuan tersebut harus dimiliki oleh seorang desainer UI untuk mendesain tampilan produk supaya dapat terlihat menarik serta mudah melakukan interaksi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sedangkan untuk seorang desainer UX memiliki tanggung jawab dalam membuat desain produk dengan melakukan pendekatan pengguna supaya dapat lebih mudah digunakan.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Maka dari itu para desainer UI dan UX perlu memiliki kemampuan riset, problem solving, analytical thinking, creative thinking, dan juga critical thinking.\u00a0<\/span><\/p>\n<h3><b>5. Tools yang digunakan\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Dalam proses pembuatan bila ingin hasilnya beda pastinya membutuhkan tools yang akan berbeda.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Untuk seorang desainer UI keindahan gambar akan sangatlah penting, sehingga desainer UI membutuhkan aplikasi mendukung pembuatan desain interface secara detail.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Banyak jenis aplikasi desain UI yang ada, contohnya seperti Principle, Flinto, Adobe illustrator, Frames X, dan masih banyak lagi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Aplikasi-aplikasi tersebut telah dilengkapi beberapa tools yang mendukung desainer UI, contohnya tools untuk menambahkan unique interaksi icon, UI assets and kits, easy transition, dan masih banyak lagi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sedangkan untuk desainer UX akan lebih membutuhkan aplikasi prototyping desain supaya mudah dalam mendapatkan feedback dari para pengguna.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Beberapa jenis aplikasi prototyping desain yang mendukung untuk desainer UX seperti Figma, InVision, Sketch, Axure, Adobe XD, dan masih banyak lagi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Ada beberapa fitur yang tersedia, contohnya ada fitur collaboration, easy to test design, real time editing, dan masih banyak lagi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Fitur-fitur tersebut memberikan kemudahan bagi desainer UX untuk mendapatkan feedback agar dapat menghasilkan produk user friendly.\u00a0<\/span><\/p>\n<blockquote><p><strong>Baca Juga:\u00a0<\/strong><strong><a href=\"https:\/\/bikin.website\/blog\/jenis-jenis-cms\/\" target=\"_blank\" rel=\"noopener\">Ingin Membuat Website? Yuk Ketahui Jenis-jenis CMS-nya<\/a><\/strong><\/p><\/blockquote>\n<h2><b>Cara Kerja Desain UI dan UX\u00a0<\/b><\/h2>\n<figure id=\"attachment_1856\" aria-describedby=\"caption-attachment-1856\" style=\"width: 741px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/cara-kerja-ui-dan-ux.webp\"><img decoding=\"async\" class=\" wp-image-1856\" src=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/cara-kerja-ui-dan-ux-300x198.webp\" alt=\"cara kerja ui dan ux\" width=\"741\" height=\"489\" srcset=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/cara-kerja-ui-dan-ux-300x198.webp 300w, https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/cara-kerja-ui-dan-ux-1024x677.webp 1024w, https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/cara-kerja-ui-dan-ux-768x508.webp 768w, https:\/\/bikin.website\/blog\/wp-content\/uploads\/2022\/03\/cara-kerja-ui-dan-ux.webp 1270w\" sizes=\"(max-width: 741px) 100vw, 741px\" \/><\/a><figcaption id=\"caption-attachment-1856\" class=\"wp-caption-text\">cara kerja ui dan ux<\/figcaption><\/figure>\n<p><span style=\"font-weight: 400;\">Walaupun UI dan UX berbeda, tetapi keduanya harus tetap bekerja bersama agar dapat tercipta produk yang berkualitas.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Nah pada bagian ini kita akan membahas mengenai cara kerja dari UI dan juga UX. <\/span><span style=\"font-weight: 400;\">Berikut beberapa cara kerja atau workflow desain UI dan UX:\u00a0<\/span><\/p>\n<h3><b>1. Riset UX\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Riset UX ini merupakan langkah awal untuk membuat desain yang baik.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Riset ini dilakukan agar dapat memahami apa yang memang dibutuhkan oleh para pengguna.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Contohnya dalam membuat website toko online Anda perlu untuk mencari tahu bagaimana kebiasaan orang saat berbelanja, cara pembayaran yang disukai, dan masih banyak lagi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dalam melakukan riset UX akan melalui beberapa cara, bisa lewat survey online atau interview user.\u00a0<\/span><\/p>\n<h3><b>2. Membuat information architecture\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Setelah melakukan riset UX maka langkah selanjutnya ialah membuat IA atau information architecture produk.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">IA ini merupakan proses dalam menyusun struktur bagian di website dan juga aplikasi.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dengan adanya IA ini memudahkan tim untuk bisa memahami konsep pada sebuah produk.\u00a0<\/span><\/p>\n<h3><b>3. Membuat Wireframe\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Selanjutnya ada proses wireframing yang merupakan proses sketsa visual pada sebuah produk.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sketsa desain ini memberikan petunjuk alur informasi bagi para user agar dapat mengoperasikan produk.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Disaat inilah peran dari UX designer dalam merancang desain.\u00a0<\/span><\/p>\n<h3><b>4. Mengatur UX flows\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Sehabis membuat wireframe maka selanjutnya perlu untuk mengatur flow mengenai bagaimana sebuah produk tersebut digunakan oleh para pengguna.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Flow ini dibuat dengan melakukan pendekatan UX supaya nantinya para pengguna nyaman dalam menggunakan produk.\u00a0<\/span><\/p>\n<h3><b>5. Membuat prototype desain UX\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Selanjutnya ada tahap membuat prototype desain yang sesuai dengan desain wireframe serta flow yang sudah dibuat.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dalam membuat prototype desain bisa menggunakan aplikasi seperti MockPlus, Adobe XD, Invision, dan masih banyak lagi.\u00a0<\/span><\/p>\n<h3><b>6. Membuat design system\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Selanjutnya tahap membuat design system yang dibuat untuk dapat menyimpan segala komponen desain.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Terlebih komponen desain UI contohnya seperti font, icon, palette, colour, dan masih banyak lagi.\u00a0<\/span><\/p>\n<h3><b>7. Mendesain user interface\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Pada tahapan ini seorang UI designer akan memulai tugasnya dalam mendesain tampilan produk.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">UI designer akan mempercantik sketsa dengan perpaduan tipografi, warna, dan transisi antar halaman dengan elemen yang sudah dibuat pada tahap sebelumnya.\u00a0<\/span><\/p>\n<h3><b>8. Proses pengembangan produk oleh developer\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Pada tahap ini desain yang sudah lolos uji coba akan mulai di develop oleh para developer.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Walaupun sudah masuk ke tahap developing, tugas dari desainer UI dan UX belum berakhir.\u00a0<\/span><\/p>\n<h3><b>9. Design usability test\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Setelah produk tercipta yang tampilan sudah bagus maka produk sudah bisa diluncurkan.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Tetapi sebelum benar diluncurkan, produk tersebut perlu untuk melakukan proses uji coba dengan memberikan skor di setiap fitur desainnya.\u00a0<\/span><\/p>\n<blockquote><p><strong>Baca Juga: <\/strong><strong><a href=\"https:\/\/bikin.website\/blog\/manfaat-website-untuk-bisnis\/\" target=\"_blank\" rel=\"noopener\">5+ Manfaat Memiliki Website untuk Bisnis yang Perlu Diketahui<\/a><\/strong><\/p><\/blockquote>\n<h3><b>Penutup\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Nah itulah tadi pengertian dan penjelasan dari perbedaan UI dan UX semoga artikel ini bermanfaat ya!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Jika saat ini Anda sedang membuat sebuah website jangan lupa untuk menggunakan Bikin.Website sebagai <a href=\"https:\/\/bikin.website\" target=\"_blank\" rel=\"noopener\">jasa layanan pembuatan website<\/a> milik Anda.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Bila masih ada yang ingin ditanyakan maka silahkan tinggalkan komentar dibawah ini.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Terima kasih. <\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>UI dan UX pada pengembangan website dan juga aplikasi memang sangatlah penting dan akan saling berkaitan.\u00a0Tetapi manakah yang akan lebih penting diantara mereka?\u00a0 Di dalam artikel ini akan membahas mengenai perbedaan UI dan UX sehingga Anda saat ini berada di artikel yang tepat.\u00a0 Bukan hanya membahas mengenai perbedaan UI dan UX saja, di artikel ini [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":3118,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[3,409],"tags":[929],"class_list":["post-1854","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tips","category-dev-website","tag-perbedaan-ui-ux"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Perbedaan UI dan UX Beserta Cara Kerjanya - Bikin.Website<\/title>\n<meta name=\"description\" content=\"Pada artikel ini akan membahas mengenai perbedaan ui dan ux sehingga diharapkan dapat memberikan sebuah manfaat.\" \/>\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\/perbedaan-ui-dan-ux\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Perbedaan UI dan UX Beserta Cara Kerjanya - Bikin.Website\" \/>\n<meta property=\"og:description\" content=\"Pada artikel ini akan membahas mengenai perbedaan ui dan ux sehingga diharapkan dapat memberikan sebuah manfaat.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/\" \/>\n<meta property=\"og:site_name\" content=\"Bikin.Website\" \/>\n<meta property=\"article:published_time\" content=\"2023-07-07T02:20:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-10T01:20:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/perbedaan-ui-dan-ux.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=\"mega\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"mega\" \/>\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\\\/perbedaan-ui-dan-ux\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/\"},\"author\":{\"name\":\"mega\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#\\\/schema\\\/person\\\/96252fbfa62ac66731deb70ee96b6e18\"},\"headline\":\"Perbedaan UI dan UX Beserta Cara Kerjanya\",\"datePublished\":\"2023-07-07T02:20:13+00:00\",\"dateModified\":\"2023-07-10T01:20:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/\"},\"wordCount\":1234,\"commentCount\":2,\"publisher\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/perbedaan-ui-dan-ux.jpg\",\"keywords\":[\"perbedaan ui ux\"],\"articleSection\":[\"Tips\",\"Web Dev\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/\",\"name\":\"Perbedaan UI dan UX Beserta Cara Kerjanya - Bikin.Website\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/perbedaan-ui-dan-ux.jpg\",\"datePublished\":\"2023-07-07T02:20:13+00:00\",\"dateModified\":\"2023-07-10T01:20:41+00:00\",\"description\":\"Pada artikel ini akan membahas mengenai perbedaan ui dan ux sehingga diharapkan dapat memberikan sebuah manfaat.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#primaryimage\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/perbedaan-ui-dan-ux.jpg\",\"contentUrl\":\"https:\\\/\\\/bikin.website\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/07\\\/perbedaan-ui-dan-ux.jpg\",\"width\":1333,\"height\":992,\"caption\":\"perbedaan ui dan ux\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/bikin.website\\\/blog\\\/perbedaan-ui-dan-ux\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/bikin.website\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Perbedaan UI dan UX Beserta Cara Kerjanya\"}]},{\"@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\\\/96252fbfa62ac66731deb70ee96b6e18\",\"name\":\"mega\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4588150c2c926782fe4447e3ff17b5be1f58cd5093353bd2b94abbe24eef5c69?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4588150c2c926782fe4447e3ff17b5be1f58cd5093353bd2b94abbe24eef5c69?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4588150c2c926782fe4447e3ff17b5be1f58cd5093353bd2b94abbe24eef5c69?s=96&d=mm&r=g\",\"caption\":\"mega\"},\"description\":\"Seorang Content Writer yang menyukai musik, menonton film, traveling dan tentu saja menulis.\",\"url\":\"https:\\\/\\\/bikin.website\\\/blog\\\/author\\\/mega\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Perbedaan UI dan UX Beserta Cara Kerjanya - Bikin.Website","description":"Pada artikel ini akan membahas mengenai perbedaan ui dan ux sehingga diharapkan dapat memberikan sebuah manfaat.","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\/perbedaan-ui-dan-ux\/","og_locale":"en_US","og_type":"article","og_title":"Perbedaan UI dan UX Beserta Cara Kerjanya - Bikin.Website","og_description":"Pada artikel ini akan membahas mengenai perbedaan ui dan ux sehingga diharapkan dapat memberikan sebuah manfaat.","og_url":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/","og_site_name":"Bikin.Website","article_published_time":"2023-07-07T02:20:13+00:00","article_modified_time":"2023-07-10T01:20:41+00:00","og_image":[{"width":1333,"height":992,"url":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/perbedaan-ui-dan-ux.jpg","type":"image\/jpeg"}],"author":"mega","twitter_card":"summary_large_image","twitter_misc":{"Written by":"mega","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#article","isPartOf":{"@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/"},"author":{"name":"mega","@id":"https:\/\/bikin.website\/blog\/#\/schema\/person\/96252fbfa62ac66731deb70ee96b6e18"},"headline":"Perbedaan UI dan UX Beserta Cara Kerjanya","datePublished":"2023-07-07T02:20:13+00:00","dateModified":"2023-07-10T01:20:41+00:00","mainEntityOfPage":{"@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/"},"wordCount":1234,"commentCount":2,"publisher":{"@id":"https:\/\/bikin.website\/blog\/#organization"},"image":{"@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#primaryimage"},"thumbnailUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/perbedaan-ui-dan-ux.jpg","keywords":["perbedaan ui ux"],"articleSection":["Tips","Web Dev"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/","url":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/","name":"Perbedaan UI dan UX Beserta Cara Kerjanya - Bikin.Website","isPartOf":{"@id":"https:\/\/bikin.website\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#primaryimage"},"image":{"@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#primaryimage"},"thumbnailUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/perbedaan-ui-dan-ux.jpg","datePublished":"2023-07-07T02:20:13+00:00","dateModified":"2023-07-10T01:20:41+00:00","description":"Pada artikel ini akan membahas mengenai perbedaan ui dan ux sehingga diharapkan dapat memberikan sebuah manfaat.","breadcrumb":{"@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#primaryimage","url":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/perbedaan-ui-dan-ux.jpg","contentUrl":"https:\/\/bikin.website\/blog\/wp-content\/uploads\/2023\/07\/perbedaan-ui-dan-ux.jpg","width":1333,"height":992,"caption":"perbedaan ui dan ux"},{"@type":"BreadcrumbList","@id":"https:\/\/bikin.website\/blog\/perbedaan-ui-dan-ux\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bikin.website\/blog\/"},{"@type":"ListItem","position":2,"name":"Perbedaan UI dan UX Beserta Cara Kerjanya"}]},{"@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\/96252fbfa62ac66731deb70ee96b6e18","name":"mega","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/4588150c2c926782fe4447e3ff17b5be1f58cd5093353bd2b94abbe24eef5c69?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/4588150c2c926782fe4447e3ff17b5be1f58cd5093353bd2b94abbe24eef5c69?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4588150c2c926782fe4447e3ff17b5be1f58cd5093353bd2b94abbe24eef5c69?s=96&d=mm&r=g","caption":"mega"},"description":"Seorang Content Writer yang menyukai musik, menonton film, traveling dan tentu saja menulis.","url":"https:\/\/bikin.website\/blog\/author\/mega\/"}]}},"_links":{"self":[{"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts\/1854","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\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/comments?post=1854"}],"version-history":[{"count":3,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts\/1854\/revisions"}],"predecessor-version":[{"id":3117,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/posts\/1854\/revisions\/3117"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/media\/3118"}],"wp:attachment":[{"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/media?parent=1854"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/categories?post=1854"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bikin.website\/blog\/wp-json\/wp\/v2\/tags?post=1854"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}