🔤 Image to Hebrew Font + ✏️ Font Editor

סט כלים מלא ליצירה ועריכה של פונטים עבריים

🌐 אתר הפרויקט

שני כלים משלימים:

1. Font Generator — יוצר פונט TTF מתמונת AI: זיהוי אוטומטי של אותיות, שיוך, כוונון ויצירת קובץ TTF
2. Font Editor — עורך ויזואלי לקבצי TTF: עריכת נקודות, ציור קונטורים, ייבוא SVG, ייצוא WOFF/WOFF2, עריכת kerning ותצוגה מקדימה חיה

---

🚀 התקנה והפעלה

דרישות מוקדמות

• Python 3.8 ומעלה
• Windows (נבדק על Windows 10/11)

התקנה

# 1. שכפול הריפו
git clone https://github.com/UberStorm/Image-To-Hebrew-Font-Generator.git
cd Image-To-Hebrew-Font-Generator

# 2. התקנה (יוצר venv אוטומטית ומתקין חבילות)
install.bat

הפעלה

# יוצר פונטים מתמונה — נפתח ב-http://127.0.0.1:5000
run.bat

# עורך פונטים ויזואלי — נפתח ב-http://127.0.0.1:5001
run_fonteditor.bat

ניתן להריץ את שניהם במקביל.

---

🔤 Font Generator — יצירת פונט מתמונה

📸 צילומי מסך

✨ תכונות

זיהוי וסקירה

• זיהוי אוטומטי של אותיות — מעלים תמונה והמערכת מזהה את כל הצורות בנפרד
• רמת הפרדה מתכוונת (0–5) — בקרה על עוצמת ההפרדה בין אותיות צפופות
• סקירת זיהויים ויזואלית — תצוגת Canvas עם מלבנים; גרירה להוספת זיהוי חסר, לחיצה למחיקה
• זיהוי מחדש — כפתור re-detect עם שליטה על רמת ההפרדה ישירות מהסקירה

שיוך אותיות

• שיוך במקלדת — לחיצה על כרטיס + הקלדת אות = שיוך מיידי עם מעבר אוטומטי
• מיזוג ופיצול — מיזוג צורות שזוהו בנפרד (כמו נקודה + גוף של ! או ?) ופיצול צורות מורכבות

תצוגה מקדימה וכוונון

• תצוגה מקדימה חיה — הקלדת טקסט ותצוגה מיידית של איך הפונט ייראה
• כוונון לכל אות — גודל (Scale), הזזה אנכית/אופקית, ריווח (Spacing)
• כוונון גלובלי — החלת הגדרות על כל האותיות בלחיצה אחת
• גדלים פרופורציונליים — אותיות קטנות נשארות קטנות יחסית לגדולות, כמו בפונט אמיתי

יצירת פונט

• עקומות Bézier חלקות — עקומות קוואדרטיות לתוצאה מקצועית
• תמיכה בחורים — אותיות כמו ב, ד, ה, ם, ס שומרות על החללים הפנימיים
• אותיות סופיות עם descenders — ך, ן, ף, ץ, ק — ירידה אוטומטית מתחת לקו הבסיס
• תווים נפוצים מ-Arial — ~46 תווים (ספרות, פיסוק, סוגריים) מוזרקים אוטומטית
• מטא-דאטה — שם יוצר, תיאור, גרסה, רישיון, אתר (אופציונלי)

שמירה וטעינת פרויקט

• ייצוא/ייבוא פרויקט (.hfm) — שמירת כל מצב העבודה לקובץ עצמאי: תמונה, זיהויים, שיוכים, כוונונים, מטא-דאטה

📖 שלבי עבודה

שלב	תיאור
1 — העלאת תמונה	העלאת תמונה עם אותיות (או טעינת פרויקט .hfm). כוונון רמת הפרדה (0–5)
2א — סקירת זיהויים	מלבנים צבעוניים על כל צורה. גרירה להוספה, לחיצה למחיקה, זיהוי מחדש
2ב — שיוך אותיות	לחיצה על כרטיס + הקלדת אות. מיזוג/פיצול לפי הצורך
3 — תצוגה מקדימה	הקלדת טקסט, כוונון גודל/הזזה/ריווח לכל אות, "החל על הכל"
4 — יצירת פונט	בחירת שם, מטא-דאטה, יצירה. הקובץ נשמר ב-fonts_output/. ייצוא פרויקט

---

✏️ Font Editor — עורך פונטים ויזואלי

עורך ויזואלי לקבצי TTF — עריכת נקודות וקונטורים ברמת הגליף, עם תצוגה מקדימה חיה.

📸 צילום מסך

✨ תכונות

עריכה בסיסית

• טעינת פונט — מרשימת פונטים קיימים או העלאת TTF
• תצוגת גליפים — רשת עם חיפוש לפי תו / שם
• עריכת נקודות — גרירה, חצים (Shift=1px, רגיל=10px), שינוי רוחב
• שמירה / שמירה בשם — Ctrl+S או כפתור
• תצוגה מקדימה חיה — סרגל תצוגה מקדימה בתחתית עם שליטה על גודל

