דוגמאות לכפתורים מונפשים
כפתורים הם המקום שבו אנשים נוגעים באתר. המיקרו־אינטראקציות כאן נלחצות, נמתחות וקופצות כמו חפצים אמיתיים, וכולן נגישות ועובדות גם מהמקלדת.
כפתור לחיצה מוחשי
מגזיני חםכפתורים עם צל קשיח שנלחצים פיזית לתוך הדף וקופצים בחזרה בתנועת קפיץ.
כפתור לחיצה ארוכה לאישור
מגזיני חםכפתור מחיקה שצריך להחזיק לחוץ 1.2 שניות. הוא מתמלא בצבע, ושחרור מוקדם מחזיר אותו אחורה.
כפתור העתקה שמשנה צורה
מגזיני חםכפתור העתקה שהאייקון שלו הופך לוי מצויר והכפתור מתרחב לטקסט "הועתק".
כפתור לייק עם קונפטי מנייר
מגזיני חםכפתור לייק שקופץ ומפזר ריבועים ועיגולים קטנים כמו נייר גזור.
כפתורי ממפיס עם סלסולים
ממפיס שנות ה־90כפתורים עגולים בסגנון שנות ה־90 עם קו מתאר שחור, סלסולים שמתנועעים ונקודות שמתפזרות בלחיצה.
כפתורי קליי מנופחים
קליימורפיזםכפתורי פסטל רכים שנראים עשויים מחימר, מתרוקנים כשלוחצים ומתנפחים בחזרה ברעד קל.
כפתור START בסגנון ארקייד
ארקייד 8 ביטמסך פתיחה בסגנון 8 ביט עם הודעה מהבהבת, כפתור פיקסלים שנלחץ בדיוק ארבעה פיקסלים ומונה מטבעות.
לפי סוג ולפי סגנון
שאלות נפוצות
מה זה דוגמית עיצוב?
ספרייה חינמית של עיצובי אתרים שלמים. כל עיצוב רץ חי בדפדפן ומגיע עם פרומפט מפורט שאפשר להדביק ב-Claude כדי לבנות אותו. רכיבים בודדים נמצאים בנפרד, במעבדת הרכיבים.
איך משתמשים בפרומפט ל-Claude כדי לעצב אתר?
פותחים עיצוב, לוחצים על „העתקת הפרומפט” ומדביקים ב-Claude. מקבלים רכיב React שלם עם Tailwind CSS ו-Framer Motion שאפשר לשלב באתר Next.js.
העיצובים חופשיים לשימוש?
כן. כל העיצובים והקוד חופשיים לשימוש בפרויקטים אישיים ומסחריים לפי רישיון MIT.
איך גורמים לאתר שנבנה עם AI לא להיראות כמו AI?
מתחילים משפת עיצוב ברורה ולא מברירות מחדל: זוג פונטים שנבחר בכוונה, פלטה קפדנית עם צבע הדגשה אחד ותנועה עם פיזיקה של קפיץ. כל פרומפט כאן מפרט את הבחירות האלה.
אילו סגנונות עיצוב יש באתר?
28 שפות עיצוב, בהן ניאו־ברוטליזם, באוהאוס, שוויצרי, מינימליזם יפני, יוקרה כהה, רטרו שנות ה־70, ממפיס, Y2K, קליימורפיזם, ריזוגרף, ארט דקו ו־8 ביט.
אפשר להזמין אתר מותאם לעסק שלי?
כן. ממלאים את הבריף בדף הבית ומקבלים תשובה תוך יום עבודה אחד.