{"id":8726,"date":"2026-03-15T08:11:51","date_gmt":"2026-03-15T01:11:51","guid":{"rendered":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/"},"modified":"2026-03-17T15:02:20","modified_gmt":"2026-03-17T08:02:20","slug":"cara-membuat-augmented-reality-panduan","status":"publish","type":"post","link":"https:\/\/inrealitysolutions.com\/id\/cara-membuat-augmented-reality-panduan\/","title":{"rendered":"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &#038; Unity"},"content":{"rendered":"<article>\n<h1 id=\"cara-membuat-augmented-reality-panduan-praktis-untuk-webar-dan-unity\"><img fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter size-full wp-image-8764\" src=\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg\" alt=\"\" width=\"1080\" height=\"1080\" srcset=\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg 1080w, https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-300x300.jpg 300w, https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-1024x1024.jpg 1024w, https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-150x150.jpg 150w, https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-768x768.jpg 768w, https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-12x12.jpg 12w\" sizes=\"(max-width: 1080px) 100vw, 1080px\" \/>Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &amp; Unity<\/h1>\n<section aria-labelledby=\"ringkasan-cepat\">\n<h2 id=\"ringkasan-cepat\">Ringkasan Cepat<\/h2>\n<ul class=\"key-takeaways\">\n<li>Mulai cepat dengan WebAR (marker-based) untuk validasi konsep tanpa instalasi.<\/li>\n<li>Gunakan Unity + AR Foundation untuk fitur surface-placement dan performa native.<\/li>\n<li>Optimasi aset 3D (glTF\/FBX, LOD, texture atlas) sangat penting untuk performa mobile.<\/li>\n<li>WebAR memerlukan HTTPS; gunakan ngrok atau hosting seperti Netlify untuk testing.<\/li>\n<\/ul>\n<\/section>\n<nav class=\"toc\" aria-label=\"Daftar Isi\">\n<h2 id=\"daftar-isi\">Daftar Isi<\/h2>\n<ul>\n<li><a href=\"#cara-membuat-augmented-reality-panduan-singkat-untuk-webar-dan-unity\">Panduan Singkat untuk WebAR &amp; Unity<\/a><\/li>\n<li><a href=\"#gambaran-teknologi-ar-pilih-pendekatan-yang-tepat\">Gambaran Teknologi AR \u2014 Pilih Pendekatan yang Tepat<\/a><\/li>\n<li><a href=\"#cara-membuat-webar-tutorial-praktis-marker-based\">Cara Membuat WebAR \u2014 Tutorial Praktis (Marker-based)<\/a><\/li>\n<li><a href=\"#membuat-ar-di-unity-tutorial-praktis-surface-placement\">Membuat AR di Unity \u2014 Tutorial Praktis (Surface Placement)<\/a><\/li>\n<li><a href=\"#tutorial-augmented-reality-alur-proyek-lengkap-dari-ide-ke-deployment\">Tutorial Augmented Reality \u2014 Alur Proyek Lengkap<\/a><\/li>\n<li><a href=\"#aset-pipeline-3d-untuk-ar\">Aset &amp; Pipeline 3D untuk AR<\/a><\/li>\n<li><a href=\"#deployment-hosting\">Deployment &amp; Hosting<\/a><\/li>\n<li><a href=\"#debugging-best-practices-teknis\">Debugging &amp; Best Practices Teknis<\/a><\/li>\n<li><a href=\"#contoh-kode-repo-artefak-download\">Contoh Kode, Repo &amp; Artefak<\/a><\/li>\n<li><a href=\"#frequently-asked-questions-faq\">FAQ<\/a><\/li>\n<li><a href=\"#mengapa-inreality-solutions-cocok-untuk-proyek-ar-anda\">Mengapa InReality Solutions<\/a><\/li>\n<li><a href=\"#konsultasi-demo-solusi-ar\">Konsultasi &amp; Demo<\/a><\/li>\n<li><a href=\"#kesimpulan-next-steps\">Kesimpulan &amp; Next Steps<\/a><\/li>\n<\/ul>\n<\/nav>\n<section>\n<h2 id=\"cara-membuat-augmented-reality-panduan-singkat-untuk-webar-dan-unity\">Cara Membuat Augmented Reality: Panduan Singkat untuk WebAR &amp; Unity<\/h2>\n<p>Di sini Anda akan mendapatkan gambaran teknologi, langkah praktis untuk membuat WebAR sederhana, tutorial membuat AR di Unity, checklist proyek, serta sumber kode dan referensi resmi untuk implementasi lebih lanjut. Target akhir: 1) demo WebAR yang menampilkan model 3D lewat marker; 2) prototype Unity dengan fitur tap-to-place.<\/p>\n<\/section>\n<section>\n<h2 id=\"gambaran-teknologi-ar-pilih-pendekatan-yang-tepat\">Gambaran Teknologi AR \u2014 Pilih Pendekatan yang Tepat<\/h2>\n<h3 id=\"tipe-ar-marker-based-markerless-surface-tracking-location-based\">Tipe AR: marker-based, markerless (surface tracking), location-based<\/h3>\n<ul>\n<li><strong>Marker-based:<\/strong> cocok untuk demo cepat, katalog produk, dan materi pemasaran.<\/li>\n<li><strong>Markerless \/ surface tracking:<\/strong> ideal untuk try-on atau penempatan produk di lingkungan nyata.<\/li>\n<li><strong>Location-based:<\/strong> dipakai untuk wayfinding atau pengalaman lokasi spesifik.<\/li>\n<\/ul>\n<h3 id=\"platform-tooling-umum\">Platform &amp; Tooling Umum<\/h3>\n<p>WebAR open-source umum menggunakan <a href=\"https:\/\/ar-js-org.github.io\/AR.js-Docs\/\" target=\"_blank\" rel=\"noopener\">AR.js (dokumentasi)<\/a> bersama <a href=\"https:\/\/aframe.io\/docs\/\" target=\"_blank\" rel=\"noopener\">A-Frame (dokumentasi)<\/a>. Bandingkan pendekatan Web dengan tulisan umum: <a href=\"https:\/\/inrealitysolutions.com\/id\/a-frame-vs-three-js-comparison\/\" target=\"_blank\" rel=\"noopener\">A-Frame vs Three.js<\/a>.<\/p>\n<p>Platform komersial seperti <a href=\"https:\/\/www.8thwall.com\/docs\/\" target=\"_blank\" rel=\"noopener\">8th Wall (dokumentasi)<\/a> menawarkan kapabilitas lintas-browser dan fitur tambahan; referensi perbandingan tersedia: <a href=\"https:\/\/inrealitysolutions.com\/id\/8th-wall-vs-arkit\/\" target=\"_blank\" rel=\"noopener\">8th Wall vs ARKit<\/a>.<\/p>\n<p>Untuk pengalaman native\/app-based, gunakan <a href=\"https:\/\/docs.unity3d.com\/Packages\/com.unity.xr.arfoundation@latest\" target=\"_blank\" rel=\"noopener\">Unity AR Foundation<\/a> yang menggabungkan <a href=\"https:\/\/developers.google.com\/ar\" target=\"_blank\" rel=\"noopener\">ARCore<\/a> (Android) dan <a href=\"https:\/\/developer.apple.com\/augmented-reality\/\" target=\"_blank\" rel=\"noopener\">ARKit<\/a> (iOS). Perbandingan tooling Unity: <a href=\"https:\/\/inrealitysolutions.com\/id\/unity-mars-vs-vuforia-comparison\/\" target=\"_blank\" rel=\"noopener\">Unity MARS vs Vuforia<\/a>.<\/p>\n<p>Pilih antara kontrol penuh (open-source) vs kompatibilitas\/fitur tambahan (komersial).<\/p>\n<\/section>\n<section>\n<h2 id=\"cara-membuat-webar-tutorial-praktis-marker-based\">Cara Membuat WebAR \u2014 Tutorial Praktis (Marker-based)<\/h2>\n<h3 id=\"tools-opsi-a-frame-arjs-vs-8th-wall\">Tools &amp; opsi \u2014 A-Frame + AR.js vs 8th Wall<\/h3>\n<p>A-Frame + AR.js: cepat, murah, cocok untuk prototipe. Lihat <a href=\"https:\/\/ar-js-org.github.io\/AR.js-Docs\/\" target=\"_blank\" rel=\"noopener\">dokumentasi AR.js<\/a> dan <a href=\"https:\/\/aframe.io\/docs\/\" target=\"_blank\" rel=\"noopener\">A-Frame docs<\/a>. Bacaan tambahan: <a href=\"https:\/\/inrealitysolutions.com\/id\/webar-three-js-tutorial-devs\/\" target=\"_blank\" rel=\"noopener\">tutorial WebAR dan Three.js<\/a>.<\/p>\n<p>8th Wall: solusi komersial dengan dukungan iOS lebih baik dan fitur WebXR lanjut \u2014 lihat <a href=\"https:\/\/www.8thwall.com\/docs\/\" target=\"_blank\" rel=\"noopener\">dokumentasi 8th Wall<\/a> dan perbandingan: <a href=\"https:\/\/inrealitysolutions.com\/id\/8th-wall-vs-arkit\/\" target=\"_blank\" rel=\"noopener\">8th Wall vs ARKit<\/a>.<\/p>\n<h3 id=\"langkah-langkah-praktis-high-level\">Langkah-langkah praktis (high-level)<\/h3>\n<ol>\n<li>Setup proyek: buat folder proyek, sertakan CDN A-Frame &amp; AR.js.<\/li>\n<li>Struktur HTML: halaman <code>index.html<\/code> yang memuat scene A-Frame dan &lt;code&gt;&amp;lt;a-marker&amp;gt;&lt;\/code&gt; untuk marker-based AR.<\/li>\n<li>Tambah model 3D (glTF) dan atur positioning\/scale (format glTF direkomendasikan: <a href=\"https:\/\/www.khronos.org\/gltf\/\" target=\"_blank\" rel=\"noopener\">glTF spec<\/a>).<\/li>\n<li>Hosting &amp; testing: WebAR membutuhkan HTTPS \/ secure context \u2014 lihat panduan <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/MediaDevices\/getUserMedia#secure_context\" target=\"_blank\" rel=\"noopener\">MDN secure context<\/a>. Untuk testing lokal gunakan <a href=\"https:\/\/ngrok.com\/\" target=\"_blank\" rel=\"noopener\">ngrok<\/a> atau hosting statis seperti <a href=\"https:\/\/www.netlify.com\/\" target=\"_blank\" rel=\"noopener\">Netlify<\/a>. Referensi pemeliharaan: <a href=\"https:\/\/inrealitysolutions.com\/id\/webar-maintenance-panduan-teknis\/\" target=\"_blank\" rel=\"noopener\">WebAR maintenance<\/a>.<\/li>\n<\/ol>\n<p>Media yang disarankan: GIF demo marker trigger dan contoh snippet <code>index.html<\/code>. Optimasi model (size &amp; LOD) penting agar performance di browser baik.<\/p>\n<h3 id=\"optimasi-troubleshooting-webar\">Optimasi &amp; troubleshooting WebAR<\/h3>\n<ul>\n<li>Optimalkan ukuran model (glTF), gunakan texture atlas, lazy loading.<\/li>\n<li>Perhatikan quirks iOS Safari terkait WebXR \/ getUserMedia \u2014 lihat dokumentasi <a href=\"https:\/\/developer.apple.com\/documentation\/webkit\" target=\"_blank\" rel=\"noopener\">Apple WebKit<\/a>. Referensi: <a href=\"https:\/\/inrealitysolutions.com\/id\/webar-safety-panduan-teknis\/\" target=\"_blank\" rel=\"noopener\">WebAR iOS quirks<\/a>.<\/li>\n<li>Gunakan validator dan best practices glTF: <a href=\"https:\/\/github.com\/KhronosGroup\/glTF\" target=\"_blank\" rel=\"noopener\">Khronos glTF repo<\/a>.<\/li>\n<\/ul>\n<\/section>\n<section>\n<h2 id=\"membuat-ar-di-unity-tutorial-praktis-surface-placement\">Membuat AR di Unity \u2014 Tutorial Praktis (Surface Placement)<\/h2>\n<h3 id=\"tools-versi-yang-direkomendasikan\">Tools &amp; versi yang direkomendasikan<\/h3>\n<p>Gunakan Unity LTS dan paket <a href=\"https:\/\/docs.unity3d.com\/Packages\/com.unity.xr.arfoundation@latest\" target=\"_blank\" rel=\"noopener\">AR Foundation<\/a> plus plugin <a href=\"https:\/\/developers.google.com\/ar\" target=\"_blank\" rel=\"noopener\">ARCore<\/a> \/ <a href=\"https:\/\/developer.apple.com\/documentation\/arkit\" target=\"_blank\" rel=\"noopener\">ARKit<\/a>. Bacaan lanjutan: <a href=\"https:\/\/inrealitysolutions.com\/id\/arcore-android-panduan-lengkap\/\" target=\"_blank\" rel=\"noopener\">panduan ARCore<\/a>.<\/p>\n<h3 id=\"langkah-langkah-praktis-setup-scene-script-build\">Langkah-langkah praktis (setup \u2192 scene \u2192 script \u2192 build)<\/h3>\n<ul>\n<li>Setup project: import AR Foundation dan XR Plug-in Management.<\/li>\n<li>Scene: tambahkan <em>AR Session<\/em>, <em>AR Session Origin<\/em>, <em>AR Plane Manager<\/em>.<\/li>\n<li>Script C# (skeleton): raycast pada sentuhan \u2192 instantiate prefab sebagai tap-to-place.<\/li>\n<li>Build &amp; deploy ke device Android\/iOS untuk testing.<\/li>\n<\/ul>\n<p>Contoh pseudocode C# (skeleton):<\/p>\n<pre><code>\/\/ Pseudocode C# tap-to-place\nvoid Update() {\n  if (Input.touchCount &gt; 0) {\n    var touch = Input.GetTouch(0);\n    if (touch.phase == TouchPhase.Began) {\n      if (ARRaycastManager.Raycast(touch.position, hits, TrackableType.Planes)) {\n        var hitPose = hits[0].pose;\n        Instantiate(prefab, hitPose.position, hitPose.rotation);\n      }\n    }\n  }\n}<\/code><\/pre>\n<p>Perhatikan size aset dan praktik optimasi (LOD, mesh decimation, texture atlasing). Sertakan screenshot Unity Editor dan contoh scene untuk dokumentasi internal.<\/p>\n<\/section>\n<section>\n<h2 id=\"tutorial-augmented-reality-alur-proyek-lengkap-dari-ide-ke-deployment\">Tutorial Augmented Reality \u2014 Alur Proyek Lengkap (dari Ide ke Deployment)<\/h2>\n<h3 id=\"template-checklist-proyek\">Template checklist proyek (siapkan aset, device matrix, KPI)<\/h3>\n<ul>\n<li>Aset 3D teroptimasi (glTF\/FBX).<\/li>\n<li>Daftar device target dan matrix kompatibilitas.<\/li>\n<li>UX flow, fallback non-AR, dan events analytics.<\/li>\n<li>Rujukan tooling modelling: <a href=\"https:\/\/www.blender.org\/support\/tutorials\/\" target=\"_blank\" rel=\"noopener\">Blender tutorials<\/a> dan <a href=\"https:\/\/substance3d.adobe.com\/\" target=\"_blank\" rel=\"noopener\">Adobe Substance<\/a> untuk teksturing.<\/li>\n<\/ul>\n<h3 id=\"contoh-use-case-ar-product-try-on-untuk-e-commerce\">Contoh use case \u2014 AR product try-on untuk e-commerce<\/h3>\n<p>Alur singkat: photogrammetry \/ 3D model \u2192 optimasi \u2192 demo WebAR untuk validasi \u2192 versi Unity\/native untuk fitur try-on lebih kaya. Catatan: di pasar Indonesia, AR membantu mengurangi ketidakpastian pembeli online (observasi pasar). Contoh panduan teknis: <a href=\"https:\/\/inrealitysolutions.com\/id\/webar-eyewear-panduan-teknis\/\" target=\"_blank\" rel=\"noopener\">AR eyewear guide<\/a>.<\/p>\n<\/section>\n<section>\n<h2 id=\"aset-pipeline-3d-untuk-ar\">Aset &amp; Pipeline 3D untuk AR<\/h2>\n<ul>\n<li>Format: gunakan <a href=\"https:\/\/www.khronos.org\/gltf\/\" target=\"_blank\" rel=\"noopener\">glTF<\/a> untuk Web; FBX sering dipakai untuk pipeline Unity.<\/li>\n<li>Tooling: Blender, Substance; praktik: LOD, baking ringan, nama konsisten, atlas texturing.<\/li>\n<\/ul>\n<\/section>\n<section>\n<h2 id=\"deployment-hosting\">Deployment &amp; Hosting<\/h2>\n<ul>\n<li>WebAR: pastikan HTTPS, CDN untuk performa (mis. <a href=\"https:\/\/www.netlify.com\/\" target=\"_blank\" rel=\"noopener\">Netlify<\/a> atau <a href=\"https:\/\/pages.github.com\/\" target=\"_blank\" rel=\"noopener\">GitHub Pages<\/a>).<\/li>\n<li>App: distribusi via Play Store \/ App Store \/ TestFlight dan persiapkan privacy policy &amp; permissions.<\/li>\n<\/ul>\n<\/section>\n<section>\n<h2 id=\"debugging-best-practices-teknis\">Debugging &amp; Best Practices Teknis<\/h2>\n<ul>\n<li>Tangani tracking loss dengan UX fallback; cek permission kamera.<\/li>\n<li>Lakukan profiling untuk FPS, memori, dan load time.<\/li>\n<li>Uji lintas-device (Android &amp; iOS) terutama untuk WebAR.<\/li>\n<\/ul>\n<\/section>\n<section>\n<h2 id=\"contoh-kode-repo-artefak-download\">Contoh Kode, Repo &amp; Artefak Download<\/h2>\n<p>Sediakan repo GitHub publik dengan README build\/run, contoh <code>index.html<\/code> untuk WebAR, Unity sample scene. Contoh hosting repo internal sebelum publikasi: <a href=\"https:\/\/github.com\/\" target=\"_blank\" rel=\"noopener\">GitHub<\/a>.<\/p>\n<\/section>\n<section>\n<h2 id=\"frequently-asked-questions-faq\">Frequently Asked Questions (FAQ)<\/h2>\n<div class=\"faq\">\n<details>\n<summary>Berapa lama untuk membuat AR sederhana?<\/summary>\n<p>Waktu bergantung pada scope\u2014proof-of-concept WebAR bisa diselesaikan dalam hitungan hari hingga minggu, sedangkan aplikasi Unity dengan fitur penuh biasanya membutuhkan beberapa minggu sampai beberapa bulan tergantung kompleksitas aset dan fitur.<\/p>\n<\/details>\n<details>\n<summary>Perbedaan utama WebAR vs Unity?<\/summary>\n<p>WebAR cepat dipublikasikan tanpa instalasi, cocok untuk demo &amp; marketing; Unity memberi kontrol penuh, performa dan fitur advanced tetapi butuh instalasi atau packaging. Referensi tooling WebAR: <a href=\"https:\/\/aframe.io\/docs\/\" target=\"_blank\" rel=\"noopener\">A-Frame<\/a> dan <a href=\"https:\/\/ar-js-org.github.io\/AR.js-Docs\/\" target=\"_blank\" rel=\"noopener\">AR.js<\/a>.<\/p>\n<\/details>\n<details>\n<summary>Apakah WebAR support iOS Safari?<\/summary>\n<p>Dukungan bervariasi tergantung fitur WebXR dan versi WebKit pada iOS; cek dokumentasi resmi WebKit\/Apple untuk pembaruan terbaru: <a href=\"https:\/\/developer.apple.com\/documentation\/webkit\" target=\"_blank\" rel=\"noopener\">Apple WebKit docs<\/a>.<\/p>\n<\/details>\n<details>\n<summary>Apakah saya perlu photogrammetry untuk model 3D?<\/summary>\n<p>Tergantung kebutuhan: photogrammetry cocok untuk objek nyata dengan detail tinggi; untuk katalog produk biasanya model 3D manual\/retopologized sudah memadai dan lebih mudah dioptimasi untuk real-time.<\/p>\n<\/details>\n<details>\n<summary>Bagaimana cara optimasi performa AR di device mobile?<\/summary>\n<p>Optimasi mencakup compress texture, gunakan glTF dengan Draco compression jika perlu, LOD, mesh decimation, texture atlas, dan lazy loading aset. Profiling di device target sangat disarankan.<\/p>\n<\/details>\n<\/div>\n<\/section>\n<section>\n<h2 id=\"mengapa-inreality-solutions-cocok-untuk-proyek-ar-anda\">Mengapa InReality Solutions Cocok untuk Proyek AR Anda<\/h2>\n<ul>\n<li>Keahlian teknis WebAR &amp; App-based (ARCore\/ARKit) dan pipeline Unity\/AR Foundation.<\/li>\n<li>Pengalaman membuat aset 3D realistis dan animasi 3D berkualitas.<\/li>\n<li>Fokus UX interaksi yang intuitif dan integrasi data ke e-commerce \/ CMS \/ analytics.<\/li>\n<li>Kemampuan delivery end-to-end: konsep \u2192 produksi \u2192 deployment \u2192 maintenance.<\/li>\n<li>Rekam jejak project-based untuk sektor retail, properti, edukasi, dan manufaktur.<\/li>\n<\/ul>\n<p>Untuk portfolio &amp; layanan: <a href=\"\/id\/layanan\/ar-webar\/\">\/layanan\/ar-webar<\/a> dan <a href=\"\/id\/portfolio\/ar-try-on\/\">\/portfolio\/ar-try-on<\/a>.<\/p>\n<\/section>\n<section>\n<h2 id=\"konsultasi-demo-solusi-ar\">Konsultasi &amp; Demo Solusi AR<\/h2>\n<p>Tertarik mencoba POC WebAR atau workshop teknis? Ajukan demo atau konsultasi melalui <a href=\"\/id\/kontak\/\">\/kontak<\/a>. Kami dapat menyiapkan proof-of-concept cepat atau workshop teknis untuk tim Anda (opsi pilot singkat tersedia).<\/p>\n<\/section>\n<section>\n<h2 id=\"kesimpulan-next-steps\">Kesimpulan &amp; Next Steps<\/h2>\n<p>Cara membuat augmented reality dimulai dari memilih pendekatan: WebAR untuk validasi cepat, Unity untuk pengalaman lebih kaya. Mulai dengan aset 3D teroptimasi, buat prototype WebAR untuk stakeholder, lalu scale ke Unity bila diperlukan. Unduh sample code dari repo internal Anda, atau hubungi InReality Solutions untuk demo dan konsultasi.<\/p>\n<p>CTA (Lembut): Ingin demo WebAR atau diskusi teknis singkat? Hubungi kami di <a href=\"\/id\/kontak\/\">\/kontak<\/a> untuk jadwalkan demo. Manfaat: validasi konsep cepat, pengalaman interaktif yang meningkatkan engagement, dan dukungan end-to-end dari konsep hingga deployment.<\/p>\n<\/section>\n<\/article>","protected":false},"excerpt":{"rendered":"<p>Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &amp; Unity Ringkasan Cepat Mulai cepat dengan WebAR (marker-based) untuk validasi konsep tanpa instalasi. Gunakan Unity + AR Foundation untuk fitur surface-placement dan performa native. Optimasi aset 3D (glTF\/FBX, LOD, texture atlas) sangat penting untuk performa mobile. WebAR memerlukan HTTPS; gunakan ngrok atau hosting seperti Netlify [&hellip;]<\/p>","protected":false},"author":16,"featured_media":8764,"comment_status":"closed","ping_status":"open","sticky":false,"template":"elementor_canvas","format":"standard","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[22],"tags":[],"class_list":["post-8726","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-augmented-reality"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.5 (Yoast SEO v23.3) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Cara Membuat Augmented Reality: WebAR &amp; Unity Guide<\/title>\n<meta name=\"description\" content=\"Panduan cara membuat augmented reality dengan WebAR &amp; Unity. Pelajari tools, langkah praktis, optimasi 3D, dan deployment untuk AR mobile.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/inrealitysolutions.com\/id\/cara-membuat-augmented-reality-panduan\/\" \/>\n<meta property=\"og:locale\" content=\"id_ID\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &amp; Unity\" \/>\n<meta property=\"og:description\" content=\"Panduan cara membuat augmented reality dengan WebAR &amp; Unity. Pelajari tools, langkah praktis, optimasi 3D, dan deployment untuk AR mobile.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/inrealitysolutions.com\/id\/cara-membuat-augmented-reality-panduan\/\" \/>\n<meta property=\"og:site_name\" content=\"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/InRealitySolutions\/\" \/>\n<meta property=\"article:published_time\" content=\"2026-03-15T01:11:51+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-17T08:02:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1080\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Maya Ananta\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Ditulis oleh\" \/>\n\t<meta name=\"twitter:data1\" content=\"Maya Ananta\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimasi waktu membaca\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 menit\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/\"},\"author\":{\"name\":\"Maya Ananta\",\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#\/schema\/person\/8bf31cc88af0e2066d9d0f57dd52a80a\"},\"headline\":\"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &#038; Unity\",\"datePublished\":\"2026-03-15T01:11:51+00:00\",\"dateModified\":\"2026-03-17T08:02:20+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/\"},\"wordCount\":1151,\"publisher\":{\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#organization\"},\"image\":{\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg\",\"articleSection\":[\"Augmented Reality\"],\"inLanguage\":\"id\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/\",\"url\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/\",\"name\":\"Cara Membuat Augmented Reality: WebAR & Unity Guide\",\"isPartOf\":{\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg\",\"datePublished\":\"2026-03-15T01:11:51+00:00\",\"dateModified\":\"2026-03-17T08:02:20+00:00\",\"description\":\"Panduan cara membuat augmented reality dengan WebAR & Unity. Pelajari tools, langkah praktis, optimasi 3D, dan deployment untuk AR mobile.\",\"breadcrumb\":{\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#breadcrumb\"},\"inLanguage\":\"id\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage\",\"url\":\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg\",\"contentUrl\":\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg\",\"width\":1080,\"height\":1080},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/inrealitysolutions.com\/id\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &#038; Unity\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#website\",\"url\":\"https:\/\/inrealitysolutions.com\/id\/\",\"name\":\"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia\",\"description\":\"Transforming Businesses Through AR\/VR, Virtual Tours &amp; AI Innovation\",\"publisher\":{\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/inrealitysolutions.com\/id\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"id\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#organization\",\"name\":\"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia\",\"url\":\"https:\/\/inrealitysolutions.com\/id\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2021\/09\/Inreality-Solutions-logo.png\",\"contentUrl\":\"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2021\/09\/Inreality-Solutions-logo.png\",\"width\":1006,\"height\":319,\"caption\":\"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia\"},\"image\":{\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/InRealitySolutions\/\",\"https:\/\/www.linkedin.com\/company\/inreality-solutions\/\",\"https:\/\/www.instagram.com\/inreality_solutions\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#\/schema\/person\/8bf31cc88af0e2066d9d0f57dd52a80a\",\"name\":\"Maya Ananta\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\/\/inrealitysolutions.com\/id\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/48f96fb33f8c03241bdaccaf1a39bbc773261c3363a2dc04d2d46adccd9b6c70?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/48f96fb33f8c03241bdaccaf1a39bbc773261c3363a2dc04d2d46adccd9b6c70?s=96&d=mm&r=g\",\"caption\":\"Maya Ananta\"},\"url\":\"https:\/\/inrealitysolutions.com\/id\/author\/mayaananta\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Cara Membuat Augmented Reality: WebAR & Unity Guide","description":"Panduan cara membuat augmented reality dengan WebAR & Unity. Pelajari tools, langkah praktis, optimasi 3D, dan deployment untuk AR mobile.","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:\/\/inrealitysolutions.com\/id\/cara-membuat-augmented-reality-panduan\/","og_locale":"id_ID","og_type":"article","og_title":"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR & Unity","og_description":"Panduan cara membuat augmented reality dengan WebAR & Unity. Pelajari tools, langkah praktis, optimasi 3D, dan deployment untuk AR mobile.","og_url":"https:\/\/inrealitysolutions.com\/id\/cara-membuat-augmented-reality-panduan\/","og_site_name":"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia","article_publisher":"https:\/\/www.facebook.com\/InRealitySolutions\/","article_published_time":"2026-03-15T01:11:51+00:00","article_modified_time":"2026-03-17T08:02:20+00:00","og_image":[{"width":1080,"height":1080,"url":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg","type":"image\/jpeg"}],"author":"Maya Ananta","twitter_card":"summary_large_image","twitter_misc":{"Ditulis oleh":"Maya Ananta","Estimasi waktu membaca":"6 menit"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#article","isPartOf":{"@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/"},"author":{"name":"Maya Ananta","@id":"https:\/\/inrealitysolutions.com\/id\/#\/schema\/person\/8bf31cc88af0e2066d9d0f57dd52a80a"},"headline":"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &#038; Unity","datePublished":"2026-03-15T01:11:51+00:00","dateModified":"2026-03-17T08:02:20+00:00","mainEntityOfPage":{"@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/"},"wordCount":1151,"publisher":{"@id":"https:\/\/inrealitysolutions.com\/id\/#organization"},"image":{"@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage"},"thumbnailUrl":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg","articleSection":["Augmented Reality"],"inLanguage":"id"},{"@type":"WebPage","@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/","url":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/","name":"Cara Membuat Augmented Reality: WebAR & Unity Guide","isPartOf":{"@id":"https:\/\/inrealitysolutions.com\/id\/#website"},"primaryImageOfPage":{"@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage"},"image":{"@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage"},"thumbnailUrl":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg","datePublished":"2026-03-15T01:11:51+00:00","dateModified":"2026-03-17T08:02:20+00:00","description":"Panduan cara membuat augmented reality dengan WebAR & Unity. Pelajari tools, langkah praktis, optimasi 3D, dan deployment untuk AR mobile.","breadcrumb":{"@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#breadcrumb"},"inLanguage":"id","potentialAction":[{"@type":"ReadAction","target":["https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/"]}]},{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#primaryimage","url":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg","contentUrl":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg","width":1080,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/inrealitysolutions.com\/cara-membuat-augmented-reality-panduan\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/inrealitysolutions.com\/id\/"},{"@type":"ListItem","position":2,"name":"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &#038; Unity"}]},{"@type":"WebSite","@id":"https:\/\/inrealitysolutions.com\/id\/#website","url":"https:\/\/inrealitysolutions.com\/id\/","name":"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia","description":"Transforming Businesses Through AR\/VR, Virtual Tours &amp; AI Innovation","publisher":{"@id":"https:\/\/inrealitysolutions.com\/id\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/inrealitysolutions.com\/id\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"id"},{"@type":"Organization","@id":"https:\/\/inrealitysolutions.com\/id\/#organization","name":"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia","url":"https:\/\/inrealitysolutions.com\/id\/","logo":{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/inrealitysolutions.com\/id\/#\/schema\/logo\/image\/","url":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2021\/09\/Inreality-Solutions-logo.png","contentUrl":"https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2021\/09\/Inreality-Solutions-logo.png","width":1006,"height":319,"caption":"InReality Solutions \u2014 AR\/VR, Virtual Tours &amp; AI Automations Indonesia"},"image":{"@id":"https:\/\/inrealitysolutions.com\/id\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/InRealitySolutions\/","https:\/\/www.linkedin.com\/company\/inreality-solutions\/","https:\/\/www.instagram.com\/inreality_solutions\/"]},{"@type":"Person","@id":"https:\/\/inrealitysolutions.com\/id\/#\/schema\/person\/8bf31cc88af0e2066d9d0f57dd52a80a","name":"Maya Ananta","image":{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/inrealitysolutions.com\/id\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/48f96fb33f8c03241bdaccaf1a39bbc773261c3363a2dc04d2d46adccd9b6c70?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/48f96fb33f8c03241bdaccaf1a39bbc773261c3363a2dc04d2d46adccd9b6c70?s=96&d=mm&r=g","caption":"Maya Ananta"},"url":"https:\/\/inrealitysolutions.com\/id\/author\/mayaananta\/"}]}},"uagb_featured_image_src":{"full":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg",1080,1080,false],"thumbnail":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-150x150.jpg",150,150,true],"medium":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-300x300.jpg",300,300,true],"medium_large":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-768x768.jpg",768,768,true],"large":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-1024x1024.jpg",1024,1024,true],"1536x1536":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg",1080,1080,false],"2048x2048":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25.jpg",1080,1080,false],"trp-custom-language-flag":["https:\/\/inrealitysolutions.com\/wp-content\/uploads\/2026\/03\/Prod-25-12x12.jpg",12,12,true]},"uagb_author_info":{"display_name":"Maya Ananta","author_link":"https:\/\/inrealitysolutions.com\/id\/author\/mayaananta\/"},"uagb_comment_info":0,"uagb_excerpt":"Cara Membuat Augmented Reality \u2014 Panduan Praktis untuk WebAR &amp; Unity Ringkasan Cepat Mulai cepat dengan WebAR (marker-based) untuk validasi konsep tanpa instalasi. Gunakan Unity + AR Foundation untuk fitur surface-placement dan performa native. Optimasi aset 3D (glTF\/FBX, LOD, texture atlas) sangat penting untuk performa mobile. WebAR memerlukan HTTPS; gunakan ngrok atau hosting seperti Netlify&hellip;","_links":{"self":[{"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/posts\/8726","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/comments?post=8726"}],"version-history":[{"count":2,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/posts\/8726\/revisions"}],"predecessor-version":[{"id":8765,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/posts\/8726\/revisions\/8765"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/media\/8764"}],"wp:attachment":[{"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/media?parent=8726"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/categories?post=8726"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inrealitysolutions.com\/id\/wp-json\/wp\/v2\/tags?post=8726"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}