Zero to Hero: Cara Membuat Aplikasi Anda Tidak Terlihat Seperti Setiap Aplikasi AI Lainnya

Anda tahu tampilannya.

Latar belakang putih. Tombol biru. Font Inter. Bagian hero dengan gradasi ungu-ke-indigo. Kartu dengan sudut membulat yang identik dan bayangan tipis yang sama. Bilah navigasi dengan logo Anda di sebelah kiri dan tombol "Get Started" di sebelah kanan.

Anda telah melihatnya ratusan kali. Dan saat Anda membuat aplikasi pertama Anda, Anda melihatnya lagi — kecuali kali ini, itu adalah milik Anda.

Ini adalah pertanyaan yang paling banyak dicari, paling sedikit dijawab dalam vibe coding saat ini: bagaimana Anda membuat sesuatu yang terlihat seperti diri Anda?

Jawabannya bukanlah perbaikan teknis. Ini adalah masalah deskripsi. Dan artikel ini akan menyelesaikannya.

Tujuan kami untuk artikel ini sederhana:

• Mengapa AI secara default menggunakan tampilan generik — dan apa yang sebenarnya terjadi ketika hal itu terjadi

• Kosakata yang Anda butuhkan untuk mendeskripsikan desain tanpa latar belakang desain

• Proses langkah demi langkah untuk beralih dari generik ke khas, tepat di sini di Enter

1. Mengapa AI Secara Default Menggunakan Tampilan yang Sama?

AI belajar dari apa yang ada. Ketika Anda meminta sesuatu yang "profesional" atau "bersih" atau "modern," AI akan merujuk pada rata-rata statistik dari setiap antarmuka profesional, bersih, dan modern yang pernah dilatihnya.

Rata-rata itu memiliki wajah yang sangat spesifik:

• Latar belakang putih

• Tombol biru

• Font Inter

• Sudut membulat

• Kartu berbayangan

Ini bukan desain yang buruk. Ini adalah desain yang aman — jenis desain yang tidak menyinggung siapa pun dan tidak membedakan siapa pun.

AI tidak membuat pilihan estetika. AI membuat pilihan probabilitas.

Aturan yang mengubah segalanya: arahan yang samar → hasil yang generik. Setiap saat.

Perbaikannya bukan pada alatnya. Perbaikannya adalah pada cara Anda berbicara dengan alat tersebut.

2. Pergeseran Mental: Anda Adalah Art Director

Kebanyakan orang berpikir mereka membutuhkan pengetahuan teknis untuk mendeskripsikan desain — nama font, kode warna, properti CSS. Kerangka berpikir yang salah.

Anda adalah art director, bukan desainer.

Seorang art director menunjuk ke mood board dan berkata: "Saya ingin rasanya seperti ini — tetapi lebih hangat, dan lebih tajam." Desainer yang memikirkan eksekusinya.

Anda telah mengembangkan keterampilan ini sepanjang hidup Anda:

• Berjalan ke kafe dan langsung tahu apakah rasanya menyenangkan

• Membuka situs web dan menutupnya dalam tiga detik karena terasa tidak pas

• Melihat sesuatu dan berpikir "ini terlalu berlebihan" atau "ini terasa mahal"

Itulah literasi desain. Hanya saja sebelumnya tidak pernah memiliki saluran keluaran. Vibe coding memberikannya.

Selera Anda bukanlah masalahnya. Deskripsi Anda tentang selera Anda yang bermasalah. Dan itu adalah keterampilan yang bisa dipelajari.

3. Dari Generik ke Khas: Langkah demi Langkah

Bangun Kosakata Anda Terlebih Dahulu

Desain tidak memerlukan gelar. Desain membutuhkan kata-kata yang tepat. Berikut adalah kategori yang paling banyak berperan:

Kata-kata suasana hati — seperti apa produk tersebut seharusnya terasa?

1- Referensi industri — beberapa industri memiliki estetika yang langsung dapat dikenali. Beritahu AI bahwa produk Anda harus terasa seperti salah satu dari ini:

• Firma arsitektur

• Majalah mode

• Terminal keuangan

• Hotel mewah

• Toko buku independen

• Jurnal medis

2- Arah tipografi — Anda tidak perlu menyebutkan nama font tertentu. Anda hanya perlu memilih arah:

• Serif (guratan horizontal kecil di ujung huruf — bayangkan surat kabar, buku) → terasa mapan, sastrawi, tepercaya

• Sans-serif (bersih, tanpa guratan — bayangkan sebagian besar produk teknologi) → terasa modern dan langsung

3- Jarak dan kontras:

• Kontras tinggi atau lembut?

• Padat atau luas?

• Tipografi tebal atau tipis?

Pilihan-pilihan ini lebih menentukan bagaimana sesuatu terasa dibandingkan dengan warna apa pun.

Langkah 1 — Mulai Dengan Apa yang Sudah Ada di Enter

