דף נחיתה ל-LYNKO: עיצוב, תנועה וסיפור מוצר בגלילה
דף נחיתה שיווקידף שיווקי בעברית מלאה שמספר את הסיפור של המוצר תוך כדי גלילה.
פרויקט בפני עצמו
תכננתי ובניתי את דף הנחיתה של LYNKO כפרויקט עיצוב ופיתוח נפרד, ולא כעוד עמוד בתוך המוצר. יש בו הירו מונפש, סקשן שמספר את סיפור המוצר בזמן הגלילה, ומערכת עיצוב שנגזרת מהמוצר עצמו.
מה יש בפנים
הירו שמרגיש חי
כותרת שנכנסת מילה אחרי מילה, אור שעוקב אחרי העכבר ומוקאפ עם הטיה תלת-ממדית עדינה כשעוברים עליו. הרושם הראשון קובע את הטון לכל הדף.
סיפור שנגלל
סקשן נעוץ שבו ארבעה מסכים של המוצר מתחלפים בזום ובמעבר הדרגתי תוך כדי גלילה, עם גרסה נפרדת שנבנתה לטלפון.
שפה עיצובית אחת
כל צבע, גופן ורדיוס מגיעים מאותם טוקנים, כך שהמוצר ודף הנחיתה שלו מרגישים כמו מקום אחד.
RTL מקצה לקצה
יותר מיישור טקסט לימין. גם הבעיות הקטנות של טקסט דו-כיווני, כמו מספרים וסימנים בתוך משפט בעברית, שבהן הרבה אתרים מתורגמים נשברים.
מהיר ונעים לכולם
כל אנימציה מכבדת את prefers-reduced-motion, ואין אפקטים מוגזמים על כפתורים. התנועה נמצאת שם כדי לשרת את התוכן.
הצצה טכנית
- Next.js, Tailwind CSS ו-Framer Motion, על אותה מערכת עיצוב כמו המוצר עצמו.
- אנימציות שמונעות מהגלילה עם useScroll ו-useTransform, כולל איתור ותיקון של באג אמיתי ב-Framer Motion שגרם לסצנה הראשונה להתנהג לא נכון.
רוצים דף נחיתה כזה למוצר שלכם?
יש לכם מוצר טוב ודף שיווקי שעוד לא עושה לו צדק? אשמח לדבר. אני בונה דפי נחיתה שמספרים סיפור, במקום לפרט רשימת פיצ'רים.
בואו נדבר