כלים מתקדמים

• בחירה מרובה (Multi-select) — Ctrl+Click, Shift+Click, Ctrl+A, או גרירת מרקיזה (M)
• טרנספורמציית בחירה — הזזה, קנה מידה, מחיקה של נקודות נבחרות
• כלי עט (Pen Tool) — ציור קונטורים חדשים (P), Alt+Click לנקודות off-curve
• שכבות / קונטורים — כל קונטור כשכבה עם צבע, ניראות, מחיקה
• עיגול פינות (Smooth Corners) — בחירת נקודות on-curve ← כפתור "עגל פינות" עם בקרת רדיוס
• החלפת סוג נקודה — מעבר בין on-curve ל-off-curve בלחיצה
• ביטול/חזרה (Undo/Redo) — Ctrl+Z / Ctrl+Y, עד 50 רמות לכל גליף

שינוי צורה (Transform)

• הפיכה (Flip) — אופקי (H) ואנכי (Shift+H), לנקודות נבחרות או לגליף שלם. גם כפתורים ב-toolbar: ⇄ / ⇅
• סיבוב (Rotate) — 90° (R), -90° (Shift+R)
• העתקה והדבקה — Ctrl+C/V לנקודות נבחרות, העתקת גליף שלם לגליף אחר
• הוספת נקודה על קטע — קליק ימני על קו ← "הוסף נקודה כאן"
• תפריט הקשר (Right-click) — גישה מהירה למחיקה, הפיכה, סיבוב, העתקה/הדבקה

ייבוא/ייצוא (v5 — חדש ✨)

• ייבוא SVG — הדבקת נתיב SVG (תוכן d) או העלאת קובץ SVG ← המרה אוטומטית לנקודות TrueType
• ייבוא תמונה (v5.1 — חדש ✨) — העלאת תמונה (PNG/JPG) של אות/תו והמרה אוטומטית לקונטורים וקריות TrueType
• ייצוא WOFF / WOFF2 / TTF — תפריט Export עם שלושה פורמטים. WOFF2 דורש חבילת brotli
• עריכת מטא-דאטה — שם, גרסה, מעצב, URL, רישיון, Ascender/Descender/LineGap

כלי קנבס (v5 — חדש ✨)

• ידיות בזייה (Bézier Handles) — קווים מקווקווים מנקודות off-curve לשכנות on-curve, ניתנים לגרירה
• הצמדה לרשת (Snap to Grid) — נקודות נצמדות לרשת מתכוונת; רשת מוצגת כשכבת-על על הקנבס
• סרגלים (Rulers) — סרגלים אופקי ואנכי מסביב לקנבס, מציגים יחידות פונט, מתעדכנים עם זום ופאן
• קווי עזר מותאמים (Custom Guidelines) — הוספת קווים אופקיים/אנכיים במיקום חופשי, דאבל-קליק למחיקה

ריווח אותיות (Kerning) (v5 — חדש ✨)

• עורך kerning — צפייה ועריכה של כל זוגות הריווח בפונט
• הוספה ומחיקה של זוגות — בחירת שני גליפים וקביעת ערך ריווח (חיובי/שלילי)

ממשק ותצוגה (v5 — חדש ✨)

• פאנלים מתקפלים — לחצני ◀/▶ מכווצים את פאנל הגליפים ואת פאנל המאפיינים כדי להגדיל את שטח העריכה
• תצוגה מקדימה מרובת-גדלים — מציגה את הטקסט ב-7 גדלים (12–96px) במקביל
• זום ופאן — גלגלת עכבר לזום, Space+גרירה לפאן, לחצן "Fit" לאיפוס
• תצוגת קואורדינטות — ריחוף על נקודה מציג מיקום ומזהה (on/off curve)

ממשק דו-שפתי 🇮🇱 🇺🇸

• עברית / אנגלית — מתג שפה בפינת הממשק
• נשמר בדפדפן — הבחירה נזכרת בין הפעלות
• כל המחרוזות מתורגמות — יותר מ-130 מחרוזות תורגמו לשתי השפות

⌨️ קיצורי מקלדת

קיצור	פעולה
V	כלי בחירה
M	מרקיזה
P	עט
H	הפוך אופקי
Shift+H	הפוך אנכי
R / Shift+R	סיבוב 90° / -90°
Ctrl+Z	ביטול
Ctrl+Y / Ctrl+Shift+Z	חזרה
Ctrl+A	בחר הכל
Ctrl+C	העתק נקודות / גליף
Ctrl+V	הדבק
Ctrl+S	שמור
Delete	מחק נקודות / איפוס גליף
חצים	הזז (10px, Shift=1px)
+/-	הגדל/הקטן
Space+גרירה	פאן הקנבס
גלגלת עכבר	זום
?	הצג קיצורי מקלדת
Esc	בטל בחירה / בטל עט

---