Sebelum menulis satu kata pun dari perintah Anda, cara tercepat untuk menemukan arah visual Anda sudah ada di dalam Enter.

Di beranda, gulir melewati input obrolan. Anda akan melihat dua tab: Templates dan Components.

Templates adalah titik awal yang lengkap — masing-masing merupakan dunia estetika yang berbeda:

• Tata letak editorial yang berani

• Antarmuka game yang gelap

• Platform musik yang bersih

• Presentasi kursus yang minimalis

Jelajahi template tersebut bukan untuk ditiru, melainkan untuk bereaksi. Reaksi Anda adalah informasi.

Components masuk satu tingkat lebih dalam — blok pembangun individual: kartu, bilah navigasi, bagian hero, tabel harga. Jika Anda menyukai bagaimana komponen tertentu menangani tipografi atau jarak, gunakan itu sebagai titik jangkar Anda.

Langkahnya: Jelajahi → bereaksi → tulis apa yang Anda perhatikan. Bukan "Saya suka yang ini." Secara spesifik:

• "Saya suka karena judulnya besar dan teks tubuhnya kecil"

• "Saya suka karena hanya ada satu warna aksen dan sisanya hitam putih"

• "Saya suka seberapa banyak ruang di antara elemen — tidak ada yang terasa padat"

Pengamatan tersebut adalah arahan Anda.

Langkah 2 — Tulis Perintah yang Spesifik

Ambil semua yang Anda kumpulkan dan masukkan ke dalam perintah Anda.

Ide yang sama. Hasil yang sama sekali berbeda.

→ Butuh bantuan menulis perintah pertama yang kuat? Lihat Vibe Coding Guide for Non-Technical Founders

Langkah 3 — Buat Tiga Keputusan yang Memiliki Bobot 80%

Tiga keputusan menentukan apakah sesuatu terlihat khas atau generik:

1. Palet warna

• Satu warna latar belakang Satu warna teks Satu warna aksen Sebutkan secara spesifik (putih gading, hampir hitam, hijau hutan tua) — bukan "sesuatu yang netral"

2. Tipografi

• Satu arah untuk judul (serif atau sans-serif) Satu untuk teks tubuh Minta sesuatu yang editorial, teknis, atau hangat — AI akan memilih yang sesuai

3. Jarak

• Jarak yang longgar hampir selalu lebih baik daripada yang sempit Jika sesuatu terlihat murah atau padat → minta lebih banyak ruang bernapas, lebih banyak ruang kosong, lebih banyak bantalan di dalam kartu Anda akan langsung melihat perbedaannya

Langkah 4 — Gunakan Visual Editor untuk 20% Terakhir

Ada titik di mana mendeskripsikan perubahan lebih lambat daripada langsung melakukannya:

• Margin antar bagian terlalu sempit dua piksel

• Warna tombol sudah benar tetapi sedikit terlalu jenuh

• Ukuran judul perlu diturunkan sedikit saja

Di sinilah Visual Editor dari Enter mengubah dinamika. Klik elemen → sesuaikan secara langsung (ukuran font, warna, jarak, tata letak) → tanpa perintah baru, tanpa pembuatan baru, tanpa risiko merusak hal lain.

Alur kerja:

1. Jelajahi template → temukan reaksi Anda

2. Deskripsikan arah → buat

3. Klik untuk menyempurnakan → Visual Editor

4. Terbitkan

AI membawa Anda 80% dari jalan ke sana dengan cepat. Visual Editor menangani 20% terakhir dengan presisi.

Langkah 5 — Terbitkan dan Lihat dengan Segar

Ketika rasanya sudah dekat, tekan terbitkan.

Enter menyebarkannya secara instan ke URL langsung. Kemudian buka tautan itu di ponsel Anda, menjauhlah dari meja Anda, dan lihatlah seperti orang asing.

Ajukan satu pertanyaan: apakah ini terlihat seperti dibuat oleh seseorang yang memiliki sudut pandang?

• Ya → Anda selesai

• Tidak → Anda sekarang tahu apa yang kurang — deskripsikan celahnya, sempurnakan, ulangi

Itulah putarannya. Ini menjadi lebih cepat di setiap putaran.

Apa Selanjutnya dalam Seri Ini

Anda sekarang tahu mengapa generik terjadi dan bagaimana cara menghindarinya. Pembuatan Anda berikutnya harus terlihat seperti milik Anda.

Lain kali, kita akan masuk satu tingkat lebih dalam. Karena desain adalah satu hal — tetapi membangun sesuatu yang benar-benar ingin digunakan orang adalah hal lain. Kita akan berbicara tentang kesalahan paling umum yang dilakukan para pendiri setelah mereka mendapatkan tampilan yang tepat: membangun hal yang salah dengan indah. Bagaimana menemukan masalah yang tepat, bagaimana memvalidasi sebelum Anda membangun, dan bagaimana memastikan apa yang Anda kirimkan layak untuk dikirimkan.

Sampai jumpa lagi.