Appearance
Comparison: Live Website vs Figma Design
Sumber:
- Live Website — current production site
- Figma Site — new design proposal
Tanggal: 16 Mei 2026 Scope: Membandingkan fitur, halaman, dan AI capabilities antara website live dan desain Figma.
Executive Summary
Website live memiliki 21 halaman termasuk beberapa fitur yang tidak disebutkan di Figma (Pricing, Profile Settings, AI Synthesis Core, Mood Charts). Sebaliknya, Figma menekankan aspek marketing dan community yang belum ada di website maupun backend. Gap terbesar ada pada 6 wisdom traditions — website live menunjukkan halaman untuk semuanya, tapi backend hanya support BaZi penuh.
| Aspek | Website Live | Figma | Backend |
|---|---|---|---|
| Halaman | 21 | 1 (landing only) | N/A |
| AI Systems | 5+ tampak | 6 dijanjikan | 1 penuh (BaZi) |
| Payment | Ada (Pricing page) | Tidak disebut | ✅ Doku |
| Community | Tidak ada | Dijanjikan | ❌ Tidak ada |
| Progress Tracking | Mood Charts | Dijanjikan | ⚠️ Partial |
1. Halaman — Website Live (21 pages)
Dari navigasi website live, berikut halaman yang tersedia:
| # | Halaman | Status Backend | Keterangan |
|---|---|---|---|
| 1 | Home | ✅ | Landing page |
| 2 | Destiny Studio | ⚠️ | Kemungkinan rebrand dari DestinyPage. Backend sama (invokeDestiny). |
| 3 | Ba Zi | ✅ | Endpoint invokeDestiny system="bazi". Prompt lengkap di frontend. |
| 4 | Numerology | ⚠️ | Dihitung client-side (numerology-engine.ts). Tidak ada endpoint backend khusus. |
| 5 | Human Design | ⚠️ | Ada di enum schema, tidak ada prompt/endpoint. Page mungkin stub/placeholder. |
| 6 | Primbon | ⚠️ | Ada di enum schema, tidak ada prompt/endpoint. Weton client-side only. |
| 7 | Psychology | ⚠️ | Ada di enum schema, tidak ada prompt/endpoint. Page mungkin stub. |
| 8 | Spiritual | ❌ | Tidak ada di backend sama sekali. Page baru, perlu endpoint baru. |
| 9 | AI Synthesis Core | ❌ | Tidak ada di backend. Mungkin mega-prompt yang gabungkan semua system. Perlu endpoint baru. |
| 10 | Comprehensive Output | ❌ | Tidak ada di backend. Mungkin report aggregator. Perlu design lebih lanjut. |
| 11 | Compatibility Test | ✅ | Full CRUD + deep insights + payment unlock. |
| 12 | Compatibility Result Detail | ✅ | Detail view dari compatibility result. |
| 13 | Member Dashboard | ✅ | checkDestinyAccess, listJournal, listCompatibility, purchases. |
| 14 | Inner Growth Journal | ✅ | Full CRUD + AI summary (generateJournalSummary). |
| 15 | Mood And Growth Charts | ⚠️ | Page ada, tapi backend tidak ada time-series tracking. Journal punya mood/energy/stress per entry, tapi tidak ada aggregate chart endpoint. |
| 16 | Profile Settings | ⚠️ | profiles table ada (bio, birthDate, preferences), tapi tidak ada endpoint update profile yang lengkap. |
| 17 | Pricing | ✅ | Page ada. Backend punya Doku payment + DEEP_INSIGHTS_PRICE config. |
| 18 | Payment Success | ✅ | Redirect setelah Doku payment. Webhook handler update status. |
| 19 | User Journey | ❌ | Tidak ada di backend. Mungkin onboarding/walkthrough page. Pure frontend. |
| 20 | Privacy Policy | ✅ | Static page. |
| 21 | Terms Of Service | ✅ | Static page. |
2. Fitur Figma yang Tidak Ada di Website Live
| Fitur Figma | Status Website Live | Status Backend | Keterangan |
|---|---|---|---|
| Astrology | ❌ Tidak ada halaman | ❌ Tidak ada endpoint | Gap terbesar. Figma sebut Astrology, website tidak punya halaman astrology. |
| Community Connection | ❌ Tidak ada | ❌ Tidak ada | Tidak ada fitur sosial sama sekali. |
| 50k+ Soul Seekers counter | ❌ Tidak ada | ❌ Tidak ada | Marketing stat, tidak ada aggregate counter. |
| 100k+ Maps Created counter | ❌ Tidak ada | ❌ Tidak ada | Marketing stat, tidak ada analytics table. |
| 4.9★ Rating | ❌ Tidak ada | ❌ Tidak ada | Tidak ada rating/review system. |
3. Fitur Website Live yang Tidak Ada di Figma
| Fitur Website Live | Keterangan |
|---|---|
| Pricing page | Figma tidak menunjukkan pricing/payment flow. Website live punya halaman Pricing. |
| Profile Settings | Figma tidak menunjukkan user profile management. Website live punya halaman ini. |
| Payment Success | Figma tidak menunjukkan post-payment flow. Website live punya halaman redirect setelah bayar. |
| AI Synthesis Core | Figma tidak sebut fitur ini. Website live punya halaman yang mungkin mega-prompt gabungan. |
| Comprehensive Output | Figma tidak sebut. Website live punya halaman report lengkap. |
| Mood And Growth Charts | Figma sebut "Progress Tracking" tapi tidak detail. Website live punya halaman khusus. |
| User Journey | Figma tidak sebut onboarding/walkthrough. Website live punya halaman ini. |
| Spiritual | Figma tidak sebut secara eksplisit. Website live punya halaman khusus. |
4. AI Features Deep Dive
4.1 invokeDestiny Endpoint
Backend punya satu endpoint generik untuk semua AI analysis:
POST /api/v1/invokeDestiny
{
"system": "bazi" | "numerology" | "humanDesign" | "primbon" | "synthesis",
"prompt": string,
"jsonMode": boolean
}Yang aktif digunakan:
system: "bazi"— Prompt lengkap di frontend, hasil dari Base44 LLM ✅system: "synthesis"— Mungkin digunakan untuk AI Synthesis Core ⚠️
Yang ada di enum tapi tidak digunakan:
system: "numerology"— Numerology dihitung client-side, tidak pernah kirim ke LLMsystem: "humanDesign"— Tidak ada prompt, tidak ada frontend usagesystem: "primbon"— Weton dihitung client-side, tidak pernah kirim ke LLM
4.2 AI Features yang Kurang
| AI Feature | Status | Detail |
|---|---|---|
| Astrology (natal chart) | ❌ | Tidak ada di enum, tidak ada prompt, tidak ada endpoint. Figma janjikan tapi tidak ada di website maupun backend. |
| Psychology (Big Five/MBTI) | ⚠️ | Ada di enum, tidak ada prompt/frontend usage. Website live punya halaman Psychology tapi mungkin stub. |
| Human Design (bodygraph) | ⚠️ | Ada di enum, tidak ada prompt/frontend usage. Website live punya halaman tapi mungkin stub. |
| Primbon (Javanese) | ⚠️ | Ada di enum, Weton dihitung client-side. Tidak ada prompt LLM. Website live punya halaman. |
| Spiritual (generic) | ❌ | Tidak ada di enum, tidak ada endpoint. Website live punya halaman tapi backend tidak support. |
| AI Synthesis Core | ❌ | Tidak ada di backend. Konsep "gabungkan semua system" memerlukan prompt engineering baru. |
| Comprehensive Output | ❌ | Tidak ada di backend. Memerlukan aggregator/report builder. |
4.3 AI Features yang Kelebihan (Backend > Figma)
| AI Feature | Detail |
|---|---|
| Journal AI Summary | generateJournalSummary — AI analyze journal entries dan beri growth insights. Figma tidak sebut fitur ini secara spesifik. |
| Compatibility Deep Insights | generateDeepInsights — AI generate compatibility analysis setelah unlock. Figma sebut compatibility tapi tidak detail AI-nya. |
| Base44 LLM Proxy | Generic LLM proxy untuk semua AI calls. Figma tidak sebut infrastructure ini. |
5. Ringkasan Perbandingan 3 Aktor
Matriks Fitur x Aktor
| Fitur | Figma (Marketing) | Website Live | Backend |
|---|---|---|---|
| Astrology | ✅ Dijanjikan | ❌ Tidak ada | ❌ Tidak ada |
| Numerology | ✅ Dijanjikan | ⚠️ Page ada, client-side | ⚠️ Enum only |
| Human Design | ✅ Dijanjikan | ⚠️ Page ada, stub | ⚠️ Enum only |
| Ba Zi | ✅ Dijanjikan | ✅ Page + AI | ✅ Full endpoint |
| Primbon | ✅ Dijanjikan | ⚠️ Page ada, client-side | ⚠️ Enum only |
| Psychology | ✅ Dijanjikan | ⚠️ Page ada, stub | ⚠️ Enum only |
| Spiritual | ❌ Tidak sebut | ⚠️ Page ada | ❌ Tidak ada |
| AI Synthesis Core | ❌ Tidak sebut | ⚠️ Page ada | ❌ Tidak ada |
| Comprehensive Output | ❌ Tidak sebut | ⚠️ Page ada | ❌ Tidak ada |
| Community | ✅ Dijanjikan | ❌ Tidak ada | ❌ Tidak ada |
| Progress Tracking | ✅ Dijanjikan | ⚠️ Mood Charts page | ⚠️ Journal data only |
| Pricing/Payment | ❌ Tidak sebut | ✅ Page + Doku | ✅ Full integration |
| Profile Settings | ❌ Tidak sebut | ✅ Page ada | ⚠️ Partial schema |
| Journal AI Summary | ❌ Tidak sebut | ✅ Ada | ✅ Full endpoint |
| Deep Insights | ❌ Tidak sebut | ✅ Ada | ✅ Full endpoint |
6. Rekomendasi
Critical (Block Launch)
- Astrology endpoint — Figma janjikan, tidak ada di website maupun backend. Tambah
system: "astrology"+ prompt natal chart. - Human Design, Primbon, Psychology prompts — Website live punya halaman tapi tidak ada backend support. Buat prompt untuk masing-masing atau sembunyikan halaman sampai ready.
- AI Synthesis Core — Website live punya halaman tapi tidak ada backend. Definisikan apa fitur ini sebenarnya (mega-prompt? report aggregator?).
High Priority
- Mood And Growth Charts backend — Website live punya halaman tapi tidak ada time-series endpoint. Tambah aggregate query untuk mood/energy/stress over time.
- Profile Settings endpoint — Website live punya halaman tapi backend schema minimal (bio, birthDate, preferences). Tambah endpoint update profile.
- Pricing page content — Website live punya halaman tapi Figma tidak sebut. Sync pricing info dengan backend (DEEP_INSIGHTS_PRICE).
Medium Priority
- Community features — Figma janjikan, tidak ada di website. Scope besar, bisa ditunda.
- Marketing stats counters — Figma janjikan 50k+ users, 100k+ maps. Perlu analytics table.
- Rating/review system — Figma janjikan 4.9★. Perlu table testimonials.
Nice to Have
- User Journey onboarding — Website live punya halaman tapi mungkin pure frontend. Bisa di-enhance dengan backend-tracked onboarding progress.
- Spiritual page — Website live punya halaman tapi tidak ada di backend. Definisikan scope atau hapus.
- Comprehensive Output — Website live punya halaman tapi tidak ada di backend. Definisikan scope (PDF export? report builder?).
Notes
- Figma site = marketing landing page saja. Tidak menunjukkan UI form, payment flow, atau member area.
- Website live = functional app dengan 21 halaman. Banyak halaman mungkin stub/placeholder karena backend tidak support.
- Backend = solid untuk core flow (auth, destiny BaZi, journal, compatibility, payment). Kurang untuk analysis variety dan social features.
- AI Strategy = Saat ini semua AI melalui satu endpoint generik (
invokeDestiny) dengan prompt di frontend. Ini fleksibel tapi tidak scalable untuk 6+ systems. Pertimbangkan prompt templates di backend.