חזרה
מסיבת הקאקאפו: כך בנה סיימון וויליסון שקופית סיום לכנס עם Claude ו-Playwright
SiTech AI Team2 წთ. საკითხავი

מסיבת הקאקאפו: כך בנה סיימון וויליסון שקופית סיום לכנס עם Claude ו-Playwright

לשקופית הסיום של הכנס WeAreDevelopers ביקש סיימון וויליסון מ-Claude Opus 5.5 להפוך שלוש תמונות של קאקאפו למסיבת פיקסלים, ו-Claude Code עם Playwright הקליט סרטון של 15 שניות.

סיימון וויליסון בנה את שקופית הסיום של הרצאתו בכנס WeAreDevelopers World Congress North America בעזרת AI, ותיעד את כל התהליך בפוסט בבלוג שפורסם ב-26 בספטמבר 2026. בפוסט הוא מציג גם את הפרומפט וגם את הקוד.

לדבריו, הוא חיפש רגע בולט להרצאה והחליט לשלב בה אזכור של עונת הרבייה שקבעה שיא אצל הקאקאפו ב-2026, שעליה דיווח משרד שימור הטבע של ניו זילנד. מכיוון שנשמעו תגובות נלהבות על היכולת של Claude Opus 5.5 ליצור אנימציות בפיקסלים, הוא בנה סביבה את שקופית הסיום.

משלוש תמונות לקנבס HTML5

וויליסון אסף שלוש תמונות של קאקאפו מחיפוש התמונות של Google והעביר אותן ל-Claude עם בקשה קצרה: ליצור אנימציה של מסיבת קאקאפו בפיקסלים על קנבס HTML5, שבה הציפורים מקפצות, יורד קונפטי ויש לפחות 20 מהן. תמליל השיחה פורסם, והתוצאה פועלת כעמוד עצמאי בכתובת tools.simonwillison.net/kakapo-party, שבו לחיצה מפעילה את אפקט הקונפטי.

Claude Code מקליט את הסרטון עם Playwright

אי אפשר היה להטמיע את האנימציה במצגת כעמוד אינטרנט, ולכן וויליסון הוריד את קובץ ה-HTML ונתן לסשן מקומי של Claude Code שלוש הנחיות: לפתוח את הקובץ בדפדפן, ללחוץ כמה פעמים כדי לקבל את אפקט הקונפטי ולהקליט סרטון של 15 שניות. בשלוש השניות הראשונות אסור היה ללחוץ, והלחיצות היו צריכות להתפרס על אזור הלחיצה. Claude Code השתמש ב-Playwright, ספריית האוטומציה של הדפדפן, והפיק בדיוק את הסרטון שנדרש לשקופית הסיום.

הסקריפט קצר: הוא פותח חלון בגודל 1280×720 עם הקלטת וידאו, ממתין עד השנייה השלישית, מבצע עשר לחיצות בין 3.0 ל-13.2 שניות במרכז, בפינות ובשוליים של הקנבס, וסוגר את הסשן בשנייה ה-16. בפוסט מופיעים גם התמליל וגם הסקריפט המלא.

מה מלמד התהליך

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

SSiTech

SiTech — פיתוח אתרים בכוח ה-AI

אנחנו בונים אתרים מהירים ומודרניים ומשלבים AI בתהליכי עבודה אמיתיים. יש לכם פרויקט או שאלה? נשמח לעזור.