Skip to content
Cara Bikin Website Sendiri Pakai Lovable
ToolsPanduanLovableAI ToolsWebsiteNo-Code

Cara Bikin Website Sendiri Pakai Lovable

Catatan gue waktu ngajarin istri gue bikin website — dari nol sampai jadi, tanpa coding.

Kenapa Gue Nulis Ini

Cerita ini dimulai dari kejadian sederhana: istri gue minta tolong dibuatkan website buat usahanya. Gue nggak langsung bantuin. Gue malah tunjukin ke dia cara bikin sendiri — pakai Lovable, dari nol sampai jadi. Gue nggak coding sama sekali, nggak desain tampilannya, bahkan nggak ikut milih warnanya. Yang gue kasih cuma akses ke alatnya dan cara ngomong ke AI-nya. Sisanya dia kerjain sendiri. Hasilnya? Website-nya jadi, tanpa coding, tanpa kursus, tanpa harus ngerti istilah teknis apapun.

Di catatan ini gue tulisin persis gimana prosesnya — bukan teorinya, tapi langkah konkretnya, termasuk prompt yang bisa langsung lo pakai. Mulai dari cara ninguin ide sebelum buka Lovable, sampai checklist sebelum website-nya di-publish. Kalau lo punya bisnis dan pengen punya website sendiri, ini titik mulai yang paling jujur yang bisa gue kasih.

Catatan: Panduan ini ditulis dengan gaya ngobrol santai, persis seperti waktu gue ngajarin istri gue. Jadi jangan heran kalau bahasanya nggak baku. Yang penting lo paham dan bisa langsung praktik.


1. Sebelum Buka Lovable, Tentuin Dulu Mau Bikin Apa

Ini hal pertama yang gue bilang ke istri gue: "Eh, lo mau bikin website buat apa?"

Jangan langsung buka Lovable terus bilang:

"Bikinin website buat bisnis gue."

Bisa sih. Tapi dia belum tahu lo maunya kayak gimana. Bisnis lo apa? Jual apa? Yang bakal buka website siapa? Terus lo pengen mereka ngapain setelah buka website?

Kalau semua itu belum dikasih tahu, jangan heran kalau nanti lo lihat hasilnya terus bilang: "Lah... kok bukan gini yang gue bayangin?" 😂

Jadi sebelum mulai, lo cukup siapin beberapa hal sederhana.

Bisnis lo apa?

Contoh: Gue punya salon rambut pria di Semarang.

Target customer lo siapa?

Nggak perlu mikir ribet. Cukup: Pria umur 18–40 tahun yang pengen potong rambut rapi tanpa harus nunggu lama.

Lo jual apa?

  • Haircut
  • Haircut + Wash
  • Haircut + Styling
  • Hair Coloring

Website ini buat apa?

Misalnya: Gue pengen orang yang buka website langsung ngerti bisnis gue dan bisa booking lewat WhatsApp.

Udah. Nggak perlu bikin business plan 40 halaman dulu. 😂


2. Anggap Website Lo Kayak Brosur Digital

Ini cara paling gampang buat mikirinnya. Bayangin lo punya brosur usaha yang bisa dibuka lewat HP. Di brosur itu, lo mau kasih tahu apa? Misalnya:

  1. Nama dan bisnis lo
  2. Lo jual apa
  3. Kenapa orang harus pilih lo
  4. Hasil kerja lo
  5. Testimonial customer
  6. Harga, kalau memang perlu
  7. Cara menghubungi lo

Nah, website basic sebenarnya kurang lebih begitu. Lo nggak harus langsung bikin 20 halaman. Kalau bisnis lo cuma butuh satu halaman, satu halaman juga cukup.

Bagian 1: "Kami barber khusus pria di Semarang."
Bagian 2: Layanan dan harga.
Bagian 3: Foto hasil potongan.
Bagian 4: Testimonial.
Bagian 5: Tombol WhatsApp.

Selesai. Nggak semua bisnis butuh website yang ribet.


3. Sekarang Tentuin Isi Websitenya

Gue biasanya mulai dari pertanyaan sederhana:

"Kalau orang baru pertama kali kenal bisnis lo, apa yang perlu dia tahu?"

Untuk kebanyakan bisnis kecil, struktur seperti ini udah cukup:

