איך יוצרים כפתור בפוטושופ

אז לא.. אני לא מדבר על להקת aqua עם השיר Barbie girl אני מדבר על אקווה סטייל (Aqua Style) שמאפיינת את הערכות הויזואליות של ממשקי מקינטוש. פירוש המילה אקווה בלטינית הוא מים ולכן הסטייל הזה בעל אפקטים של שקיפות חלקית והשתקפויות.

כפתורי אקווה מעבירים תחושה של "סוכריות טעימות" שאי אפשר להתאפק מללחוץ עליהם.

הרבה אתרים עושים שימוש בכפתורי אקווה וכנראה שהסיבה מוצדקת. אפשר למצוא אותם בעמודי נחיתה, טפסי רישום, סקרים, חנויות דיגיטליות, אתרים בסגנון web 2.0 וכ"ו.

בפעמים הראשונות שניסיתי לייצר כפתור אקווה התוצאה שיצאה לי הייתה בין "המגעיל" ל-"בסדר…" במקום כפתור "טעים" יצא לי משהו על סף הפג תוקף. : ) אבל מה לעשות הניסיון עושה את זה שלו וכעת אני גאה להציג דרך פשוטה להגיע לסטייל הזה.

שלב 01.

אז נתחיל ביצירת קובץ פוטושופ חדש, אני פתחתי קובץ במידות של  500 פיקסל רוחב ו 180 פיקסל גובה. עכשיו ניקח את הכלי של הריבוע עם הפינות המעוגלות או באנגלית (Rounded Rectangle Tool) שנמצא בסרגל הכלים:

שלב 02.

עכשיו צריך לשנות את הרדיוס ל- 30. אם אתם לא יודעים איפה זה נמצא תסתכלו בדוגמה הבאה:

שלב 03.

במשטח העבודה נצייר מלבן עם המידות החדשות וזה אמור להיות משהו כזה:

שלב 04.

ברגע שציירנו את המלבן פוטושופ שם אותו אוטומטית על שכבה חדשה. עכשיו נלחץ פעמיים מהר על השכבה הזאת בצד ימין (ליד שם השכבה) כדי לפתוח את חלון "סטייל השכבות". נתחיל בהוספת צל למלבן שהרגע ציירנו (Drop Shadow). שימו לב לפרמטרים שאני הכנסתי. אתם יכולים לשים פרמטרים שונים אם אתם רוצים להגיע לתוצאה אחרת.

שלב 05.

עכשיו נכניס צל פנימי עם הפרמטרים האלה (Inner Shadow)

שלב 06.

ודבר אחרון נכניס הברקה בפנים (Inner Glow)

שלב 07.

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

שלב 08.

עכשיו ליצירת החלק הזוהר בתחתית הכפתור. שכפלו את השכבה של המלבן. כדי לעשות את זה נעשה לחיצה ימנית עם העכבר על השכבה ו"שכפול שכבה" (Duplicate Layer).

שלב 09.

השכבה שוכפלה וכך גם האפקטים שעשינו לשכבה. מפני שאנחנו לא צריכים את האפקטים נבטל אותם. כדי לבטל עמדו עם העכבר על השכבה החדשה, לחצו לחצן ימני ו .Clear Layer Style

שלב 10.

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

לחצו במרכז הריבוע הצהוב של השכבה כדי לאפשר שינוי צבע, בחרו לבן ותעשו Ok.

שלב 11.

לחצו עכשיו במקלדת על Ctrl+T כדי לאפשר שינוי גודל של החלק. הקטינו את החלק ושימו אותו בתחתית כמו בדוגמה הזאת:

שלב 12.

עכשיו צריך לטשטש את גבולות החלק כדי לגרום מראה של השתקפות. כדי לעשות את זה נרים את העיניים למעלה אל שורת התפריט ומבחר ב:
Filter>Blur>Gaussian Blur
נלחץ Ok  להודעה שהוא פתח לנו וניתן שם רדיוס של 9 ונאשר את האפקט.

13.

שנו את מצב השכבה ל- אוברליי (Overlay)

14.

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

15.

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

16.

כעת השתמשו בכלי הגראדיאנט במסכה לטשטש את החלק התחתון.