מערכת ההפעלה לתחום הסולארי, שעוצבה מחדש כדי להתחיל בבעיה ולהוביל למוצר — ברמת גימור של Palantir עבור אנרגיה סולארית תעשייתית.
לקוח
סנסהוק
תעשייה
אקלים-טק / תוכנה ארגונית (SaaS)
שירותים
עיצוב אתרים, פיתוח ב-Framer, מערכות עיצוב (Design Systems), ארכיטקטורת CMS, עיצוב בתנועה (Motion Design), קידום אתרים (SEO)
ארסנל טכנולוגי
Framer, Inter Display, Phosphor Icons, רקע וידאו מותאם אישית, אנימציות מבוססות גלילה
שנה
2026
סטודיו AGR עיצב מחדש את SenseHawk, מערכת ההפעלה לניהול אנרגיה סולארית המנהלת מעל 200 ג׳יגה-וואט (GW) – תוך מעבר מגישה ממוקדת-פיצ׳רים לגישה ממוקדת-פתרונות, בבנייה מלאה ב-Framer.
SenseHawk בונה את מערכת ההפעלה עבור תעשיית האנרגיה הסולארית. פלטפורמת ה-SaaS מבוססת המפה שלה מנהלת למעלה מ-200 GW של פרויקטים סולאריים ביותר מ-600 אתרים ברחבי העולם, ומחליפה מערכות ERP מיושנות כמו SAP ו-Oracle בסביבת עבודה אחת אחידה.
האתר הקיים שלהם התמקד תחילה בתכונות (feature-first). הוא הציג יכולות מבלי לספר סיפור. הפלטפורמה מציעה פתרון מורכב ומקיף באמת - החל מניהול קרקעות, דרך אנליטיקה מבוססת רחפנים ותהליכי עבודה ללא קוד (no-code), ועד לניטור בנייה - אך דבר מזה לא בא לידי ביטוי, והעמוד נראה כמו עוד תבנית SaaS ארגונית סטנדרטית.
המטרה: מעבר ממיקוד בתכונות למיקוד בפתרון בעיות. להוביל עם נקודות הכאב - תהליכים ידניים, נתונים מבודדים, וכאוס של גיליונות אקסל - ואז לחשוף את הפתרון. ליצור תחושה של "Palantir פוגשת את Vercel": ליטוש ארגוני פרימיום המיושם על סולאר תעשייתי. לוח הזמנים עמד על 4 שבועות, מלוח השראה (moodboard) ועד למסירה מלאה, כולל מערכת ניהול תוכן (CMS) וספריית רכיבים שבה המפתח הפנימי יוכל להשתמש כדי לבנות את שאר העמודים באופן עצמאי.
להבין את העסק
חברת SenseHawk פונה לשני קהלי יעד שונים לחלוטין: מנהלים ומשקיעים המצפים לדאשבורדים ודיווחים ברמת מאקרו, ומנגד – קבלנים בשטח הזקוקים לאיסוף נתונים במובייל ומעקב אחר התקדמות הפרויקט בזמן אמת. דף הבית היה חייב לדבר אל שני הקהלים במקביל, מבלי למהול או להחליש את המסר המרכזי.
למדנו לעומק את מצגת המשקיעים (SDP), את חומרי ה-BI של TaskMapper לניהול בנייה חכם, ואת ברושור אנליטיקת הרחפנים של Therm. המטרה הייתה לזקק את המיצוב האמיתי: לא עוד כלי לניהול פרויקטים, אלא מקור המידע האמין והאחיד (Single Source of Truth) לכל שלב במחזור החיים של פרויקט סולארי.
ארכיטקטורת מידע
בנינו את מבנה דף הבית כסיפור חווייתי (נרטיב) ולא כרשימת פיצ'רים יבשה: אזור Hero עם הצהרה נועזת ורקע וידאו; חלוקת בעיה/פתרון שמגדירה בבירור את נקודות הכאב; סקירת פלטפורמה שמציגה את המערכת המאוחדת; מסלול מחזור החיים הסולארי – משלב טרום-הבנייה ועד לסוף חיי הפרויקט; צלילת עומק למוצרים המובילים TaskMapper, Therm ו-NaaviX; הצעות ערך מותאמות לפי תפקידים; מרכז אינטגרציות המציג חיבור מלא לאקוסיסטם; אבטחת מידע ותאימות לארגוני אנטרפרייז; וכמובן הוכחה חברתית ונתונים סטטיסטיים. כל חלק נשען על קודמו – כך שברגע שהמבקרים מגיעים לחלק של המוצרים, הם כבר מבינים בדיוק למה הם צריכים את SenseHawk.
סיפור חזותי שמתחיל בבעיה
אזור ה-Hero נפתח עם נתון בולט על רקע סרטון סינמטי של פעילות אנרגיה סולארית. שכבת הכיסוי (overlay) מעודנת במכוון כדי לתת לסרטון להוביל בראש. מתחת לאזור ה-Hero, קרוסלת צילומי מסך אמיתיים של המוצר בתוך מסגרת לפטופ מעניקה למבקרים תחושה מיידית של הפלטפורמה, ישירות מדף הבית.
עיצוב ישיר בתוך Framer
ללא שלב העברת קבצים מ-Figma. כל עמוד תוכנן ונבנה ישירות בתוך Framer בשלוש נקודות שבירה (breakpoints) במקביל – דסקטופ (1200px), טאבלט (810px) ונייד (390px). התנהגות רספונסיבית אמיתית מהיום הראשון, במקום הנחות עבודה שנשברות במהלך הפיתוח.
מערכת רכיבים מותאמת אישית (Custom Component System)
בנינו מערכת עיצוב (Design System) שלמה מאפס. טיפוגרפיה המבוססת על Inter Display לאורך 14 סגנונות מוגדרים מראש (presets). 13 אסימוני עיצוב (tokens), כולל גוון המותג הייחודי Eco Lime. למעלה מ-20 רכיבים הניתנים לשימוש חוזר: תפריט ניווט עם 4 גרסאות, כפתורים עם 7 גרסאות, תגיות אזורים, מוני נתונים, כפתורי טאבים, כרטיסי תכונות, כרטיסי בלוג, שאלות נפוצות, לוגואים של אינטגרציות וקישורים חברתיים. הכל מוגדר בשמות, בטוקנים ובספריות רכיבים, כך שהמפתח שלכם יוכל לבנות עמודים חדשים בקלות רבה מבלי לגעת בליבת מערכת העיצוב.
ארכיטקטורה מובנית ל-Framer
כל אלמנט משתמש במערכות הגריד וה-Stacks של Framer, ללא מעקפים של מיקום אבסולוטי (absolute positioning). רכיב הניווט כולל 4 וריאציות עם מעברים חלקים בין מצבים – תפריט המובייל נפתח בצורה אנכית וחלקית (inline) במקום לכסות את התוכן במערך צף, כאשר מחווני התפריט הנפתח משתמשים בסט האייקונים של Phosphor לשמירה על אחידות.
אזורים אינטראקטיביים
אזור מחזור חיי האנרגיה הסולארית משתמש בממשק כרטיסיות עם 10 מצבים שונים, כאשר כל אחד מציג שלב אחר במסע הפרויקט בליווי צילומי מסך אמיתיים מתוך המוצר. אזור הפלטפורמה מציג סליידר אינטראקטיבי להשוואה בין תצוגות של "לפני" ו-"אחרי". הנתונים הסטטיסטיים מונפשים באמצעות מוני מספרים המופעלים בגלילה (scroll-triggered). מרכז האינטגרציות מציג את לוגו השותפים בפריסה מעגלית (radial layout).
ארכיטקטורת CMS
עמודי הבלוג והמידע המשפטי מבוססים על אוספי ה-CMS של Framer, הכוללים תיוג קטגוריות, תבניות עמודי תוכן עם ניתוב (routing) נכון, וכרטיסיות של קטגוריות בלוג לסינון נוח. הלקוח יכול לפרסם פוסטים חדשים ועמודים משפטיים ללא צורך בשום עבודת עיצוב נוספת.
SEO ונגישות
לכל עמוד יש כותרות ותיאורי מטא (meta titles & descriptions) ייחודיים. תמונות מפתח כוללות טקסט חלופי (alt text) תיאורי. נעשה שימוש בתגיות HTML סמנטיות לכל אורך האתר – header, nav, section, article – המעניקות למנועי החיפוש מבנה מסמך ברור. רקעי וידאו משתמשים בפורמט WebM ממוטב עם טעינה עצלה (lazy loading), ואנימציות המופעלות בגלילה משתמשות בטכנולוגיית intersection observers עם סף הגדרה גמיש.
נמסר בזמן. ארבעה שבועות, מבעיטת הפתיחה ועד למסירה. שבוע 1: לוח השראה (moodboard) וכיוון ויזואלי. שבועות 2 עד 3: עיצוב ובניית דף הבית בכל נקודות השבירה (breakpoints). שבוע 4: מערכת ניהול תוכן (CMS), תיעוד ספריית רכיבים ובקרת איכות (QA).
מה שהושק. דף בית בן 13 אזורים הפרוס על פני 3 נקודות שבירה רספונסיביות; מערכת עיצוב (Design System) עם 14 הגדרות טיפוגרפיה מוכנות מראש, 13 אסימוני צבע (color tokens) ומעל ל-20 רכיבים לשימוש חוזר; אוספי CMS עבור הבלוג והמסמכים המשפטיים; דפי צור קשר ו-404. הכל בנוי ומובנה כך שהצוות הפנימי שלכם יוכל לשכפל ולהתרחב לדפי מוצר ופתרונות ללא תלות במעצבים.
בנוי למסירה חלקה. המפתח קיבל פרויקט Framer מאורגן לחלוטין: שכבות עם שמות ברורים, רכיבים מקושרים ואסימונים מתועדים. כעת, יצירת דפים חדשים היא פשוט עניין של שימוש ברכיבים קיימים והזנת תוכן, במקום לבנות הכל מחדש.
13
איזורים שנבנו
+20
רכיבים
4 שבועות
משלוח