1. Pembuka

Dalam beberapa detik pertama, orang harus tahu: "Ini bisnis apa?" Contoh: Potong Rambut Pria Tanpa Ribet di Semarang.

2. Tentang bisnis

Ceritain sedikit siapa lo dan bisnis lo. Nggak perlu sejarah perusahaan dari tahun 1987. 😂 Kalau nggak penting buat customer, nggak usah dimasukin.

3. Produk atau layanan

Jelasin apa yang bisa dibeli. Kalau ada harga, bisa sekalian ditampilkan.

4. Kenapa pilih lo?

Apa yang bikin bisnis lo beda? Misalnya:

  • Bisa booking dulu
  • Lokasi gampang dicari
  • Barber berpengalaman
  • Nggak perlu antre lama

5. Hasil kerja

Kalau ada portfolio, masukin. Foto hasil kerja biasanya jauh lebih membantu daripada paragraf panjang.

6. Testimonial

Kalau customer lo pernah kasih review bagus, tampilkan.

7. FAQ

Pertanyaan yang sering ditanyakan bisa dimasukin di sini.

8. Kontak / CTA

CTA itu cuma istilah buat tombol atau ajakan supaya orang melakukan sesuatu. Misalnya: Booking Sekarang via WhatsApp. Jadi jangan takut sama istilah "CTA". Intinya cuma: "Habis ini lo mau orang ngapain?"


4. Baru Sekarang Buka Lovable

Nah, sekarang baru kita masuk ke Lovable. Cara pakainya sebenarnya simpel banget — lo tinggal ngobrol sama dia. Kurang lebih kayak lo lagi nyuruh orang bikin website. Misalnya:

"Gue punya salon rambut pria di Semarang. Gue mau bikin website yang kelihatan modern dan premium, tapi jangan terlalu rame."

Terus lanjut:

"Target customer gue pria umur 18–40 tahun. Layanan gue haircut, haircut + wash, styling, dan coloring."

"Tujuan utama website ini adalah supaya orang tertarik dan akhirnya booking lewat WhatsApp."

"Gue mau ada bagian pembuka, layanan, harga, portfolio, testimonial, FAQ, dan tombol WhatsApp."

Udah. Lo sebenarnya lagi briefing orang. Bedanya, yang lo briefing bukan designer atau developer — tapi AI.


5. Jangan Langsung Suruh Dia Bikin

Ini salah satu hal yang gue ajarin ke istri gue. Gue bilang: "Minta dia bikin rencana dulu."

Kenapa? Karena kalau langsung bikin, terus ternyata strukturnya nggak sesuai yang lo mau, lo malah harus bongkar-bongkar lagi. Lebih enak begini:

"Sebelum bikin websitenya, kasih gue dulu rencana halaman dan bagian-bagian yang mau lo buat. Gue mau review dulu."

Nanti Lovable akan kasih gambaran. Misalnya: Hero → Services → About → Portfolio → Testimonials → FAQ → Contact

Lo tinggal lihat. Terus kalau menurut lo About nggak perlu, bilang aja:

"Bagian About nggak perlu. Gue lebih pengen orang langsung lihat layanan setelah bagian pembuka."

Atau: "Harga taruh lebih awal karena customer gue biasanya pengen tahu harga dulu."

Lo nggak perlu ngerti coding. Lo cuma perlu tahu: "Gue maunya gimana?"


6. Kalau Udah Cocok, Baru Suruh Bikin

Kalau rencananya udah sesuai, tinggal bilang:

"Oke, gue setuju sama struktur ini. Sekarang bikin websitenya."

Terus Lovable mulai kerja. Dan ini bagian yang menurut gue paling keren: lo bisa lihat website-nya jadi tanpa harus duduk belajar coding dulu. Nggak ada div, nggak ada class, nggak ada function, nggak ada margin-top, nggak ada why-the-hell-is-this-broken. Yang terakhir biasanya bagian dari pengalaman developer. 😂

Lo tinggal lihat hasilnya.


7. Kalau Ada yang Nggak Suka, Tinggal Ngomong

Nah, ini bagian yang bikin semuanya terasa gampang. Misalnya font-nya nggak cocok:

"Gue kurang suka font heading-nya. Bisa kasih beberapa pilihan yang lebih modern?"

"Bagian ini terlalu rame. Bikin lebih simple dong."

"Tombol WhatsApp-nya kurang kelihatan. Bikin lebih jelas."

"Gue nggak tahu kenapa, tapi bagian ini keliatan jelek. Coba bikin lebih bagus." 😂

Literally bisa ngomong kayak gitu. Lo nggak perlu bilang: "Please modify the CSS properties of the hero section." Nggak usah sok jadi developer. Kalau maksud lo "Ini jelek, tolong benerin" — ya bilang aja "Ini jelek, tolong benerin."


8. Kalau Hasilnya Belum Sesuai, Jangan Panik

Ini juga penting. Kadang hasil pertama belum tentu langsung bagus. Dan itu normal. Lo tinggal lanjut ngobrol:

"Gue suka layout-nya, tapi warnanya terlalu gelap."

"Coba bikin lebih clean dan terang."

"Nah ini lebih oke. Sekarang bikin bagian layanan lebih gampang dibaca dari HP."

Jadi prosesnya bukan: Prompt → langsung sempurna.

Lebih kayak: Ngomong → lihat → kasih feedback → perbaiki → lihat lagi. Sama kayak kalau lo punya designer. Cuma kali ini designer-nya nggak perlu lo traktir kopi tiap meeting. 😂


9. Jangan Cuma Mikirin Website-nya Bagus

Ini bagian yang menurut gue paling penting. Karena gampang banget kejebak: "Wah, bagus nih desainnya." Tapi terus — customer gue harus ngapain? Website bisnis bukan cuma pajangan.

Kalau tujuan lo adalah dapat customer, pastikan orang yang buka website bisa ngerti tiga hal:

1. Ini bisnis apa?

Jangan sampai orang harus scroll 7 kali baru ngerti lo jualan apa.

2. Kenapa gue harus pilih lo?

Kasih alasan yang jelas.

3. Kalau gue tertarik, harus ngapain?

Kasih jalan yang gampang. Misalnya: "Klik WhatsApp untuk booking." Simple.


10. Gue Kasih Satu Prompt yang Bisa Langsung Lo Copy

Kalau lo males mikir dari awal, pakai template ini. Tinggal ganti bagian yang ada di dalam [ ].

Gue mau bikin website untuk [NAMA BISNIS].

Bisnis gue adalah [JENIS BISNIS].

Customer gue biasanya [SIAPA CUSTOMER LO].

Produk atau layanan utama gue:
- [PRODUK/LAYANAN 1]
- [PRODUK/LAYANAN 2]
- [PRODUK/LAYANAN 3]

Tujuan utama website ini adalah [TUJUAN WEBSITE].

Gue pengen orang yang buka website ini melakukan [TINDAKAN YANG LO MAU].

Gue pengen tampilannya [CONTOH: clean, modern, premium, friendly],
tapi jangan terlalu rame.

Bagian yang gue mau ada:
1. Pembuka
2. Tentang bisnis
3. Produk/layanan
4. Keunggulan
5. Portfolio
6. Testimonial
7. FAQ
8. Kontak
9. Tombol WhatsApp

Sebelum bikin websitenya, kasih gue dulu rencana struktur
dan penjelasan singkat setiap bagiannya.

Jangan langsung bikin. Gue mau review dulu.

11. Setelah Rencananya Gue Setujui

Tinggal kasih prompt ini:

Oke, gue setuju sama struktur yang tadi.

Sekarang bikin websitenya berdasarkan rencana tersebut.

Pastikan:
- tampilannya bagus di HP dan desktop,
- tulisannya gampang dibaca,
- tombol WhatsApp jelas,
- desainnya clean,
- jangan terlalu banyak elemen,
- dan jangan menambahkan fitur yang belum gue minta.

Udah. Sekarang tinggal tunggu dia kerja.


12. Prompt Kalau Lo Bingung Harus Revisi Apa

Ini salah satu prompt yang menurut gue paling berguna. Kadang kita tahu "Kayaknya ada yang kurang" tapi nggak tahu kurangnya apa. Gue biasanya suruh AI bantu lihat dari sisi customer:

Anggap lo adalah customer yang baru pertama kali melihat website ini.

