איך בניתי משחק מכות שלם עם קלוד קוד (Claude Code) והעליתי אותו לאפסטור

הידעת?
אפליקציית האנדרואיד של המשחק שוקלת בסך הכל כ-450KB, פחות מתמונת סלפי אחת. זה כל הקסם של עטיפת TWA: האפליקציה היא מעטפת דקיקה, והמשחק עצמו חי באתר ומתעדכן בלי לגעת בחנות.
לפני כמה שבועות ישבתי עם רעיון משוגע: משחק מכות רחוב בסגנון הקלאסיקות של שנות התשעים, שבו הלוחמים הם דמויות סאטיריות מהפוליטיקה הישראלית. היום המשחק הזה, "הדרך לכנסת", יושב באפסטור של אפל, רץ בדפדפן של כל טלפון, ויש לו אפילו טבלת דירוג עולמית. את כל הדרך, מהשורה הראשונה של הקוד ועד כפתור "פרסם" בחנות, עשיתי בשיחות עם קלוד קוד (Claude Code). בלי מנוע משחקים, בלי אנדרואיד סטודיו, בלי מק עם Xcode פתוח כל היום.
זה המדריך המפורט של כל התהליך, כולל הקוד, ההחלטות, הקריסה שבדרך ואיך דיבגנו אותה.
המשחק עצמו: הדרך לכנסת באפסטור של אפל · לשחק בדפדפן
בקצרה
- המשחק נבנה כאתר: JavaScript נקי על Canvas, בלי שום מנוע משחקים או פריימוורק.
- מנוע שלם נכתב בשיחות עם קלוד קוד: לוחמים, AI ליריב ממוחשב, מולטיפלייר מקוון, דירוג ELO עולמי.
- אנדרואיד: עטיפת TWA (Trusted Web Activity) של כ-450KB, שנבנתה ידנית עם Gradle, בלי אנדרואיד סטודיו.
- אייפון: אפליקציה שמארזת את המשחק במלואו, עברה את ביקורת אפל ופורסמה באפסטור.
- עדכון תוכן במשחק לא דורש גרסה חדשה בחנות: דוחפים לאתר, וכל המשתמשים מקבלים מיד.
שלב 1: למה בכלל לבנות משחק כאתר?
ההחלטה הארכיטקטונית הכי חשובה בפרויקט התקבלה ביום הראשון: המשחק הוא אתר. לא פרויקט Unity, לא Godot, לא React Native. קובץ HTML אחד שטוען מודולים של JavaScript ומצייר הכל על Canvas.
הסיבות, בדיעבד, התבררו כנכונות אחת אחת:
- איטרציות בשניות. כל שינוי שקלוד קוד עושה נבדק מיד בדפדפן. אין קומפילציה, אין המתנה לבילד.
- פלטפורמה אחת, כל המכשירים. אותו קוד רץ במחשב, באנדרואיד ובאייפון. ההבדל הוא רק העטיפה.
- עדכונים בלי חנות. כשהמשחק חי באתר, תיקון באג מגיע לכל השחקנים ברגע שהוא עולה לשרת. אין "מחכים לאישור גרסה".
- AI כותב JavaScript מצוין. מודלים של קוד ראו יותר JavaScript מכל שפה אחרת. כשעובדים עם קלוד קוד, לבחור את השפה שהוא הכי חזק בה זה יתרון מובנה.
שלב 2: מנוע משחק שלם, מודול אחרי מודול
אנשים מדמיינים "AI בונה משחק" כפקודה אחת שמוציאה משחק. במציאות זה פרויקט הנדסי מסודר, שנבנה שכבה אחרי שכבה לאורך שיחות. ככה נראה המבנה הסופי של המנוע, כ-20 מודולים של JavaScript נקי:
| מודול | תפקיד |
|---|---|
| pixel.js, sprites.js, render.js | ציור הדמויות והזירות על Canvas בסגנון פיקסל-ארט |
| fighter.js, projectile.js | פיזיקת הלחימה: מכות, קפיצות, מכות חתימה, פגיעות |
| ai.js | היריב הממוחשב: התקרבות, תזמון מכות, רמות קושי |
| game.js, backdrop.js | לולאת המשחק, השלבים והזירות |
| input.js, touch.js | מקלדת במחשב, כפתורי מגע בטלפון |
| net.js | מולטיפלייר מקוון בזמן אמת (P2P עם PeerJS) |
| rank.js | טבלת דירוג עולמית בשיטת ELO, בלי הרשמה |
| audio.js, music.js | אפקטים ומוזיקה |
| save.js, i18n.js | שמירת התקדמות מקומית, תמיכה בשפות |
שלוש נקודות שלמדתי על עבודה עם קלוד קוד על פרויקט בסדר גודל כזה:
- דרשו הפרדה למודולים מהיום הראשון. קובץ ענק אחד הופך כל שינוי למסוכן. כשכל תחום חי בקובץ משלו, אפשר לבקש "תקן את ה-AI של הבוס בשלב 5" בלי לפחד שהמולטיפלייר יישבר.
- בדקו כל פיצ'ר ברגע שהוא נבנה. לא אוספים עשרה פיצ'רים ואז בודקים. משחקים אחרי כל שינוי. באג שמתגלה מיד מתוקן בדקה; באג שמתגלה אחרי שבוע דורש חפירה.
- המולטיפלייר היה החלק הקשה באמת. קרב מקומי נגד המחשב זה פרויקט של ערב. סנכרון שני שחקנים מרחוק, עם חיבורי P2P, חדרים פרטיים עם קוד ודירוג עולמי, זה החלק שדרש הכי הרבה סבלנות ואיטרציות.
התוצאה: 12 לוחמים עם מכות חתימה, מצב סיפור עם שבעה שלבים ובוסים, קרב מול חבר או מול המחשב, משחק מקוון מול יריב אקראי, מצב הישרדות ואימון. והכל עובד גם בלי אינטרנט.
שלב 3: מהאתר לאפליקציית אנדרואיד, בלי אנדרואיד סטודיו
כאן מגיע החלק שהכי הפתיע אותי: את אפליקציית האנדרואיד בנינו כולה מסביבת עבודה בענן, בלי לפתוח אנדרואיד סטודיו אפילו פעם אחת.
הבחירה: TWA (Trusted Web Activity)
במקום לארוז את קבצי המשחק בתוך האפליקציה, בחרנו ב-TWA, העטיפה הרשמית של גוגל (ספריית androidbrowserhelper). האפליקציה היא מעטפת דקיקה של כ-450KB שפותחת את האתר החי במסך מלא, בלי סרגל דפדפן. היתרון המכריע: כל עדכון שנדחף לאתר מגיע מיד לאפליקציה, בלי גרסה חדשה בחנות.
הקמת סביבת הבנייה
בסביבת הענן היו Java ו-Gradle, ואת ה-SDK של אנדרואיד מורידים ישירות מגוגל ככלי שורת פקודה (command line tools). זה כל מה שצריך; אנדרואיד סטודיו הוא נוחות, לא דרישה.
כתיבת פרויקט האנדרואיד ידנית
לא הרצנו שום אשף. קלוד קוד כתב את הקבצים בעצמו, כי הם קטנים ופשוטים:
- build.gradle: מזהה האפליקציה (com.littleknesset), מספרי גרסה, ותלות אחת בלבד: androidbrowserhelper.
- AndroidManifest.xml: הצהרה על מסך פתיחה שמפנה לכתובת המשחק, ונעילת המסך לרוחב.
- אייקונים: נוצרו מהאייקון של המשחק בסקריפט פייתון קטן שמייצר את כל חמש הרזולוציות הנדרשות.
מפתח החתימה: הקובץ שאסור לאבד
נוצר מפתח חתימה (keystore) שמזהה אותי כמפרסם. שמרתי אותו בשני מקומות בטוחים, כי בלעדיו אי אפשר לעדכן את האפליקציה לעולם. אם יש דבר אחד לקחת מהמדריך הזה: גבו את מפתח החתימה שלכם היום.
קישור הדומיין לאפליקציה
הקסם שמעלים את סרגל הכתובת: קובץ בשם assetlinks.json שיושב באתר תחת /.well-known/, ומכיל את טביעת האצבע (SHA-256) של מפתח החתימה. זה מה שמוכיח לאנדרואיד שהאתר והאפליקציה שייכים לאותו בעלים:
[{
"relation": ["delegate_permission/common.handle_all_urls"],
"target": {
"namespace": "android_app",
"package_name": "com.littleknesset",
"sha256_cert_fingerprints": ["38:91:E0:38:..."]
}
}]
הבנייה: פקודה אחת
Gradle מוריד את התלויות, מהדר, אורז וחותם עם המפתח, הכל בפקודת בנייה אחת. התוצאה: קובץ APK מוכן להתקנה וקובץ AAB מוכן להעלאה לגוגל פליי.
הקריסה, והדיבוג שפתר אותה
הגרסה הראשונה קרסה בפתיחה. הסיבה: צירוף לא תואם של גרסאות ספריות. הדיבוג היה שיעור בפני עצמו: פירקנו את ה-APK, השווינו כל קריאת פונקציה בקוד המהודר מול הספרייה שנארזה בפועל, ומצאנו שלוש פונקציות שהקוד קורא להן והן פשוט לא קיימות בגרסה שנארזה. החלפנו לצמד גרסאות יציב ומוכח, והרצנו את אותה בדיקה שוב עד שהגענו לאפס חוסרים.
הלקח הזה שווה זהב לכל מי שבונה אפליקציות עם AI: כשמשהו קורס, אל תנחשו. תפרקו, תשוו, תמצאו את הפער המדויק. בדיקה אמיתית מנצחת השערה טובה.
שלב 4: האפסטור של אפל
אפל היא סיפור אחר. הקווים המנחים של האפסטור לא מקבלים מעטפת דקה שרק פותחת אתר, ולכן גרסת האייפון בנויה אחרת: היא מארזת את המשחק המלא בתוך האפליקציה עצמה. זו הסיבה שהיא שוקלת כ-88MB לעומת 450KB באנדרואיד, וזו גם הסיבה שהיא עובדת מצוין גם בלי אינטרנט.
התהליך מול אפל כולל כמה תחנות שכל מפתח עצמאי צריך להכיר:
- חשבון Apple Developer (99 דולר לשנה), עם אימות זהות.
- App Store Connect: יצירת האפליקציה, מילוי דף החנות, צילומי מסך, תיאור, מילות מפתח ומדיניות פרטיות.
- דירוג גיל ותוכן: משחק מכות סאטירי מחייב שקיפות. המשחק הוגדר 9+ והתיאור מצהיר במפורש: התוכן סאטירי ובדיוני, אינו קשור, ממומן או מאושר על ידי אף מפלגה, חבר כנסת או גוף ממשלתי.
- ביקורת אפל: הגשה והמתנה. הביקורת בודקת יציבות, תוכן והתאמה לקווים המנחים.
ב-26 באוגוסט 2026 האפליקציה אושרה ופורסמה. בחינם, בלי פרסומות ובלי רכישות:
הדרך לכנסת: משחק מכות סאטירי, באפסטור של אפל ←
גרסת האנדרואיד הועלתה לקונסול של גוגל פליי ונמצאת בתהליך הפרסום (גוגל דורשת ממפתחים חדשים תקופת בדיקה סגורה לפני פרסום פומבי). בינתיים, משתמשי אנדרואיד משחקים ישירות בדפדפן, וזה בדיוק היופי בארכיטקטורת האתר: אף אחד לא מחכה לחנות.
עדכונים: החלק שהופך את הארכיטקטורה למנצחת
ככה נראית תחזוקה של המשחק היום:
- שינוי במשחק עצמו (דמות חדשה, איזון מכות, תיקון באג): דוחפים לאתר. זהו. כל השחקנים, בדפדפן ובאפליקציות, מקבלים את העדכון מיד.
- שינוי בעטיפה (אייקון, שם, הרשאות): מעלים מספר גרסה, מריצים את פקודת הבנייה, מעלים לחנות. קורה לעיתים רחוקות.
בפרויקטים שאני מלווה בארגונים אני רואה צוותים שמתחזקים שלוש גרסאות נפרדות של אותו מוצר: ווב, אנדרואיד ואייפון. הארכיטקטורה הזו, אתר אחד עם עטיפות דקות, חוסכת את רוב הכאב הזה לרוב סוגי האפליקציות.
מה זה אומר לעסק שלכם?
המשחק הזה הוא הדגמה משעשעת, אבל העיקרון רציני לגמרי: המרחק בין רעיון למוצר בחנויות האפליקציות התכווץ דרמטית. מה שהיה דורש צוות פיתוח, תקציב של מאות אלפי שקלים וחודשים של עבודה, נבנה היום בשיחות עם קלוד קוד (Claude Code) על ידי אדם אחד שיודע לנהל את התהליך.
זה לא אומר שאין עבודה. יש המון: הגדרת דרישות מדויקת, בדיקות בלתי מתפשרות אחרי כל שלב, דיבוג שיטתי כשמשהו נשבר, והבנת התהליכים מול החנויות. אבל זו עבודה של ניהול והנדסת דרישות, לא של כתיבת קוד שורה אחר שורה. מי שרוצה לרכוש את המיומנות הזו בצורה מסודרת, זה בדיוק מה שאנחנו מלמדים בסדנת קלוד קוד לארגונים, על פרויקטים אמיתיים של המשתתפים.
שאלות נפוצות
כמה זמן לקח כל הפרויקט? המשחק נבנה בסדרת שיחות עבודה לאורך תקופה קצרה, במקביל לעבודה השוטפת שלי. רוב הזמן הלך על ליטוש: איזון הלחימה, המולטיפלייר והתהליכים מול החנויות.
באיזה מנוע משחקים השתמשתם? בשום מנוע. JavaScript נקי על Canvas של הדפדפן, עם מנוע שנכתב במיוחד למשחק: רינדור פיקסל-ארט, פיזיקה, AI, רשת ודירוג.
איך המולטיפלייר עובד בלי שרת משחק? בחיבור P2P ישיר בין השחקנים (ספריית PeerJS). השרת רק מפגיש בין היריבים; הקרב עצמו רץ ישירות בין שני הטלפונים. חדר פרטי עם קוד עובד באותה שיטה.
אפשר לעשות את אותו תהליך לאפליקציה עסקית, לא למשחק? בהחלט, והתהליך אפילו פשוט יותר: רוב האפליקציות העסקיות הן טפסים, רשימות ותוכן, בלי פיזיקת לחימה בזמן אמת. אתר + עטיפת TWA היא דרך מהירה מאוד להגיע לחנויות עם מוצר עסקי.
שורה תחתונה
"הדרך לכנסת" התחיל כבדיחה ונגמר כמוצר חי בחנות של אפל. הדרך עברה בארבע תחנות שכל אחד יכול לשחזר: משחק כאתר על Canvas, מנוע שנבנה מודול אחרי מודול עם קלוד קוד, עטיפת TWA של 450KB לאנדרואיד שנבנתה בלי אנדרואיד סטודיו, ואפליקציה ארוזה שעברה את ביקורת אפל.
רוצים לנסות? שחקו במשחק בדפדפן, הורידו מהאפסטור, ואם אתם רוצים לבנות ככה מוצרים בארגון שלכם, דברו איתי.
קורס במתנה עם ברכה אישית מכם — מסירה מיידית או בתאריך שתבחרו, וגישה לכל החיים.


