Seline Analytics
שולחן אנליטי שקט על נייר חם
סלין מוצגת על רקע אבן חמה (#fafaf9) עם נגיעת כחולה עזת אחת - כל שאר הצבעים ניטרליים ונלקחו מפלטת הצבעים של אבן Tailwind. הכותרות מוצגות בגופן סאנס-סריף גיאומטרי מעוצב בהתאמה אישית (roobert) עם משקל של 400 ורווח צר בין אותיות שליליות, מה שמעניק לטקסט ביטחון נינוח, כמעט לחישה, בניגוד לסגנון ה-SaaS הרועש האופייני. משטחי ממשק המשתמש הם כרטיסים לבנים שטוחים, המרחפים מעל הרקע החם עם טשטוש יחיד ורך של 16 פיקסלים; גבולות נוצרים עם קווים דקים בגוון אבן של 1 פיקסלים, המשמשים בנדיבות כאלמנט מבני ראשי במקום מחיצות או פאנלים כבדים. הפריסה נושמת: תוכן ברוחב מלא המרוכז בקצב אנכי נדיב, עם פקדים אינטראקטיביים בצורת גלולה, איור קמע לאישיות וצילומי מסך של לוח המחוונים כהוכחת מוצר. הרושם הכללי הוא אנליטי מבחינה עריכתית: רגוע, מונוכרום, בטוח בעצמו, כאשר הקריאה לפעולה הכחולה היא האלמנט הבולט ביותר בדף הודות לאיסוק מכוון של כל השאר.
הדף ברוחב מקסימלי, מרוכז בכ-1200 פיקסלים עם שפע של רווח אנכי. הגיבור הוא גוש טקסט בן שתי שורות, מיושר לשמאל, עם ביטוי יחיד מודגש ("פשוט ויעיל") בכחול, ואחריו שורה עם שתי קריאות לפעולה (גלולה כחולה + גלולת רפאים), לאחר מכן שורה של לוגואי שותפים בגווני אפור, לאחר מכן שורה של דירוגי אמון, ולאחר מכן תצוגה מקדימה צפה של לוח מחוונים ברוחב מלא, חופפת מעט את הקטע הבא. מתחת לקפל נמצאות שורות מתחלפות של המלצות ברשת בת עמודה אחת, ולאחר מכן קטעים ברוחב מלא עם תיאורי תכונות, טקסט מיושר לשמאל ואלמנטים חזותיים של המוצר ממורכזים. הניווט הוא סרגל עליון מינימליסטי - לוגו משמאל, קישורי ניווט מרוכזים, התחברות + קריאה לפעולה כחולה מימין - עם אשכול צף של אווטארים באמצע הניווט המשמש כאימות זהות. הרווחים בין הקטעים רחבים (96 פיקסלים) כדי ליצור קצב עריכה ולא ערבוביה צפופה של מידע.
השפה החזותית נשלטת על ידי צילומי מסך של ממשק המשתמש של המוצר - התצוגה המקדימה של לוח המחוונים היא תמונה המוצגת עם מסנן ניגודיות בגווני אפור (1) (0.94), אשר משתיק את צבעי הנתונים לגוון מונוכרום. דמות האדם היחידה היא מדבקת קמע ליניארית (דמות עם ברדס), מצוירת בסגנון SVG עם קווי מתאר בלבד, הממוקמת פעם אחת בכל מקטע כקונטרהפונקט שובב לתוכן האנליטי, עם צל רך ליצירת אפקט עומק דמוי מדבקה. לוגו המותג והגליפים הם ניצוצות/להבות שחורות קטנות. אין תמונות - אין צילומי לייף סטייל, אין תמונות צוות, אין תמונות סביבתיות. האובייקט (לוח המחוונים) הוא הדמות הראשית. כל הסמלים הדקורטיביים הם בסגנון קווי מתאר של 1px ב-#0c0a09 או #3ba6f1, לעולם לא מולאו.
לוּחַ הַצְבָעִים
מותג
- Cyan Signal
#3ba6f1— הקריאה לפעולה העיקרית, קישורים פעילים וקווי המתאר של אייקוני המותג הם הדגשות הצבע היחידות בדף, ומשמשות במשורה כדי למשוך תשומת לב לפעולה. - Cyan Edge
#3398e1— כחול משמש להדגשת קווי מתאר של פעולות, תוויות קישורים ואלמנטים אינטראקטיביים. אין להשתמש בו כצבע העיקרי עבור קריאות לפעולה.
נֵטרָלִי
- Ink Black
#0c0a09— כותרות ראשיות, גוף הטקסט המודגש והסמלים המבעים מופיעים בצבע חם, כמעט שחור. - Stone Canvas
#fafaf9— רקע הדף הוא גוון חם וקרמי שמרגיש כמו נייר ולא כמו לבן של מסך. - Pure White
#ffffff— משטחי מפה, פאנלים בולטים ומילוי שדות קלט הם שטוחים וללא צל כברירת מחדל. - Stone Border
#e8e6e5— גבולות דקים על כרטיסים, ניווט ושדות קלט הם האלמנט המבני העיקרי, לא מפרידים. - Stone Muted
#d6d3d1— מסגרות נוספות, גווני רקע עדינים, חוצצים דקורטיביים. - Ash Gray
#a8a29e— טקסט עזרה, קווי מתאר של סמלים, מצבי מושבתים - קריא אך לא פעיל.
טיפוגרפיה
מ-10 עד 52 פיקסלים · 5 צעדים
- Roobert — תַחֲלִיף: Inter Tight or Satoshi · קווי מתאר 400, 500 · גופן הכותרות ופריסת הטקסט הוא סאנס-סריף גיאומטרי ייחודי עם ריווח מינימלי שלילי בין אותיות (-0.025em ב-32 פיקסלים, -0.021em ב-52 פיקסלים). משקל 400 x 52 פיקסלים הוא סימן ההיכר של הגופן: לא שגרתי, עדין, אך סמכותי, אך גם מאופק. כותרות תופסות את מקומן מבלי להיות שתלטניות.
- Inter — תַחֲלִיף: Inter · קווי מתאר 400, 500, 600 · הגופן העיקרי לגוף הטקסט, ניווט, ממשק משתמש וכותרות הוא גופן ניטרלי ואוניברסלי לכל הטקסט שמחוץ למסך. גודל הטקסט השולט בגוף הטקסט הוא 14 פיקסלים עם משקל של 400 וריווח שורות של 1.64 (תדירות 1174). ריווח אותיות חיובי (0.004 אלפא) בגדלים קטנים מבטיח קריאות של ממשק משתמש צפוף.
אינטרוולים וצורה
| מַטָרָה | מַשְׁמָעוּת |
|---|---|
| צְפִיפוּת | מְרוּוָח |
| שלב בסיסי | 8px |
| רדיוס הכפתור | 9999px |
| רדיוס הכרטיס | 10px |
| צללים | צללים רכים |
| בין סעיפים | 96px |
| רוחב העמוד | 1200px |
בינה מלאכותית תבנה את אתר האינטרנט שלך בסגנון Seline Analytics ותמלא אותו
- מלאו מוצרים ופוסטים דרך הקישור - Instagram, TikTok, Facebook.
- העברת תוכן מהאתר הישן שלך - רק ציין את הכתובת.
- עיצוב מודרני על מנוע הפיתוח הטוב ביותר: React ( Next.js) עם רינדור שרת ואופטימיזציה של קידום אתרים (SEO) ישירות מהקופסה.
- אופטימיזציה אוטומטית לחלוטין של SEO עבור תוצאות חיפוש והמלצות לרשתות עצביות.
סגנונות דומים
- Mollie — דלפק קשמיר, ספר חשבונות כהה. השאירו שטח לבן נרחב לעיצוב עריכה סביב הטקסט השחור, ולאחר מכן חיזקו נקודות הקשורות למוצר בעזרת קרמים חמים, גווני אספרסו חומים ותמונות מגע של אמצעי תשלום בפועל.
- Kagi — חדר קריאה נפרד. צרו חלל לבן פתוח סביב טקסט גרפיט מודגש, תוך שימוש בנגיעות סגולות עדינות ומשטחי פסטל חמים כדי לשבור את השלווה.
- Milanote — Milanote הוא סטודיו יצירתי ייעודי. צרו דפים בסגנון גלריה עריכה באמצעות לוחות ויזואליים צפים: קירות כהים ממוסגרים, שטח תצוגה לבן וצילומי מסך שנראים כמו אובייקטים אמיתיים עם עומק רך.
- Co2 — אטלס אקלימי באור חורף. צרו דפים כמו נוף של מסמך אווירי, שבו כותרות סריפיות, נתונים מקודדים לפי קטגוריות ותמונות קפואות מדגישות שוליים לבנים רחבים.
- GitButler — טורקיז בסוף הטקסט. שילוב של כותרות סריף בעלות ניגודיות גבוהה עם רשתות טכניות עדינות, משטחי גרפיט חמים וגימור טורקיז דיסקרטי.
- ElevenLabs — חיבור מצולם בגווני קרם חמים עם כותרות עדינות. מחברת בסגנון באוהאוס - נייר בצבע קליפת ביצה, דיו שחור, וגימור סגול וכתום יחיד לתצוגת מוצרים.
- Awesomic — רשת אבץ עריכתית עם סימני פיסוק כתומים המזכירים קונפטי
- Monad — כתב עת טכני עריכה על קלף חם
- Dub — לוח הבקרה של נייר האורז המט של לינק
- Notion — מחברת נייר חמה בשמש הצהריים
- Anthropic — כתב עת מדעי על קלף חם - משטחים בצבע שנהב רגועים, כותרות עריכה מסומנות, והדגשת חרס יחידה המופיעה רק כאשר נדרשת פעולה.
- Calendly — דיו כחול כהה על שיש קר