Review website ini dari sudut pandang customer.

Kasih tahu gue:
1. Apa yang langsung lo pahami?
2. Apa yang masih bikin bingung?
3. Apa yang bikin lo ragu?
4. Apa yang menurut lo harus diperbaiki?

Jangan ubah websitenya dulu.
Kasih gue pendapat lo dulu.

Ini berguna banget karena kadang kita yang punya bisnis udah terlalu hafal sama bisnis sendiri. Kita merasa semuanya jelas. Padahal customer baru: "Ini jualan apa ya?" 😂


13. Jangan Bikin Website 20 Halaman Dulu

Kalau baru pertama kali, gue justru nggak menyarankan lo mulai terlalu besar. Jangan:

"Bikin 20 halaman, login member, dashboard, payment gateway, CRM, chatbot, booking system, terus sambungin ke 14 aplikasi."

Santai dulu, bos. 😂 Mulai dari yang paling penting. Misalnya cuma:

  • 1 halaman
  • informasi bisnis
  • produk/layanan
  • portfolio
  • testimonial
  • CTA WhatsApp

Kalau nanti ternyata lo butuh fitur lain, baru tambahin. Lebih enak bikin sesuatu yang sederhana tapi jadi, daripada bikin sesuatu yang gede terus berhenti di tengah jalan.


14. Checklist Sebelum Website Lo Dianggap Selesai

Sebelum bilang "Oke, website gue jadi" — cek dulu ini.

Tentang bisnis

  • ☐ Nama bisnis jelas
  • ☐ Orang langsung ngerti lo jual apa
  • ☐ Lokasi jelas kalau memang penting
  • ☐ Nomor WhatsApp benar
  • ☐ Jam buka benar

Isi website

  • ☐ Ada pembuka yang jelas
  • ☐ Produk/layanan dijelaskan
  • ☐ Ada alasan kenapa orang harus pilih lo
  • ☐ Ada portfolio kalau memang ada
  • ☐ Ada testimonial kalau memang ada
  • ☐ Ada tombol untuk menghubungi lo

Tampilan

  • ☐ Tulisan gampang dibaca
  • ☐ Website nggak terlalu rame
  • ☐ Foto yang dipakai masuk akal
  • ☐ Tampilan HP sudah dicek
  • ☐ Tombol penting gampang ditemukan

Sebelum publish

  • ☐ Semua tombol sudah dicoba
  • ☐ Link nggak ada yang error
  • ☐ WhatsApp benar-benar menuju nomor yang benar
  • ☐ Informasi harga sudah benar kalau ditampilkan
  • ☐ Tidak ada tulisan placeholder seperti "Lorem Ipsum" yang nyangkut

Yang terakhir ini penting. Jangan sampai website udah live tapi masih ada "Lorem ipsum dolor sit amet..." Customer lo bisa mikir lo jualan mantra. 😂


15. Tapi Berarti Developer Udah Nggak Dibutuhkan?

Nggak juga. Ini yang jangan sampai salah tangkap.

Sekarang lo memang bisa bikin website sederhana sendiri. Tapi bikin website sederhana dan bikin sistem yang kompleks itu dua hal berbeda.

Kalau cuma website profil bisnis, landing page, portfolio, halaman layanan, atau website sederhana untuk promosi — AI website builder seperti Lovable bisa sangat membantu.

Tapi kalau udah masuk ke hal seperti sistem login yang kompleks, database besar, pembayaran, integrasi banyak sistem, sistem internal perusahaan, keamanan, atau aplikasi dengan banyak user — nah, di situ developer masih sangat berguna.

Jadi menurut gue bukan: "AI bikin developer nggak berguna." Lebih tepatnya: "AI bikin orang yang sebelumnya nggak bisa bikin website jadi bisa mulai bikin sendiri." Dan menurut gue itu justru bagus.


16. Satu Hal yang Gue Pengen Lo Inget

Setelah ngajarin istri gue bikin website sendiri, gue jadi makin yakin satu hal: masalah terbesar biasanya bukan karena orang nggak bisa bikin website.

Mereka cuma belum tahu: "Gue sebenarnya butuh website yang kayak gimana?"

