Rebuild Situs KONTROVERSIONAL

KONTROVERSIONAL adalah agensi digital di Jakarta yang berdiri sejak 2024, aktif di TikTok baik sebagai brand account maupun lewat roster talent yang dikelola. Situs yang berjalan sekarang hanya bicara kepada satu audiens: brand. Proyek ini membangun ulang situs tersebut agar melayani dua audiens sekaligus — klien brand dan calon talent — sambil memindahkan identitas visual TikTok agensi ke web tanpa kehilangan ketegasannya.

Hasilnya adalah situs statis tanpa CMS dan tanpa backend: seluruh konten hidup sebagai file terstruktur di dalam repositori, sehingga pembaruan konten adalah perubahan konten, bukan perubahan desain.

Catatan: build ini adalah demonstrasi. Seluruh talent, klien, dan testimoni yang tampil merupakan konten placeholder atau referensi, bukan klaim komersial.

Situs lama adalah satu halaman marketing dengan alur tunggal menuju WhatsApp. Ia bekerja untuk brand, tetapi tidak punya tempat bagi creator yang ingin bergabung, dan tidak menampilkan roster talent sebagai aset yang bisa dijual ke brand. Dua kebutuhan itu sebenarnya saling menguatkan: roster yang terlihat kuat menaikkan kredibilitas di mata brand, dan daftar brand yang meyakinkan menarik talent baru.

1. Brand & marketer — mencari eksekusi konten viral, kolaborasi influencer, atau personal branding. Niat utamanya menilai kredibilitas lalu memulai percakapan.
2. Creator & calon talent — kreator TikTok/Instagram yang mempertimbangkan bergabung. Ingin tahu siapa saja yang sudah tanda tangan, apa yang ditawarkan agensi, dan cara melamar.
3. Pers & partner (sekunder) — menilai posisi dan citra agensi.

Percabangan terjadi di awal, lewat panel besar di homepage dan navigasi yang diberi label berdasarkan audiens, bukan berdasarkan fitur. Titik silangnya ada di halaman profil talent: CTA “book this talent” mengembalikan trafik creator ke corong brand.

Sistem visual diambil langsung dari konten TikTok agensi: hitam, putih, dan satu merah aksen. Tidak ada warna keempat, tidak ada gradien, tidak ada pastel. Tipografi display berukuran besar berperan sebagai elemen grafis utama — bukan sekadar label — dan fotografi tampil full-bleed dengan perlakuan cutout.

• Palet — Maksimal tiga warna di layar: hitam, putih, merah aksen.
• Tipografi — Grotesque tebal untuk headline, sans bersih untuk body. Satu kata di dalam headline diberi warna merah sebagai penekanan.
• Modul khas — “Kontroversial Take:” — label merah diikuti satu kalimat berpendapat, dipakai berulang di seluruh situs.
• Motion — Reveal saat scroll yang cepat dan singkat, plus ticker marquee. Bukan parallax sinematik.
• Dua register — Halaman talent bergaya editorial fashion; konten kultur agensi boleh terasa lebih kasar dan meme-adjacent.

Semua keputusan teknis mengikuti satu batasan: tanpa CMS, tanpa backend, konten dikelola sebagai kode. Situs sepenuhnya statis dan bisa di-host di CDN mana pun tanpa biaya server.

Konsekuensi pentingnya: satu file talent yang formatnya salah akan menggagalkan build, bukan tayang sebagai halaman rusak. Validasi terjadi sekali di batas masuk konten, sehingga sisa kode tidak perlu memeriksa data kosong di mana-mana.

Empat minggu, empat fase. Setiap minggu menghasilkan sesuatu yang bisa dibuka dan dinilai, bukan sekadar progres internal.

1. Minggu 1

   Fondasi & Sistem Desain

   Menyiapkan rangka teknis dan bahasa visual sebelum satu halaman pun dibangun.

   • —Setup Next.js dengan static export, TypeScript, dan Tailwind CSS.
   • —Mengunci palet menjadi hitam, putih, dan satu merah aksen — warna di luar itu gagal saat compile, bukan sekadar dilarang saat review.
   • —Skala tipografi fluid (clamp) untuk headline berukuran besar sesuai DESIGN.md §3.
   • —Komponen inti: Logo, TwoToneHeadline, TakeCallout, MarqueeTicker, StatBadge, SectionBreakBlack.

   Output Design system yang siap dipakai ulang, dan halaman kosong yang sudah ter-deploy.

2. Minggu 2

   Lapisan Konten & Halaman Talent

   Konten sebagai kode: setiap talent adalah satu file JSON yang tervalidasi saat build.

   • —Skema konten (JSON + Zod) untuk talent, klien, testimoni, dan case study — data yang salah menggagalkan build, bukan lolos ke produksi.
   • —Sepuluh profil talent untuk peluncuran, lengkap dengan bio “meet our trover”, niche tag, dan statistik TikTok/Instagram.
   • —Halaman roster /talents dengan filter niche.
   • —Layout profil /talents/[slug]: portrait editorial, wordmark nama, blok statistik, embed TikTok, dan CTA “book this talent”.

   Output Seluruh jalur audiens creator selesai dan bisa diuji.

3. Minggu 3

   Halaman untuk Brand

   Menyelesaikan sisi komersial dan menyatukan dua audiens dalam satu alur.

   • —Home: hero, stats bar, marquee tagline, dan audience fork brand vs. talent.
   • —/brands: lima layanan detail, case study (masalah → pendekatan → hasil → metrik), logo klien, testimoni.
   • —/work, lalu /about dengan empat pilar “Not for Everyone” dan modul Kontroversial Take.
   • —/contact: form bercabang (“saya brand” / “saya creator”) lewat layanan form statis, dengan deep link WhatsApp sebagai fallback utama.

   Output Seluruh sitemap hidup dan saling terhubung.

4. Minggu 4

   Pemolesan & Peluncuran

   Mengubah situs yang sudah lengkap menjadi situs yang layak produksi.

   • —Pipeline gambar responsif (Sharp) — portrait talent berukuran besar, jadi srcset disiapkan saat build.
   • —SEO: meta tag, OG image per halaman (terutama profil talent yang sering dibagikan langsung), sitemap.xml.
   • —Audit aksesibilitas: kontras, keterbacaan tipografi display di layar kecil, fokus keyboard, prefers-reduced-motion.
   • —Uji performa di jaringan mobile, lalu deploy statis ke Vercel/Netlify/Cloudflare Pages.

   Output Situs live, dengan analytics dasar yang mengukur target di bagian Tujuan.

• ×CMS atau panel admin untuk editor non-teknis — konten dikelola lewat kode sesuai keputusan stakeholder.
• ×E-commerce atau pembayaran.
• ×Login atau dashboard bagi talent untuk mengelola profilnya sendiri.
• ×Pergantian bahasa otomatis (multi-language switching).

Hal-hal berikut perlu keputusan dari pihak agensi sebelum peluncuran nyata:

1. 1.Domain kanonik: kontroversional.com atau kontraversional.com?
2. 2.Apakah metrik hasil tersedia untuk logo klien yang ditampilkan, atau tetap logo-only sampai case study ditulis?
3. 3.Apakah sepuluh talent tersebut adalah roster penuh saat ini?
4. 4.Apakah ada testimoni di luar tiga yang sekarang tayang?
5. 5.Lamaran talent langsung ke WhatsApp, atau lewat form terstruktur?
6. 6.Situs berbahasa Indonesia, Inggris, atau dwibahasa?

Untuk pertanyaan mengenai build ini, cakupan pekerjaan, atau lini masa: