OB
אופיר ברנס
Builder · TLV
חזרה לכל הפרויקטים
PWA · 2026 · Personal Project

Flash

כרטיסיות לימוד עם אלגוריתם SM-2 spaced-repetition — אותו אלגוריתם של Anki

Flash

Flash — אפליקציית PWA לכרטיסיות לימוד יומיות עם אלגוריתם SM-2 spaced repetition — אותו אלגוריתם בו משתמשת Anki, התוכנה הפופולרית בעולם ללימוד שפות וזיכרון לטווח ארוך.

איך זה עובד

הרעיון של spaced repetition הוא שהזיכרון מתחזק באופן הכי יעיל כשחוזרים על מידע בדיוק לפני שעומדים לשכוח אותו:

  1. כרטיס חדש מופיע, אתה רואה את השאלה
  2. לחיצה על "הראה תשובה" — אנימציית 3D flip של הכרטיס (transform-style preserve-3d)
  3. אתה מדרג את עצמך: שוב / קשה / טוב / קל
  4. האלגוריתם מחשב מתי להראות לך את הכרטיס שוב

הסוד באלגוריתם:

  • Easiness Factor (EF) מתחיל ב-2.5 ומשתנה לפי הביצועים — מינימום 1.3
  • Interval גדל אקספוננציאלית: יום, 6 ימים, 6 × EF, 6 × EF², ...
  • שוב מאפס לדקה — תרגול מיידי באותה סשן
  • קל מקבל בונוס × 1.3 לאינטרוול — חוסך זמן על מה שאתה כבר יודע

פיצ'רים

  • חבילות מרובות עם 8 צבעים נבחרים — סדר את הלמידה לפי נושא
  • תרגול חכם — כפתור אחד שאוסף את כל הכרטיסים מכל החבילות שמועד התרגול שלהם הגיע
  • תרגול לפי חבילה — בחר חבילה ספציפית
  • תצוגות שלבים — חדש (צהוב) / בלמידה (סגול) / חוזר (ורוד) / שולט (ירוק) — interval ≥ 21 יום = שולט
  • חזוי זמן עתידי — מתחת לכל כפתור הערכה רואים מתי הכרטיס יחזור (<1m, 4d, 2mo, 1.5y)
  • streak יומי — מספר ימים רצופים שתרגלת
  • 2 חבילות זרעים מובנות — יפנית בסיסית + קיצורי VS Code

טכנולוגיות

  • 3D card flip עם CSS transform-style: preserve-3d + backface-visibility: hidden + rotateY(180deg) עם transition cubic-bezier overshoot
  • SM-2 algorithm מקורי ב-JS — חישוב EF, interval, repetitions
  • IndexedDB multi-store — decks + cards (עם compound indexes על deckId ו-due) + settings
  • localStorage ל-streak (פשוט יותר מ-IDB עבור set bit פר יום)
  • Vibration API — feedback קצר על flip, ארוך יותר על "שוב" (פעמיים)
  • Service Worker — cache-first עם revalidate, עובד אופליין מלא

עיצוב

פלטה plum + butter-yellow — אסתטיקת ספר עתיק עם מסגרת זהב. נבדלת מ-violet (Focus), fuchsia (QR), ו-amber-gold (Level). רקע סגול עמוק (#1a0a1f), פלום בוהק (#d946ef), זהב חמים (#fde047).

טיפוגרפיה — Heebo + Frank Ruhl Libre לכותרות (סריף קלאסי לתחושת ספר) + IBM Plex Mono לתאריכים, intervals, ומספרים. כרטיסי לימוד עם gradient לבן→זהב לתשובה ולבן→סגול לשאלה — ניגודיות ברורה.

פתח את Flash ב-ofir.zbang.net/flash

· TECHNOLOGY ·
PWA SM-2 Algorithm 3D CSS Transform IndexedDB Vibration API Service Worker Frank Ruhl Libre Heebo

פרויקטים קשורים.

· YOUR PROJECT NEXT ·

הפרויקט הבא שלך?

בוא נדבר