🏗️ מבנה הפרויקט

hebrew-font-maker/
├── backend/
│   ├── app.py                 # שרת Flask — יוצר פונטים (פורט 5000)
│   ├── image_processor.py     # זיהוי אותיות, קונטורים, separation levels
│   ├── font_generator.py      # יצירת TTF — Bézier, fallback glyphs, metadata
│   ├── hebrew_support.py      # מילון אותיות, צורות סופיות, RTL
│   └── font_editor_server.py  # שרת Flask — עורך פונטים (פורט 5001), ייבוא SVG, ייצוא WOFF/WOFF2, kerning
├── frontend/
│   ├── index.html             # ממשק יוצר הפונטים (wizard 4 שלבים)
│   ├── script.js              # לוגיקת UI: שיוך, מיזוג, תצוגה מקדימה
│   └── style.css              # עיצוב responsive + RTL
├── font_editor/
│   ├── index.html             # ממשק עורך הפונטים
│   ├── editor.js              # לוגיקת עורך: בחירה, עט, שכבות, undo, smooth, i18n, Bézier handles, grid snap, rulers, guidelines, kerning, SVG import, multi-preview
│   └── editor.css             # עיצוב כהה לעורך + סרגלים, רשת, קווי עזר, פאנלים מתקפלים
├── config.py                  # הגדרות (גודל פונט, סינון, נתיבים)
├── requirements.txt           # חבילות Python
├── install.bat                # סקריפט התקנה (venv + pip)
├── run.bat                    # הפעלת יוצר הפונטים
├── run_fonteditor.bat         # הפעלת עורך הפונטים
├── fonts_output/              # תיקיית פלט (נוצרת אוטומטית)
└── temp/                      # קבצים זמניים (נוצרת אוטומטית)

---

🔧 טכנולוגיות

רכיב	טכנולוגיה
שרת	Flask 2.3 + Flask-CORS
עיבוד תמונה	OpenCV 4.8 (Otsu, RETR_CCOMP, morphological operations)
יצירת/עריכת פונטים	fontTools (FontBuilder, TTGlyphPen, GlyphCoordinates, SVGPathPen)
צד לקוח	Vanilla HTML/CSS/JS, Canvas API, SVG (ללא frameworks)
ייצוא	WOFF, WOFF2 (דורש brotli), TTF
סביבה	Python venv, Windows batch scripts

---

📝 הערות טכניות

יוצר הפונטים

• אותיות סופיות: ף, ץ, ן, ך, ק — הזזה אוטומטית של -200 יחידות מתחת לקו הבסיס
• חורים באותיות: שימוש ב-RETR_CCOMP לזיהוי קונטורים חיצוניים ופנימיים בנפרד
• עקומות חלקות: qCurveTo — B-spline שבו כל הנקודות הן off-curve, ונקודות האמצע הן on-curve
• חילוץ נאמן: קונטורים מהתמונה המקורית (לא המעובדת) לשמירת צורה
• רמות הפרדה: erosion/dilation עם kernel שגדל לפי רמה (0–5)
• Fallback glyphs: ~46 תווים מ-Arial, מותאמים ל-unitsPerEm=1024
• ייצוא פרויקט (v2): .hfm — תמונה + קונטורים + שיוכים + כוונונים + מטא-דאטה בקובץ עצמאי

עורך הפונטים

• TrueType points: נקודות on-curve (flag=1) יוצרות קווים ישרים, off-curve (flag=0) — עקומות קוואדרטיות
• Smooth corners: החלפת נקודת פינה ב-3 נקודות (on → off → on) ליצירת Bézier curve
• Undo/Redo: מחסנית snapshots לכל גליף (עד 50 רמות), כל פעולת עריכה שומרת מצב לפני השינוי
• i18n: מילון תרגום 130+ מחרוזות, שפה נשמרת ב-localStorage, RTL/LTR אוטומטי
• ייבוא SVG: פירוק מלא של נתיבי SVG (M/L/H/V/Q/C/S/T/A/Z) — המרת cubic→quadratic, היפוך Y לקואורדינטות פונט, scale מתכוונן
• ייצוא WOFF/WOFF2: שימוש ב-fontTools flavor attribute. WOFF2 דורש חבילת brotli (מותקנת ב-requirements)
• Kerning: קריאה/כתיבה של kern table format 0 דרך fontTools. תצוגת זוגות עם שמות גליפים
• Bézier handles: קווים מקווקווים בין נקודות off-curve לשכנותיהן — ויזואליזציה של עקומות השליטה
• Snap to grid: הצמדה חכמה — snapVal() מעגל לכפולות של gridSnapSize (ברירת מחדל 50 יחידות)
• Rulers: Canvas API מצייר סרגלים אופקי/אנכי, rulerStep() מחשב מרווח אדפטיבי לפי רמת הזום
• Custom guidelines: קווים אופקיים/אנכיים חופשיים, נשמרים ב-State, דאבל-קליק למחיקה

---

📄 רישיון

MIT License