00 · כריכהCREATOP

ספר המותג · OVERLAP 02

גוללים כרגיל — הספר זז הצידה, עמוד אחרי עמוד. בכל עמוד יש בדיקה שאפשר לנסות.

01 · תוכןCREATOP
02 · הבטחה ועקרוןחלק א · המותג

שתי צורות. אינסוף יחסים.

הבטחה ללקוח: אתרי פרימיום שמרגישים בטופ — דיוק מערכתי, לא קישוט. העיקרון: פחות צורות, יותר משמעות. הזהות היא לא הריבוע ולא הטבעת — היא היחס ביניהם.

נסו: היחס הוא הזהות
03 · שני אטומיםחלק ב · יסודות

ריבוע אחד. טבעת אחת.

MASS — ריבוע כתום אטום. ביצוע ומהירות. לעולם לא עיגול, לעולם לא חלול.

FRAME — טבעת כחולה דקה. שיפוט ודיוק. לעולם לא ממולאת, לעולם לא ריבוע.

בדיקה: מי מצויר מעל?
04 · המקור — בניית הסימןחלק ג · הלוגו

הטבעת על הפינה

  • מרכז הטבעת = בדיוק הפינה השמאלית-תחתונה של הריבוע
  • רדיוס r = 0.45S (עד אמצע הקו) · עובי קו = S/10.5
  • קוטר חיצוני = S — ¾ מהטבעת מחוץ לריבוע, רבע אחד חופף את הפינה
  • הטבעת לא מקיפה, לא ממורכזת ולא משתקפת לפינה אחרת
  • סדר ציור: ריבוע ואז טבעת
בדיקה: על איזו פינה יושבת הטבעת?
05 · לוקאפ ווורדמארקחלק ג · הלוגו

הסימן עומד כמו נקודה לפני השם

  • גובה אותיות (cap) = 144 יח׳ בקובץ המאסטר
  • גובה הסימן = 0.44 מגובה האותיות
  • מרווח ריבוע ← C = 0.2S
  • תחתית הריבוע = קו הבסיס של CREATOP
  • תגית בעברית, משקל דק, מיושרת לשני הקצוות
  • את השם לא מקלידים מחדש — רק קובץ המאסטר
נסו: הציגו את קווי הבנייה
06 · מרחב נקי וגודל מינימליחלק ג · הלוגו

אוויר סביב הסימן

  • מרחב נקי ללוקאפ = S (צלע הריבוע) מכל צד · לסימן בלבד = ½S
  • מינימום: סימן בלבד 16px · לוקאפ בלי תגית 80px רוחב · לוקאפ עם תגית 240px רוחב
בדיקה: גררו לגודל שבו תשתמשו
סימן בלבד
לוקאפ
120px — ✓ סימן · ✓ לוקאפ · · התגית יורדת מתחת ל־240px
07 · גרסאות מותרותחלק ג · הלוגו

שש גרסאות. אף אחת לא משנה את הצורות

לוקאפ ראשי + תגיתברירת מחדל: כותרת, פוטר, מסמכים
לוקאפ בלי תגיתמקומות צרים (≥80px)
סימן בלבדFavicon, אווטאר, חותמת (≥16px)
הפוך — על דיושם בשמנת, טבעת #3d44ff
מונוכרום דיורק כשאין צבע (הטבעה, חותמת)
מונוכרום שמנתעל צילום כהה — אזור שקט
בדיקה: על איזה רקע אתם מניחים את הלוגו?
08 · שימוש אסורחלק ג · הלוגו

מותר או אסור?

בדיקה 1 מתוך 14 · נכונות 0

הלוגו הוא ציור מאסטר אחד. בוחרים גרסה — לעולם לא משנים צורה, צבע או את היחס ביניהם.

09 · פלטה — לחצו על צבע כדי להעתיקצבע
10 · בדיקת צבעחלק ד · צבע

הדביקו צבע — הוא נבדק לפי המקום

העתיקו צבע מעמוד הפלטה (או מכל מקום) והדביקו לכל חלק בלוגו. כל חלק נבדק מול הצבע היחיד שמותר לו, לפי הרקע.

הכול לפי המותג
11 · מערכת הטיפוגרפיהחלק ה · טיפוגרפיה

משפחה אחת. שלושה משקלים.

Display
כותרות ראשיות וחתימות
שתי צורות.
TelAviv Brutalist Bold · 900
Heading
כותרות משנה
דיוק מערכתי
TelAviv Brutalist Bold · 700
Subtitle
כותרת משנית ב-Hero
אתרי פרימיום שמרגישים בטופ
TelAviv Brutalist Regular · 500
Subheading
תוויות קטנות ו-eyebrow
פרק 05 · טיפוגרפיה
TelAviv Brutalist Light · 300
Body
טקסט רץ
טקסט גוף נשאר ניטרלי ושקט כדי לתת למערכת התצוגה להוביל.
Heebo · 200
Nav · Button · Label
ניווט, כפתורים, תוויות
צור קשר · פרויקטים · בלוג
TelAviv Brutalist Light
Mono / Data
מידע טכני ומיקרו-קופי
#ff6600 · 0.45S · 980ms
TelAviv Brutalist Regular

