🗺 خريطة القمع الكاملة

Khuzama Ceram — Funnel Mind Map — v2.0

React + ViteTailwind CSSFramer MotionBase44 SDKRTL (Cairo font)Mobile-first

🔁 مسار القمع — Conversion Flow

/ — TrustIntro

VSL + Trust

↓

/qualification — Quiz (8 خطوات)

Progressive tracking

↓

/recommendations — النتيجة

Top 1 product match

↓

/product/:slug — صفحة المنتج

Order form + WhatsApp

↓

/thank-you — شكرًا

Order confirmation

📄 الصفحات — Pages

Page 1 — TrustIntro

/▼

Page 2 — Quiz (8 steps)

/qualification▼

Page 3 — Recommendations

/recommendations▼

Page 4 — ProductPage

/product/:slug▼

Page 5 — ThankYou

/thank-you▼

SinkGuide

/guide▼

AllProducts

/products▼

ProductAdmin

/admin/products▼

🧩 خطوات الاستبيان — Quiz Steps (8 steps)

#	المفتاح	السؤال	النوع	الخيارات	التقدم	البيانات المحفوظة	ملاحظات
1	`nano_tech`	تقنية Nano؟	NanoStep	نعم — مع Nano / لا — بدون Nano	auto	nano_tech	—
2	`number_of_bowls`	حوض واحد أو اثنين؟	BowlVisualStep	حوض واحد / حوضين	auto	number_of_bowls	—
3	`color_preference`	واش اللون اللي تفضلو؟	ColorStep	Noir (أسود) / Chromé (فضي) / ساعدني	auto	color_preference	—
4	`kitchen_size`	حجم المطبخ + المقاس	KitchenSizeStep	صغير / عادي / واسع / ما نعرفش	auto after dim	kitchen_size + kitchen_dimension	Expands dimension picker on size select
5	`pain_points`	واش يقلقك في الـ évier؟	EmojiGridStep	Multi-select × 8	manual Next	pain_points	min 1
6	`desires`	واش تحب تلقى؟	EmojiGridStep	Multi-select × 8	manual Next	desires	min 1
7	`budget_tier`	واش هي ميزانيتك؟	BudgetStep	< 15k DA / 15–20k DA / > 20k DA	auto	budget_tier	—
8	`contact`	الاسم + الهاتف + الولاية	ContactStep	Text inputs + Wilaya dropdown	Submit	Lead entity created	name + phone + wilaya required

UX الخاصة بـ KitchenSizeStep (الجديدة):

• المستخدم يختار الحجم → يظهر picker للمقاسات المتوفرة من قاعدة البيانات
• "ما نعرفش المقاس بالضبط" → يحفظ unknown_small / unknown_medium / unknown_large
• "نبدل حجم الكوزينة" → يعود لاختيار الحجم (collapse)
• حقلان محفوظان: kitchen_size + kitchen_dimension

🤖 محرك التوصيات — Recommendation Engine

Budget filter

low ≤14999 / mid 15k–20k / high ≥20k

Basin filter

Single vs double from number_of_bowls

Color filter

Noir or Chrome from color_preference

Dimension (exact)

If kitchen_dimension = e.g. '60x45' → filter products by exact dim

Size fallback

If no exact dim: small → size=small / medium → small+medium / large → all

Scoring

Pain points + desires match nano/basin/size/piano type → score

Sort

Highest score wins. Tie-break: higher price

Fallback chain

Empty pool → relax size → relax color → relax budget

⭐ منطق kitchen_dimension الجديد:

إذا المستخدم اختار مقاسًا دقيقًا (مثل 60x45) → نفلتر المنتجات بالمقاس الدقيق أولًا ونتجاهل kitchen_size. هذا يعطي نتائج أكثر دقة.

🗄 قاعدة البيانات — Entities

Lead Entity

▸name

▸phone

▸wilaya

▸commune

▸sink_size

▸color_preference

▸number_of_bowls

▸priorities

▸reasons

▸nano_tech

▸wants_accessories

▸ready_to_buy

▸status (new/contacted/converted/lost)

Product Entity

▸product_name

▸model_code

▸slug

▸brand

▸category

▸price

▸old_price

▸colors (JSON)

▸dimensions

▸number_of_bowls

▸nano (bool)

▸material

▸warranty

▸installation_type

▸main_product_image

▸gallery_images

▸hero_headline

▸benefits_section (JSON)

▸faq_section (JSON)

▸is_active

▸recommendation_priority

ℹ المنتجات في صفحة Recommendations تأتي من PRODUCT_DB المحلي في lib/recommendationEngine.js — وليس من قاعدة البيانات مباشرة. المنتجات في /product/:slug تأتي من Product entity.

🎨 نظام الألوان والـ UI

Brand Purple

#382D72

Primary, headings, CTAs, progress bar

Gold CTA

#D4AF37

Page 1 main CTAs only — premium feel

Off-white BG

#FBFAF7

Quiz background

Body text dark

#3D3D3D

All readable body text

Body dark blue

#1A1A2E

Headings, strong text

Secondary text

#5A5A5A

Sublabels, helper text (readable)

Accent blue

#899ED7

Borders, subtle accents

Light BG card

#F3F1FA

Selected cards, expanded sections

Font

Cairo (Google Fonts)

All Arabic text — RTL

📊 التتبع — Tracking & Analytics

timestamp_first_interaction

أول تفاعل مع القمع — useProgressiveTracking

Q1–Q7 answers

كل خطوة في الاستبيان — Progressive tracking (Lead entity)

form_completed=yes

Submit الاستبيان — trackNow

suggested_product_1

صفحة Recommendations — trackNow

fbq('Lead')

Submit الطلب في ProductPage — OrderModal

sessionStorage quiz_completed

وصول /recommendations — Recommendations page

⚠ Meta Pixel / TikTok / Google Ads — لم يتم تركيبهم كامل بعد. fbq موجود فقط في OrderModal. يجب إضافة Pixel ID وتركيب CAPI لتتبع أفضل.

⚠ نقاط التطوير والمخاطر

🔴 عاليPRODUCT_DB في recommendationEngine.js محلي ومنفصل عن Product entity → يجب مزامنتهم أو دمجهم

🔴 عاليلا يوجد تتبع Pixel كامل — Meta CAPI غير مركّب

🟡 متوسطkitchen_dimension غير محفوظ في Lead entity حاليًا (يُضاف في progressive tracking فقط)

🟡 متوسطالـ Recommendations تعتمد على location.state — إذا المستخدم refresh الصفحة تضيع البيانات

🟡 متوسطCTA في FinalCTA لم يتم تحديثه بالـ Gold color بعد

🟢 منخفضExit intent يعمل على desktop فقط (mouseleave top)

🟢 منخفضبعض المنتجات في PRODUCT_DB ليس لها slug → لن تعمل /product/:slug

Khuzama Ceram Funnel Map — Generated 2026 — /admin/funnel-map