Research: CMS UI — Multitenant & Reusable UI Kit
Tech Plan: Research: CMS UI — Multitenant & Reusable UI Kit
Dokumen: RES-008
PIC / Owner: TBD
Status: Research
Tanggal: Juli 2026
1. Latar Belakang
Banyak produk internal saat ini memiliki CMS/admin panel masing-masing dengan implementasi yang berulang (form, list, table, filter, role-based access). Inisiatif ini bertujuan merancang CMS UI yang:
- Multitenant — dapat dipakai lintas produk internal dengan konfigurasi per-tenant
- Reusable UI Kit — komponen UI yang konsisten dan terdokumentasi untuk dipakai di luar CMS
Sub-halaman: [RES-008a — Epic, Module & Task Breakdown](RES-008a — Epic, Module & Task Breakdown)
2. Ruang Lingkup (Scope)
Termasuk dalam scope
- Riset platform CMS open-source / SaaS yang cocok untuk multi-tenant (Strapi, Directus, Sanity, Payload, dsb).
- Evaluasi UI framework + design system yang akan jadi pondasi UI Kit (Tailwind + shadcn/ui, Mantine, Ant Design, dsb).
- Rancangan struktur UI Kit yang dapat di-publish sebagai package internal (npm/internal registry).
- Konvensi theme/branding per tenant (white-label).
Di luar scope
- Migrasi produk eksisting ke CMS baru — menunggu hasil riset dan keputusan adopsi.
- Backend API produk — di luar ranah CMS UI.
3. Kebutuhan (Requirements)
Multitenancy
- Strategi isolasi data per tenant (schema-per-tenant, row-level security, dsb).
- Konfigurasi role & permission per tenant.
- Custom field/schema per tenant tanpa fork core code.
UI Kit
- Komponen dasar: form, table, list, filter, modal, navigation, dsb.
- Dokumentasi & playground (Storybook atau equivalent).
- Konsistensi visual dengan brand guideline (color, typography, spacing).
- Aksesibilitas (WCAG minimum AA).
Developer Experience
- Setup cepat untuk produk baru yang ingin adopt UI Kit.
- Theming & customization yang sederhana.
- Type-safe API untuk komponen.
4. Task List
| No | Task | PIC | Prioritas | Status |
|---|---|---|---|---|
| 1 | Tentukan PIC riset & alokasi waktu | CPO/Eng Lead | Tinggi | Belum Mulai |
| 2 | Riset & shortlist platform CMS (Strapi, Directus, Sanity, Payload, dll) | PIC Riset | Tinggi | Belum Mulai |
| 3 | Riset & shortlist UI framework + design system | PIC Riset | Tinggi | Belum Mulai |
| 4 | Definisikan strategi multitenancy (isolasi data, custom schema) | Backend Eng | Tinggi | Belum Mulai |
| 5 | PoC: setup CMS pilihan dengan 2 tenant berbeda | Eng | Tinggi | Belum Mulai |
| 6 | PoC: bangun 3-5 komponen UI Kit dasar | Frontend Eng | Tinggi | Belum Mulai |
| 7 | Evaluasi PoC — DX, performance, customization cost | Product/Eng | Tinggi | Belum Mulai |
| 8 | Susun rekomendasi adopsi + roadmap integrasi | CPO/Eng Lead | Tinggi | Belum Mulai |
5. Risiko & Pertimbangan
- Kompleksitas multitenancy bisa tinggi jika platform CMS tidak mendukung native.
- UI Kit yang terlalu generik kehilangan product-specific value; terlalu spesifik tidak reusable.
- Onboarding produk eksisting ke CMS baru memerlukan effort migrasi yang tidak kecil.
- Vendor lock-in pada platform CMS pihak ketiga.
6. Timeline / Milestone
| Fase | Target Waktu | Output |
|---|---|---|
| Discovery & Shortlist | Minggu 1-2 | Kandidat CMS & UI framework |
| PoC Teknis | Minggu 3-4 | PoC CMS + UI Kit selesai |
| Evaluasi & Rekomendasi | Minggu 5 | Keputusan adopsi + roadmap |
Related
- Sibling frontend tooling: [AI Builder App — GLM Z](AI Builder App — GLM Z) — kalau GLM Z diadopsi, akan banyak prototype UI yang dibangun cepat; UI Kit yang baik akan menjaga konsistensi.
- Sibling build-vs-buy: [Fleet Management](Fleet Management) — keputusan vendor/saas vs build sendiri untuk CMS mirip dengan build-vs-buy Fleet.
- Downstream kandidat: [CS OmniChannel](CS Omnichannel — Self-Hosted) — CMS UI bisa dipakai untuk admin panel CS Omnichannel.
- Sibling: README → [Research Lab index](Research Lab)
- Breakdown: [RES-008a — Epic, Module & Task Breakdown](RES-008a — Epic, Module & Task Breakdown)