“Buku ini ngasih saya istilah2 baru: 'Design Archaeology', 'Groundtruth Check', 'Agentic Design Loop', 'AI Slop Checklist'. Vocabulary itu yang akan saya pinjam terus buat ngejelasin workflow ke client baru. Makasih byk!”
Buku Agentic UI Design Workflow
Buku tutorial bahasa Indonesia pertama yg nge-cover topik penerapan AI dalam UIUX Design secara holistik.
Panduan buat solo player dan team untuk mengubah design dari POC ke production code tanpa ngorbanin kualitas.
Apa kata pembaca
-
“Gila sih, banyak banget yang aku belum tahu, ternyata AI dalam ngedesain UI emang udah secanggih itu. Padahal aku juga tiap hari pakai AI untuk bekerja…”
“Panduan step by step-nya singkat, jelas, dan to-the-point, tidak ada yang bertele-tele. Walkthrough paling nyaman yang pernah saya coba.”
-
“…Ini jujur aku baru paham selama ini kenapa design yang aku buat tidak pernah konsisten hasilnya, padahal sudah membuat design system. Setelah aku coba tutorial ini, design yang aku buat selalu konsisten.”
“Real use case langsung dari para master HaloDesigner. Amazing. Enak dibaca dan mendorong untuk practise. Dikasih tips-tips untuk tweak design.”
-
“Jujur semua bab berguna, even buat saya yang udah pake workflow ini sebelumnya. Banyak AHA moment yang saya temuin pas baca.”
“Teknik prompting yang sederhana tapi mampu menghasilkan design yang sesuai, atau setidaknya mendekati ekspektasi.”
APAKAH KAMU MERASA
-
Overwhelmed sama tools AI baru yang darderdor tiap minggu, ga tau mana yang worth dipelajarin?
-
Khawatir bakal digantikan karena sekarang non-designer pun udah bisa bikin UI?
-
Dituntut atasan untuk masukin AI ke workflow, tapi ga ada arahan dan ga ada budget training?
-
Solo designer yang ga ada temen diskusi, kerjaan segudang dan butuh bantuan design agent tapi ga pernah berhasil?
-
Bingung mulai dari mana, udah baca puluhan thread Twitter tentang agentic AI, tapi pas mau praktek malah token abis duluan?
-
Muak sama output AI yang ga konsisten, ga sesuai brand, dan kelihatan "AI slop" bgt?
I feel u. Saya pun ngerasain hal yang sama dan kita ga sendiri. Dari 500+ designer yang daftar dan nyobain buku ini, semua punya keresahan yang sama.
Tiap hari ada tools baru.
Figma Make hari ini, Claude Design besok, entah apa lusa. Tapi perubahan tool itu baru di permukaan aja, yang sebenernya lagi berubah adalah cara kita mendesain di era agentic AI.
Buku ini ngajak kamu pindah ke cara pikir baru, men-challenge convention dan framework lama, memaksa kamu berpikir buat diri kamu sendiri. Biar ga panik lagi tiap ada tools baru, biar ga ngerasa ketinggalan saat industri lagi mencari bentuk barunya.
Buku ini dirancang untuk mendampingi kamu berproses melalui 4 tahapan. Kita mulai dari membangun mindset, lalu belajar menerjemahkan PRD menjadi design brief. Setelah itu, kamu akan masuk ke sesi praktik yang seru: mengeksplorasi desain menggunakan AI baik dari blank canvas maupun mengembangkan varian dari Design System yang sudah ada.
Perjalanan ini ditutup dengan tahap delivery, di mana kamu akan belajar cara mengkonversi Desain Figma ke POC (proof of concept), handoff ke tim developer, hingga Scaling Agentic Design Workflow ke Production Pipeline secara utuh. Setiap tahap yang kamu lewati didesain agar pemahaman dan skill kamu semakin advance.
Buku ini berisikan 40% pondasi pola pikir, 40% workflow kerja, dan 20% real production case study. Semuanya disertai latihan praktek di tiap modul. Ga cuman dapet teori kamu juga bakal ngelakuin banyak practical hands-on.
Saya meracik workflow ini selama 13 bulan terakhir, ngumpulin pelajaran dari 500+ designers dan menyajikannya dengan jujur. Tidak semua eksperimen saya masukin ke buku ini, hanya workflow yang bener2 saya pake sehari-hari, sehingga waktumu ga terbuang ngetes hal yang sudah saya buktiin ga berhasil.
TABLE OF CONTENT
Introduction
- A typical day in the life as a Startup Designer
- Di luar sana, semua sedang “memasak”
Mindset Foundations in the AI Era
- MODUL 1: Mindset shift — dari Creator ke Conductor
- MODUL 2: Design process baru, beyond Double Diamond
- MODUL 3: design.md — bahasa baru antara designer dan AI
Framing & Benchmarking
- MODUL 4: Problem framing & benchmark research
- MODUL 5: Translate PRD jadi Design Brief
Use Case 1 — Zero to UI
- MODUL 6: Fitur Claude ada banyak, which for what
- MODUL 7: Agentic design dari blank canvas
Use Case 2 — Design Iteration at Scale
- MODUL 8: Eksplorasi varian dari UI dan DS yang sudah ada
- MODUL 9: Claude sebagai Design Critic
Use Case 3 — Convert Figma to Production Code
- MODUL 10: Empat tingkatan cara convert
- MODUL 11: Convert Figma dengan single prompt
- MODUL 12: Convert Figma dengan Skills
- MODUL 13: Convert Figma dengan Multiple Agents
- MODUL 14: Scale up jadi production pipeline
Handoff & Scaling
- MODUL 15: Handoff hasil vibe coding ke developer
- MODUL 16: Membangun Design System dengan AI
- MODUL 17: GitHub sync untuk designer
- MODUL 18: Deploy ke Cloudflare, live website
- MODUL 19: Supabase sebagai database
Cheat Sheet
- MODUL 20: Semua prompt, template, checklist dalam 1 halaman
SNIPPETS
Finance UI Variants
Multi-theme UI menggunakan AI-assisted design, dimana AI membantu designer menentukan direction dan eksekusi visual. Kita belajar membaca komposisi UI yang sudah ada, menuangkannya ke design.md, dan mengembangkannya menjadi beberapa variant visual untuk rapid explorations.
Cek hasilnya disini
Bahasa baru antara Designer x AI
Buat desainmu dimengerti tidak hanya oleh designers dan engineers, tapi juga oleh AI. Kita belajar membuat design.md dari NOL atau convert dari Figma variables dan design token yg sudah ada.
20 Modul, 30% Teori, 70% Praktek.
Buku ini dilengkapi dengan berbagai contoh kasus, kerangka berpikir, dan penjabaran design process. Pada bagian akhir setiap studi kasus, ada tugas yang dirancang khusus untuk memperkuat pemahamanmu.
Production code
Figma files
Convert Figma → Production Code
Kita belajar 3 cara bertingkat mengubah design Figma menjadi production code. Dari mulai menggunakan single prompt, skills hingga multiple agents setup untuk akurasi desain >90%.
UNTUK SIAPA BUKU DIGITAL INI?
Junior Designer
- Yang takut digantiin AI dan butuh skill baru biar tetep relevant
- Yang mau naikin kesempatan di-hire di global market
- Yang baru masuk kerja dan butuh shortcut tanpa kompromi craft
Mid-level designer
- Yang dituntut atasan untuk masukin AI tapi ga ada arahan
- Yang capek liat output AI inconsistent dan ga sesuai brand
- Yang mau upgrade dari "AI buat brainstorming" ke "AI sebagai design partner"
- Yang mau handoff nya bisa langsung dipake dev, ga jadi reference doang
Senior, Lead & Principle designer
- Yang lagi ngerancang AI adoption strategy buat tim dan org
- Yang butuh vocabulary buat ngajarin tim & stakeholders soal agentic workflow
- Yang udah jalanin agentic workflow tapi belum punya framework yang rapih
- Yang mau own complete workflow dari Figma sampai production code
- Yang mau ngebangun dan maintain Design System pakai AI
Solo designer / Freelancer
- Yang kerja sendirian dan AI jadi "tim" satu-satunya
- Yang harus deliver end-to-end dari research sampai handoff
- Yang butuh efisiensi tanpa kompromi kualitas
- Yang mau bisa scale tanpa nambah headcount
Design Manager / Head of Design
- Yang lagi ngebangun design culture di era AI
- Yang butuh framework buat onboard tim ke agentic workflow
- Yang mau nentuin KPI yang sesuai dengan cara kerja baru
- Yang butuh material training internal yang udah teruji
Frontend Developer
- Yang pengen ngubah desain Figma jadi kode produksi tanpa nunggu handoff
- Yang capek nebak-nebak maksud desainer dari file Figma
- Yang mau improve UI tanpa harus jadi designer beneran
- Yang mau prompt AI biar komponennya konsisten sama Design System
Full-stack Developer
- Yang sering jadi jembatan antara desain dan backend
- Yang capek vibe code-nya keliatan AI slop banget
- Yang mau scaffold UI cepet biar fokus ke logika produk
- Yang butuh workflow AI yang predictable, bukan sekali jadi sekali ngaco
Engineering Lead
- Yang lagi nyusun standar design-to-code buat tim
- Yang butuh design literacy buat ngomong sama designer
- Yang mau ngurangin bolak-balik revisi sama tim desain
- Yang butuh framework biar output AI tetep maintainable
Indie Hacker / Solo Founder
- Yang bangun produk sendirian dari nol sampai launch
- Yang mau tau complete workflow dari Figma sampai production code
- Yang ga punya budget buat hire desainer & developer terpisah
- Yang mau bangun full production pipeline dengan AI
- Yang mau validasi ide cepet tanpa ngorbanin tampilan
No-code / Low-code Builder
- Yang udah nyaman sama tools no-code tapi mentok di kustomisasi
- Yang mau ngebuat dan maintain Design System sendiri pakai AI
- Yang mau lompat ke kode pas produknya mulai serius
- Yang butuh AI buat jembatanin desain ke implementasi
Startup Founder (non-technical)
- Yang pengen prototipe yang bisa dipresentasiin ke investor
- Yang mau tau cara handoff hasil vibe coding ke developer dengan rapih
- Yang mau ngerti alur desain-ke-produk biar bisa mimpin tim
- Yang butuh shortcut dari ide ke MVP yang keliatan beneran
MEREKA YANG SUDAH MEMULAI...
“Overall, it's great! Foundation is strong, dan setiap module sudah serve it's purposed untuk menampilkan cara-cara integrating AI dalam workflow. Modul 1 dan 2 benar-benar impactful dalam mengubah persepsi orang.”
“So helpful!! Ada cukup banyak insight menarik yang belum aku dapatkan dari tutorial lain. Paling menarik adalah introducing design.md dan capture page jadi artboard pakai extension.
Token usage juga itungannya jadi lebih efisien. Thank you HD team udah provide tutorial yang helpful ditengah-tengah krisis yang dirasakan kebanyakan designer ini.”
“Real use case langsung dari para master HaloDesigner. Amazing. Enak dibaca dan mendorong untuk practise. Dikasih tips-tips untuk tweak design”
“Panduan step by step-nya singkat, jelas, dan to-the-point, tidak ada yang bertele-tele. Walkthrough paling nyaman yang pernah saya coba.”
“Di Modul 1 yang ngebahas 'new double diamond' itu bagus sih menurutku. Sangat menggambarkan the actual workflow sejak AI mulai merajalela di design platform.”
“Aku suka bagian 'Perintahkan Claude untuk selalu update design.md'. Ini jujur aku baru paham selama ini kenapa design yang aku buat tidak pernah konsisten hasilnya, padahal sudah membuat design system. Setelah aku coba, design yang aku buat selalu konsisten.
Lalu aku coba memakai metode ini dengan Codex, ternyata sangat membantu, hasil designnya konsisten. Jujurly engga ada yg membingungkn di dalam buku kak. Aku paham apa yang dijelasin.”
“Kesan pertama kali saat baca buku ini adalah, amazing. Dari dulu saya suka bahasa yang mas Wasil pake di buku2nya, ringan, mengalir, nggak bikin overwhelm ketika baca isinya walaupun lagi ngebahas tentang teknis.
Pemula bisa ikuti seperti lagi dituntun pelan2. Kalo yang udah pro, bisa tinggal lihat bagian mana yang dia mau langsung lompat kedalamnya. Good job!”
“Jujur semua bab berguna, even buat saya yang udah pake workflow ini sebelumnya. Banyak aha moment yang saya temuin pas baca.”
“Gila sih, banyak banget yang aku belum tahu, ternyata AI emang udah secanggih itu. Padahal aku juga tiap hari pakai AI untuk bekerja, mostly buat brainstorming aja, tapi ternyata AI bisa lebih powerful, emang kita harus bisa leverage tools ini.”
“Module 3 beneran ngebuat workflow kerjaan ku di kantor lebih terarah dan ngehasilin hasil yang lebih ngena sesuai sama brand. Sebelumnya manual bikin DS, akhirnya kepake buat tuning design.md. Ngebantu banget decluter update AI yang dar der dor hampir tiap hari.”
“Tutorialnya seru! jadi bisa bikin design UI tapi sambil rebahan nunggu hasil terus sambil ngasih feedback. Beuh gokil, jadi berasa jadi CDO wkwkwkw”
“Gua tipikal yang gak suka baca JUJUR, tapi ketika di-trigger hal relate kayak 'a typical day in the life as a Startup Designer', itu kayak AH harus baca deh.
Untuk shifting dari mindset yang metodologies banget jadi strategies, asik sih, aku enjoy banget. Suka sama frameworknya ADL — setidaknya nambah memory baru di otak kalo mulai sekarang cara berpikirnya yang running in the background harus ADL.
Dan izinnn, tadi aku jadi pembicara di Juara Vibe Coding by Google, terinspirasi dari tulisannya kalian ini dan lancar banget untuk jelasin Agentic AI ini. Thankyou banget sangat membantu, gak sabar dapet full packagenya nih buku”
“So far sampai modul 4 cukup membantu, terutama modul 4. As Fullstack Developer solo, ini ngebantu banget. Gausah mikirin frontend sampe yg pusing2 banget kek dulu.”
“Thank you HD team udah provide tutorial yang helpful ditengah-tengah krisis yang dirasakan kebanyakan designer ini! 🔥”
“Tone-nya jujur dan dewasa. Banyak konten 'AI for designers' yang beredar 2025-2026 itu hype-coded ('AI is amazing, here's 10 tools!').
Buku ini ambil sudut yang lebih realistis: AI bisa generate cepet, tapi judgment itu emang mahal, dan design fundamental (kayak typography, spacing, hierarchy) jadi makin penting, bukan makin tidak relevan.”
“Modul ke-2 daging banget insightnya bagiku, apalagi bagian Refinement sama Anti Slop. Ini penting bgt karena beberapa hasil wireframe ku masih slop dan kayak prompt setengah niat, padahal sudah clear aku deskripsiin mau bikin apa.
Dengan menyadari bahwa kalo ngedesain pake AI ini ga bisa satu kali enter langsung jadi, aku jadi paham flow yg harus aku lalui buat dapet hasil referensi yg aku pengen.”
“Insightful dan refreshing banget. Pembahasannya nggak cuma fokus ke 'cara pakai AI', tapi lebih ke bagaimana workflow design itu sendiri berubah ketika AI mulai jadi collaborator, bukan sekadar tools tambahan.”
“Modul 0 & 1 bener-bener mengubah mindsetku. Selama ini terbiasa jadi creator all-rounder sampai sering overwhelm. Setelah baca modul Mindset Shift: From Creator to Conductor, jadi sadar kalau peran kita bukan harus ngerjain semuanya sendiri, tapi lebih ke mengarahkan dan memanfaatkan AI dengan lebih strategis.”
“Sebagai researcher, buku ini sangat membantu untuk proses pembuatan design secara cepat, untuk kebutuhan concept testing dan lainnya. Bisa dijadikan cara untuk mempercepat proses development.”
“As a designer & ex-FE developer, modul pengenalan awal tentu sudah sangat familiar. Jadi yang sangat ngebantu buat aku justru semua contoh prompting meskipun dalam praktiknya tentu kita menyesuaikan hasil generate AI masing-masing.
Semua tertulis runtut, beberapa sudah aku praktikkan, namun di sini jadi dapet insight baru mana yang selama ini aku miss atau bisa aku tingkatin lagi. Good job!”
“Paling membantu karena ada use case-nya — jadi kebayang dari semua modul di introduction itu bisa di-apply kayak gimana. Modul 1 bikin nemuin 'why'-nya kenapa harus pake AI dalam design process.”
“Sangat berkesan — ga banyak yang bikin kayak gini. Buat yang pertama kali terjun ke dunia ini, sangat cocok dan terarah, bagus banget buat base pemahaman tentang perkembangan sekarang. Nice works team HD!”
“Analogi konduktor orkestra dan gimana double diamond mulai ga cocok — bener-bener impactful untuk meluruskan mindset yang selama ini anxiety atas AI, jadi terdorong memandang lebih positif. Contoh-contoh promptnya so far works semua.”
“Teknik prompting yang sederhana tapi mampu menghasilkan design yang sesuai, atau setidaknya mendekati ekspektasi. Bagian design.md-nya ngebantu banget.”
“Use case 1 & 2 udah ngasih clear view tentang cara mendesain dengan AI. Thinking-nya cukup direct dan gampang diikuti.”
“Baru tau soal design.md dan itu ngebantu banget buat penerapan di next project.”
“Modul 4 soal eksplorasi varian dari UI yang udah ada — menarik dan dapet insight baru.”
“Suka ada case study-nya, jadi lebih kebayang. Satu modul juga ga terlalu panjang — bagus buat attention span kita yang brainrot hehe.”
“Modul 3 ngasih arahan yang jelas gimana kita combine workflow kita. Integrasi Claude dan Paper-nya kepake banget.”
“Paling membantu: harus nambahin screenshot di setiap perintah ke AI. Setelah dicoba ternyata bener — hasilnya lebih akurat sesuai yang kita mau.”
“Snapshot extension Paper sangat ngebantu — mirip html.to.design tapi tanpa limit. Bikin design.md dari beberapa snapshot, hasilnya lebih bagus dari generator lain yang pernah aku coba.”
“Modul 1 kuat banget buat jadi fondasi cara berpikir designer ke depan. Modul 2 (design.md) ngajarin cara ‘ngomong’ ke AI yang lebih structured, bukan sekadar prompting random.”
“Modul 3 benar-benar langsung hands-on. Biasanya bagian ini yang jadi hambatan pas mau mulai eksplor Agentic UI — di sini step by step-nya simple dan to-the-point.”
BELI SEKALI, AKSES SELAMANYA
“Dibanding course-course Claude yang beredar, ini jauh lebih practical dan akurat. Literally satu-satunya tutor yang lo butuhin di era banjirnya konten AI slop.”
BASIC
AI as Design Partner
Cocok buat yang mau mulai dari NOL dengan agentic workflow yang udah teruji.
Rp499K
Rp1,199,000
Rp499KSpecial pre-order
Rp699KPromo launch day
Rp999,000Normal price
PRE-ORDER SOLD OUTOrder akan dibuka lagi saat LAUNCH DAY: Rabu, 1 July 2026 @ 12PM WIB.
Kode promo
- [✓]Mindset shift, dari Creator ke Conductor
- [✓]The new design process, beyond Double Diamond
- [✓]Design.md, bahasa baru antara designer dan AI
- [✓]Problem Framing dan Benchmark Research
- [✓]Translate PRD ke Design Brief
USE CASE 1 - ZERO TO UI
- [✓]Fitur Claude ada banyak, which for what?
- [✓]Claude x Paper
USE CASE 2 - DESIGN ITERATION AT SCALE
- [✓]Eksplorasi varian dari UI dan Design System yang sudah ada
Akses buku selamanya, untuk 1 email.
Sisa 9 license
PRO
Production-Ready Figma to Code
Cocok buat yang ingin convert Figma ke Production Code secara regular, konsisten dan akurat menggunakan Multi-agents.
Rp799K
Rp1,499,000
Rp799KSpecial pre-order
Rp999KPromo launch day
Rp1,299,000Normal price
PRE-ORDER SOLD OUTOrder akan dibuka lagi saat LAUNCH DAY: Rabu, 1 July 2026 @ 12PM WIB.
Kode promo
- [✓]
Semua isi Basic +
AI sebagai Design Crits, 4 tingkatan convert Figma ke production code (single prompt, Skills, multiple agents, scale up jadi pipeline).
Use Case 3 - Convert Figma jadi Production Code
- [✓]Claude sebagai Design Critic
- [✓]Intro perbandingan 4 tingkatan cara
- [✓]Convert Figma dengan single prompt
- [✓]Convert Figma dengan Skills
- [✓]Convert Figma dengan Multiple Agents
- [✓]Scale up untuk production pipeline
Akses buku selamanya, untuk 1 email.
Sisa 9 license
ULTIMATE
Handoff & Scaling Agentic Workflow with Your Design System
Cocok buat builder, studio dan product team yang mau ownership penuh: bangun, deploy, dan siap scale produk sendiri dengan AI.
Rp999K
Rp2,499,000
Rp999KSpecial pre-order
Rp1,199KPromo launch day
Rp1,999,000Normal price
PRE-ORDER SOLD OUTOrder akan dibuka lagi saat LAUNCH DAY: Rabu, 1 July 2026 @ 12PM WIB.
Kode promo
- [✓]
Semua isi Pro +
Handoff ke developer, build Design System dari NOL sinkron ke GitHub, deploy menjadi live web, setup Supabase sebagai database.
HANDOFF DAN SCALING
- [✓]Handoff hasil vibe coding ke developer
- [✓]Membangun Design System dengan AI
- [✓]GitHub sync untuk designer
- [✓]Deploy ke Cloudflare, live website
- [✓]Supabase sebagai database
bonus
- [✓]Cheat Sheet — semua prompt, template, checklist dalam 1 halaman
Akses buku selamanya, untuk 1 email.
Sisa 9 license
—
Launch dibuka saat timer habis
Punya kode promo? cek cara pakainyaSaat checkout di Mayar, klik bagian “Punya kode diskon?” lalu masukan kodenya.
YANG SERING DITANYAKAN
Aku pemula, belum pernah pake AI buat design serius, masih bisa ngikutin?
Bisa. Modul 1–2 dimulai dari mindset shift dulu, bukan langsung teknis. Yang penting kamu udah punya basic design fundamental (typography, spacing, hierarchy). Justru buku ini cocok buat kamu yang ngerasa “telat” mulai.
“Untuk pemula dan awal pertama kali terjun ke dunia ini, sangat cocok dan terarah — bagus banget buat base pemahaman tentang perkembangan sekarang. Nice works team HD!”
“Overall buat pemula enak banget, terutama buat orang yang kerjaannya belum terekspos sebagian/sepenuhnya pake AI.”
Format tutorialnya kayak gimana?
Komposisinya kira-kira 30% materi, 70% praktek, untuk ngimbangin hard skills dan knowledge.
Banyak hands-on. Tiap modul ada tugas yang harus kamu kerjain dulu biar pemahamannya bener-bener nempel, sebelum lanjut ke modul berikutnya. Jadi kamu ngerasain sendiri, bukan cuma tau teorinya.
Caranya gampang diikutin: kamu bakal ngeliat langsung gimana aku ngerjain sesuatu dari sisi aku, terus kamu praktekin sendiri ngikutin step-by-step yang udah disediain. Ada contoh nyata dulu, baru kamu jalanin di tools-nya.
“Panduan step by step-nya singkat, jelas, dan to-the-point, tidak ada yang bertele-tele. Walkthrough paling nyaman yang pernah saya coba.”
“Real use case langsung dari para master HaloDesigner. Amazing. Enak dibaca dan mendorong untuk practise. Dikasih tips-tips untuk tweak design.”
Aku newbie, enaknya ambil paket yang mana?
Mulai dari Basic dulu. Modul 1–8 udah cukup buat kamu ngerasain workflow agentic-nya, dari mindset shift sampe bisa generate POC sendiri. Tapi kalau kamu udah kerja di tim atau pengen punya workflow lengkap sampai production-ready (handoff ke developer, design system, deploy), Pro atau Ultimate justru pilihan paling worth it — kamu langsung dapet gambaran utuh end-to-end tanpa perlu upgrade dua kali. Dan karena sekali beli akses-nya seumur hidup, ambil paket atas dari awal sering malah jadi yang paling hemat.
Bedanya paket Basic, Pro, sama Ultimate apa?
- Basic (Modul 1–8): mindset shift + POC generation. Cocok buat yang pengen rasain workflow-nya dulu.
- Pro (Modul 1–15 + 17): production-ready Figma-to-code + developer handoff + Design Critic. Cocok buat designer di tim maupun solo/freelance yang mau implementasi code-nya >95% akurat — sama persis kayak yang kamu design di Figma. Bagus buat naikin value & harga jual service kamu.
- Ultimate (semua modul): semua isi Pro + bikin Design System sendiri, GitHub sync, deploy jadi web live (Cloudflare) & database (Supabase). Cocok buat yang mau nge-transform tim jadi workflow AI-embedded top tier, lengkap dengan production pipeline yang siap scaling pakai multi-agents.
Aku bukan designer (tapi developer / founder / PM), worth it ga?
Worth it. Buku ini ngajarin kamu cara translate ide ke UI yang beneran jalan, tanpa harus jago Figma. Banyak founder & developer di waitlist yang pengen bisa bikin POC sendiri tanpa nunggu designer.
Apakah perlu subscribe Claude berbayar buat ngikutin buku ini?
Ga wajib, tapi sangat disarankan. Buat eksplorasi awal, free tier Claude masih cukup. Tapi kalo kamu mau serius pake workflow ini buat kerjaan harian, minimal Claude Pro (sekitar Rp300rb-an/bulan). Buat tim yang udah siap fully onboard agentic workflow, Claude Max worth banget karena limit-nya jauh lebih leluasa dan ga kena throttle pas lagi ngebut. Detail tier-nya aku bahas di Modul Cheat Sheet.
Bedanya sama tutorial “AI for designers” lain di YouTube apa?
Buku ini bukan showcase “AI is amazing, ini 10 tools keren”. Fokusnya ke proses kerja yang reproducible, dari brief sampe handoff ke developer. Ada framework namanya Agentic Design Loop (ADL) yang bisa kamu pake terus, bukan trick sekali pake.
“Tone-nya jujur dan dewasa. Banyak konten ‘AI for designers’ yang beredar 2025-2026 itu hype-coded. Buku ini ambil sudut yang lebih realistis: AI bisa generate cepet, tapi judgment itu mahal.”
Aku pake Mac/Windows lama, specnya pas-pasan. Aman?
Aman. Semua tools yang dipake jalan di mesin standar. Buat Intel Mac aku kasih workaround khusus di beberapa modul (misal pake html.to.design plugin sebagai pengganti Paper Design native app).
Berapa lama aku bisa selesain semua modul?
Tergantung paket dan ritme kamu. Basic realistis 1–2 minggu kalo nyambil kerja. Pro sekitar 3–4 minggu. Ultimate butuh lebih panjang karena ada eksekusi handoff & design system. Tapi tiap modul self-contained, ga harus selesai berurutan.
Hasil design-nya beneran bisa dipake ke production, atau cuma POC doang?
Bisa production. Di paket Pro & Ultimate ada modul khusus buat handoff ke developer + design system. Beberapa beta tester udah pake workflow ini buat project klien beneran.
“Aku suka bagian ketika perintahkan Claude untuk selalu update design.md. Ini jujur aku baru paham selama ini kenapa design yang aku buat tidak pernah konsisten padahal sudah membuat design system. Setelah aku coba, design yang aku buat selalu konsisten.”
Kalo aku ga cocok, bisa refund ga?
Sayangnya buat saat ini belum ada opsi refund. Karena format-nya digital book via Notion, sekali akses dibuka ga bisa ditarik balik. Makanya aku saranin pelajarin dulu paket breakdown-nya dengan teliti.
Apakah website ini juga dibuat pake AI?
Yeap. Landing page ini dibuat pakai workflow yang aku sendiri ajarin — tepatnya dari Figma ke Production Code di Use Case 3. AI yang eksekusi implementasi, hosting, dan deploy ke server, jadi designer bisa fokus di crafting content dan interaction.
TENTANG PENULIS
Halo, nama saya Wasil.
Saya product designer yang bekerja dan tinggal di Singapore. Saya lulus kuliah Master sebagai Engineer ITB dengan predikat cum-laude kemudian bekerja di perusahaan multi-national berpusat di California, sampai pada saatnya saya memutuskan untuk berhenti dan memulai karir sebagai UI UX Designer.
Allhamdulillah sekarang sudah berjalan 14 tahun dan merupakan perjalanan yang mengasyikan dan sangat menguntungkan (mentally and financially rewarding).
Saat ini saya memimpin tim desain di perusahaan travel no.1 di Middle East. Disana saya membangun dan menginisiasi agentic workflow dalam pembangunan digital produk, dengan tetap mengedepankan manusia sebagai pengambil keputusan dan feedback loop utama. Selain itu juga membangun design culture yang sehat antara designers, engineers, PM dan “AI agents”.
Sebelumnya saya pernah bekerja di beberapa startup, agency dan corporate nasional/international di kota2 besar lainnya, seperti Bandung, Jakarta, Redlands CA, dan Austin TX. Saya merasa beruntung bisa punya pengalaman untuk kerja dan belajar langsung dengan tim yang jago2, pinter2, dari berbagai latar belakang dan negara yang berbeda2.
Selain bekerja, saya pun senang berbagi ilmu dan pengalaman dengan rekan seprofesi melalui akun Halo Designers. Semoga dengan membaca buku tutorial ini temen2 bisa mengikuti jejak saya dalam membangun agentic workflow yg sehat sebagai tim maupun solo designer.
Sapa saya di Twitter, Instagram atau LinkedIn.
Beberapa buku Best-Seller yg pernah saya buat:
| Petunjuk Memulai UX dari NOL | ★ 4.8 (9,101+ books sold) |
| HaloFigma, Tutorial Interaktif Design System | ★ 4.7 (10,001+ downloads) |
| Tutorial Interaktif Dashboard UI | ★ 4.6 (5,001+ downloads) |
| Cara Bikin Creative Assets Konsisten Pake AI | ★ 4.8 (301+ books sold) |