מסה שחורה חזקה שיוצרת נוכחות · מבנה גיאומטרי באותה שפה של הריבוע והעיגול · אופי ישראלי ישיר · קונטרסט ברור מול טקסט הגוף.

12 · בוחן פונטחלק ה · טיפוגרפיה

כתבו כאן — בפונט המותג

גודל72px
בדיקה: לאיזה תפקיד מתאים המשקל שבחרתם?
Bold — כותרות וחתימות (Display / Heading). לא לטקסט רץ.
13 · 12 הסימניםחלק ו · מערכת הצורות

12 וריאציות של הלוגו

TRAIL · שובל

הריבוע חוזר בשובל; הטבעת על הפינה השמאלית-תחתונה של השובל כולו

בדיקה: איפה יושבת כל טבעת?
14 · דקדוק יחסיםחלק ו · מערכת הצורות

מה מותר לחבר למה

מותר

  • A ↔ B של אותו סימן (נפרדים → נצמדים)
  • מעבר ברייל מסימן לסימן, עם איפוס ל-Pose A
  • TRAIL → DEPTH LOCK בפתיחה

אסור

  • מורף lens → orbit → mirror → interlock
  • ערבוב צורות ישנות עם 12 הסימנים
  • Venn — שתי טבעות חופפות
  • עיגול כתום כ-Mass
בדיקה: המעבר הזה — מותר?מורף lens → orbit → mirror → interlock
15 · תיאטרון תנועהחלק ז · תנועה

תנועה אחת. חדה.

Ease: cubic-bezier(0.22, 1, 0.36, 1) · במה אחת בכל מסך · בלי ריחוף רך ובלי נחיל

נסו: בחרו משך והפעילו
16 · טעינה ראשוניתחלק ז · תנועה

כניסה ראשונה: 12 סימנים → המקור

DOUBLE LOCK
  • רצה במקביל לטעינה, לא לפניה. כשהאתר מוכן, קופצים ישר למקור ויוצאים
  • מקסימום 1.4 שניות. בכניסה חוזרת באותו ביקור היא לא מופיעה
  • SVG ו־transform בלבד: בלי תמונות, בלי ספריות
  • reduced-motion: רק המקור והוורדמארק, בלי רצף
בדיקה: מה קורה כשהאתר מהיר או איטי?
17 · טעינה בין עמודיםחלק ז · תנועה

הסימן אומר לאן. התנועה מתחלפת.

כל עמוד נטען עם הסימן שלו — וכל טעינה בתנועה אחרת מתוך שש, אף פעם לא אותה פעמיים ברצף.

בדיקה: לפי הטעינה — לאן אני הולך?

נכנסת מנקודת הלחיצה · 240ms · נשארת רק עד שהעמוד מוכן

18 · צפיפות וחשיפהחלק ח · ביישום

כמה צורות מותר בכל מקום

1חתימה
1תומך
2מיקרו
4סה״כ

רגע מותגי מרכזי אחד. מותר סימן תומך אחד בלבד.

בדיקה: הוסיפו סימנים לאזור — מתי זה יותר מדי?

מרחב בטוח סביב צורה: micro 8px · supporting 16px · signature 28px

19 · סמנטיקת אתרחלק ח · ביישום

לכל עמוד — סימן אחד

פרויקטים

חלון לעבודה · WINDOW

20 · קול ומיקרו־קופיחלק ח · ביישום

ברור. קצר. אנושי.

1 / 7 · איזה ניסוח בקול של CREATOP? · אחרי שליחת טופס
  • אומרים מה קרה ומה עכשיו — במשפט אחד או שניים
  • מילים של יומיום. בלי ז׳רגון של מעצבים ובלי פילוסופיה
  • חם ומקצועי: פונים ישירות, בלי סימני קריאה ובלי אימוג׳י
  • מדברים על מה שהלקוח מקבל, לא על עצמנו
21 · כן / לאחלק ט · סיכום

כל החוקים בעמוד אחד

כןלא
Mass ריבוע כתום אטוםעיגול כתום / כחול מלא כ-Mass
Frame טבעת stroke מעל, על הפינה השמאלית-תחתונהטבעת מתחת / Venn / טבעת ממורכזת
במה אחת A↔B5× setInterval — נחיל
Ease חד / stepsריחוף רך
Pose B ב-reduced-motionהתעלמות מ-prefers-reduced-motion
המקור ראשון · סימן נגזר אחד לסקשן לכל היותרשני סימנים זזים באותו מסך
שכבת היד = הטבעת האינטראקטיבית; אז הסימנים לא זזיםטבעת-יד וסימן מונפש באותו רגע
טעינה: הסימן של עמוד היעד, מנקודת הלחיצהספינר / fade כללי
מיקרו־קופי: ברור, קצר וחםז׳רגון, פילוסופיה או סימני קריאה
בדיקה: איזה כתום הוא Mass?
22 · סיוםחלק ט · סיכום

חתימה שאפשר לזהות גם בלי הלוגו.

← חזרה לתיק העבודות
CREATOP00 / 22