Karena kalau lo udah tahu bisnis lo apa, customer lo siapa, apa yang lo jual, apa yang mau lo sampaikan, dan customer harus ngapain — sisanya sekarang jauh lebih gampang dibantu AI. Lo nggak harus belajar coding dulu. Lo bahkan nggak harus ngerti istilah-istilah aneh.

Lo cukup bisa bilang: "Gue maunya kayak gini." Terus tinggal ngobrol sampai hasilnya sesuai.


Bonus: Formula Website Bisnis yang Gampang Banget

Kalau lo masih bingung harus masukin apa ke website, inget 4 hal ini:

1. Masalah

Customer lo punya masalah apa? Contoh: "Susah cari barber yang bisa booking tanpa antre."

2. Solusi

Lo bantu mereka gimana? "Booking dulu lewat WhatsApp, datang sesuai jadwal."

3. Bukti

Kenapa mereka harus percaya? Misalnya: foto hasil kerja, review customer, portfolio, pengalaman, atau jumlah customer.

4. Aksi

Setelah lihat semua itu, mereka harus ngapain? "Booking lewat WhatsApp."

Udah. Website nggak harus penuh tulisan. Yang penting orang masuk → ngerti → percaya → tahu harus ngapain.


Penutup

Kalau istri gue yang awalnya nggak ngerti beginian aja bisa bikin website sendiri, gue rasa lo juga bisa mulai. Nggak perlu langsung bikin website yang sempurna. Coba bikin yang sederhana dulu.

Buka Lovable. Ceritain bisnis lo. Kasih tahu lo mau bikin apa. Minta dia bikin rencana. Lo review. Kalau nggak suka, bilang. Kalau masih kurang, bilang lagi. Jangan takut salah ngomong. Lo lagi ngobrol sama AI, bukan lagi sidang skripsi. 😂

Dan kalau akhirnya website pertama lo masih jelek? Ya tinggal bilang: "Oke, ini belum bagus. Kita benerin lagi." Itu justru enaknya.


TL;DR

Kalau males baca semuanya, inget workflow ini:

  1. Tentuin website lo buat apa
  2. Siapin informasi bisnis lo
  3. Ceritain semuanya ke Lovable
  4. Minta dia bikin rencana dulu
  5. Review rencananya
  6. Kalau udah cocok, suruh bikin
  7. Lihat hasilnya
  8. Kalau nggak suka, tinggal ngomong
  9. Revisi sampai sesuai
  10. Cek dari HP sebelum publish

Sesimpel itu. Selamat bikin website. Jangan lupa bilang ke Lovable kalau font-nya jelek. 😂


Satu Langkah Lebih Jauh

Panduan ini selesai di website — tapi bisnis lo nggak berhenti di sana. Website adalah cara orang menemukan lo. Yang menentukan apakah mereka balik lagi, rekomendasikan lo ke orang lain, dan beli lebih banyak adalah sistem di belakangnya: gimana lo handle booking, gimana lo follow up, gimana tim lo koordinasi ketika volume mulai tumbuh.

Ini yang gue maksud waktu gue bilang masalah terbesar bukan teknologi, tapi pemahaman tentang apa yang sebenarnya lo butuhkan. Lovable bisa bantu lo punya website dalam sehari. Tapi kalau lo udah di titik di mana bisnis lo butuh lebih dari sekadar website — butuh sistem operasional yang beneran jalan, yang bisa handle volume lebih besar tanpa nambah banyak orang — itu cerita yang berbeda.

Di Exclolab, itulah yang kita kerjain setiap hari. Kalau lo penasaran dengan apa yang mungkin, mulai dari percakapan — gratis, tujuh hari, tanpa kewajiban. Ngobrol sama kita di sini.

Author

Lorencius Alvin Purnama

Lorencius Alvin Purnama

Co-Founder & Managing Director

Before Exclolab, Loren spent a decade embedded in service businesses across Southeast Asia — not as an outside consultant, but as the person who sits with the team, watches how work actually flows, and figures out where the system is breaking down. He developed the Discovery methodology at Exclolab from that experience: the idea that you cannot design a good system until you understand the one it's replacing. At Exclolab, he owns the Discovery phase and the client relationship from first conversation through final deployment.

Related articles

Cara Bikin Website Sendiri Pakai Lovable — Exclolab