הצינור: מגולש בשלוש שפות ועד ליד ששמור במסד
האורח גולש בשפה שלו, רואה את העמדות בווידאו אמיתי, ומשאיר פנייה שעוברת כמה שכבות הגנה לפני שהיא נוחתת אצלי במייל.
ההחלטה שמארגנת את כל הפרויקט היא שזה לא אתר תדמית של דמו — זה עסק שאני מפעיל, וכל טענה בעמוד צריכה לעמוד מאחורי אירוע אמיתי. לכן אין באתר צילומי סטוק של עמדות צילום: ההדגמה של כל עמדה היא סינמגרף שהרכבתי ב-ffmpeg מתוך סטילס אמיתיים מאירועים, וקליפ סוגי האירועים בפתיח — שתים-עשרה שניות — נבנה בכלל בלי עורך וידאו: סצנה דטרמיניסטית שמרונדרת פריים אחר פריים ב-Chrome ללא ממשק, כך שכשמשהו בתוכן משתנה אני מריץ את הסקריפט מחדש במקום לפתוח פרויקט עריכה. את השפות פתרתי בלי ספריית i18n: מנגנון קטן שכתבתי בעצמי, שמחזיק עברית מימין לשמאל, רוסית ואנגלית באותו עמוד, נשלט מפרמטר ?lang= בכתובת — והמתג עצמו יושב בתוך ווידג'ט הנגישות שפיתחתי, שמכוון לתקן ישראלי 5568. גם שכבת הנתונים המובנים תלת-לשונית, מ-PhotographyBusiness ועד FAQPage. ובקצה השני נמצא הדבר שהכי אסור לי לאבד: פנייה מחתונה. הטופס עומד מאחורי Turnstile, שדה פיתיון ומגבלת קצב לפי IP; כל בקשה נחתמת בחתימה חד-פעמית שנרשמת ב-Vercel KV כך ששידור חוזר שלה נחסם; והליד נכתב ל-D1 כמקור האמת לפני שיוצא מייל. ההתראה היא רק התראה — הרשומה כבר שמורה.
פנייה מחתונה היא ליד יקר מדי בשביל טופס תמים. כל בקשה עוברת אימות אנושי, חסימת שידור חוזר ומגבלת קצב — ורק אז נכתבת למסד ויוצאת כמייל. הכתיבה קודמת להתראה: המייל הוא תזכורת, הרשומה היא האמת.
מה זה
AE Moments הוא עסק צילום האירועים שאני מפעיל: תחנת מגנטים שמצלמת, מדפיסה ומוסרת לכל אורח מגנט מוכן עוד במהלך האירוע, ולצידה עמדת מראה פרימיום עם תאורת סטודיו ואביזרי צילום. חתונות, בר ובת מצווה, בריתות, ימי הולדת ואירועי חברה.
האתר הוא עמוד אחד ב-www.ae-moments.co.il, בשלוש שפות מלאות — עברית מימין לשמאל, רוסית ואנגלית — עם גלריית מגנטים מאירועים אמיתיים, הדגמת וידאו לכל עמדה, שאלות ותשובות וטופס הזמנה שמבטיח חזרה עם הצעת מחיר. זה לא דמו של מוצר: זו הוויטרינה המסחרית של העסק.
הבעיה
אירוע ישראלי הוא כמעט תמיד רב-לשוני: בעלי השמחה מדברים עברית, חלק מהאורחים והמזמינים חיים ברוסית או באנגלית. אתר של מותג אירועים שמדבר שפה אחת מפסיד את מי שמחליט — ופתרון של תבנית תרגום גנרית שובר עמוד שעוצב מימין לשמאל.
הבעיה השנייה היא אמון: עמדת צילום היא מוצר פיזי, וצילומי סטוק משקרים. והבעיה השלישית היא הטופס — טופס פתוח באתר אירועים הוא מגנט לבוטים, וכל פנייה מזויפת שוחקת את ההבטחה המרכזית של העסק: תגובה מהירה לפנייה אמיתית.
מה בניתי
עמוד נחיתה תלת-לשוני עם מנגנון i18n שכתבתי בעצמי — בלי ספריית תרגום. השפה נשלטת מפרמטר ?lang= בכתובת, מוצהרת ב-hreflang לכל גרסה, והמתג יושב בתוך ווידג'ט הנגישות שפיתחתי, שמכוון לתקן ישראלי 5568 (WCAG 2.1 AA) — כך שהחלפת שפה והתאמות נגישות גרות באותו מקום אחד.
מערכת העיצוב מחזיקה את המותג: מבטא זהב שמפניה אחיד על מקצב של סקציות כהות ובהירות לסירוגין, כך שהעמוד נושם בין גלריה חגיגית כהה לכרטיסי חבילות בהירים. שני מסלולי השירות מוצגים בכרטיסים באותו עומק פירוט — קלאסי ופרימיום — וסטודיו תמונות ה-AI מוצג כתוספת לכל חבילה, לא כמסלול שלישי.
ואת ההדגמות בניתי מהחומרים של העסק עצמו: לכל עמדה סינמגרף שהורכב ב-ffmpeg מתוך סטילס אמיתיים, וקליפ סוגי האירועים בפתיח רונדר פריים אחר פריים דרך Chrome ללא ממשק — בלי עורך וידאו בכלל. כל התמונות באתר מוגשות כ-WebP בלבד, ומפת האתר כוללת גם את התמונות.
איך זה עובד
הווידאו הוא צינור דטרמיניסטי: סצנה שכל התנועה בה נגזרת ממשתנה זמן אחד, מרונדרת פריים אחר פריים בדפדפן ללא ממשק ונארזת לקובץ. כשמשתנה תוכן — מריצים מחדש וקובץ חדש יוצא, זהה בכל הרצה. אותו עיקרון בדיוק שאני מוכר ללקוחות עובד כאן בשביל העסק של עצמי.
צינור הלידים בנוי כשרשרת עם מקור אמת אחד: הטופס נשלח לנקודת קצה ב-Vercel שמאמתת Turnstile בצד השרת, בודקת שדה פיתיון, אוכפת מגבלת קצב לפי IP ורשימת מקורות מאושרת, וחוסמת שידור חוזר עם חתימת HMAC-SHA256 חד-פעמית שנרשמת ב-Vercel KV. משם הבקשה עוברת חתומה ל-Worker של Cloudflare, שכותב את הליד ל-D1 — ורק אחרי שהרשומה שמורה יוצא מייל דרך Resend. מעל כל אלה יושבים חוקי Edge Firewall שמסננים תעבורה אוטומטית עוד לפני שהפונקציה רצה.
הסטאק
החזית היא Vite 5 עם React 18 ו-TypeScript 5.6, עיצוב ב-Tailwind CSS 3.4, ותנועה ב-Framer Motion 11 לצד GSAP וגלילה חלקה של Lenis. הייתה בפרויקט גם שכבת three.js — והורדתי אותה במכוון: באתר שצריך להיטען מהר אצל לקוח בנייד באולם אירועים, תלת-ממד דקורטיבי לא מצדיק את המשקל שלו.
האתר מוגש מ-Vercel עם פונקציות באזור fra1. שכבת ה-SEO תלת-לשונית כמו העמוד עצמו: שבעה בלוקים של נתונים מובנים — ביניהם PhotographyBusiness, FAQPage עם שמונה שאלות ו-BreadcrumbList — לצד הצהרות hreflang לשלוש השפות.
התוצאה
האתר חי ב-www.ae-moments.co.il ומשרת את העסק בפועל: אורח שמגיע בעברית, ברוסית או באנגלית מקבל את אותו עמוד מלא, רואה את העמדות עצמן בווידאו אמיתי, ומשאיר פנייה שמגיעה אליי חתומה, שמורה במסד ומגובה במייל.
מה שהפרויקט הזה מוכיח הוא בדיוק מה שהוא מוכר: אותה רמת הנדסה שאני נותן ללקוחות עובדת גם כשהלקוח הוא אני. כל סינמגרף בעמוד צולם בעמדות האמיתיות, כל מגנט בגלריה הודפס באירוע אמיתי — והאתר עצמו הוא ההוכחה הטובה ביותר שהעסק מתייחס ברצינות לרגעים של אנשים אחרים.