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

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

להלן רשימת הסמלים הקיימים באוסף הלוגואים של הרשויות המקומיות בישראל:
סמל עיריית אשדוד
סמל עיריית באר שבע
סמל עיריית בית שמש
סמל עיריית ביתר עילית
סמל עירית בני ברק
סמל המועצה האזורית בקעת בית שאן
סמל עיריית בת-ים
סמל עיריית גבעתיים
סמל מועצה אזורית הגליל העליון
סמל עיריית חולון
סמל עיריית חיפה (X2)
סמל עיריית ירושלים
סמל עיריית כפר סבא
סמל עיריית לוד
סמל עיריית מודיעין
סמל עיריית עפולה
סמל עיריית פתח תקווה
סמל עיריית קרית גת
סמל עיריית קרית מוצקין
סמל עיריית רחובות
סמל עיריית רעננה
סמל עיריית תל אביב – יפו (X2)

להורדה בפורמט AI:
25 לוגואים של עיריות בישראל (152)

להורדה בפורמט PDF:
25 לוגואים של עיריות בישראל (81)

לסיום, אם יש לך משהו להוסיף לאוסף הזה, אנא שלח/י לי למייל josh@josh.co.il לטובת כולנו.

על תחביב מעניין של אנשים שאוהבים אותיות.

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

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

זו היתה רק הקדמה, על האיש המוכשר שרובכם כבר מכירים כנראה. ועכשיו לעניינינו:

מעבר לעיצוב פונטים, מסתבר שחובבי טיפוגרפיה וחובבי נוסטלגיה עוסקים בעיסוק מרתק אחר.
השם של התופעה באנגלית הוא "found typography" והתרגום הכי מוצלח שמצאתי לזה הוא: "טיפוגרפיה מצויה".

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

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

זהו, יותר מידי מילים משעממות נאמרו בשעה שהתמונות הן אלו שבאמת מספרות את כל הסיפור.

רוצים עוד?
הפוטולוג של ינק יונטף

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

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

איור דמות ב-4 שלבים

שלב 1 – רישום שנעשה כשכבה נפרדת מעל התמונה, להעתקת הקוים הכלליים של הדמות.

שלב 2 - בשכבה נפרדת, מריחה מהירה ולא מדוייקת של הצבע, ע"י דגימת הצבע בתמונה המקורית.

שלב 3 – בשכבה נוספת, צביעה שמתייחסת יותר לפרטים.

שלב 4 - ירידה לפרטים וגימור סופי באיזור הפנים והראש.

תוצאה סופית: (קליק כדי לראות בגדול)

אז תודה לאברומי. ולמי שמעוניין ליצור קשר, אפשר לפנות ל: 

צוותי הפיתוח של אדובי עובדים במרץ על הגירסה החדשה של חבילת התוכנות במהדורת CS5.

בבלוג הלא-רשמי מתפרסמים מפעם לפעם עדכונים לגבי הפיתוחים החדשים והטכנולוגיות המעניינות שהחבר'ה ב-"Adobe Labs" מכינים בשבילנו.

אז הנה שני סרטונים שמספקים הצצה לפוטושופ CS5:

[See post to watch Flash video] [See post to watch Flash video] ]]> http://www.josh.co.il/?feed=rss2&p=333 6 http://www.josh.co.il/?p=322 http://www.josh.co.il/?p=322#comments Thu, 21 Jan 2010 13:38:15 +0000 ‫יהושע‬ http://www.josh.co.il/?p=322

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

דוגמאות:

אוסף אלמנטים אדריכליים דקורטיביים (846)
133MB

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

את המדריך הכנתי עם מסמך בגודל 1200X800 פיקסלים.
מתחילים עם טקסט לבן על רקע שחור.
על הטקסט מחילים ארבע אפקטים של Layer style:

1. Outer Glow בצבע f70300
   
2. Color Overlay בצבע d18a2f
   
3. Inner Glow בצבע e3c55c
   
4. Satin בצבע 700707
   
   

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

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

בעזרת פילטר Liquify יוצרים גלים ועיוותים קלים בקווי המתאר של האותיות

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

העתק-הדבק לתוך הטקסט שהכנו קודם. מקטינים ומתאימים את הלהבות שיכסו אזור מתוך האות, ומוחקים בעזרת כלי המחק את העודפים שגולשים מחוץ לאות. משאירים קצת קצוות ולהבות קטנות שיתנו תחושה שהאש מתפרצת קצת, לפי הרגש והטעם האישי. אחרי שהאש יושבת יפה על גבי האות, נשכפל את השכבה של האש ונגדיר שיטת כיסוי של  Overlay ושקיפות של 30%.

ממשיכים עד לכיסוי כל שטח האות.

חוזרים על הפעולה בכל שאר האותיות.

זהו. בעיקרון, זה הכל.

כדי לעשות את זה מעניין יותר ולשפר את הגימור, הוספתי טקסטורת רקע, עם אפקט של Gradient Overlay כזה:

מעל הכל הוספתי שכבה ובה כמה נקודות אדומות מעל הטקסט בעזרת מברשת גדולה ורכה:

הגדרתי שיטת כיסוי של  Color Dodge ושקיפות של 40%.

הוספתי שורת טקסט, והנה לפניכם התוצאה הסופית: (קליק לגודל מלא)

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

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

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

1. כלי החותמת

בעזרת כלי החותמת () נתחיל בתיקון הדרגתי של הפגמים בעור.
נדגום נקודה נקיה בעזרת לחיצה על מקש ה alt+לחיצה על לחצן העכבר. ואז נשתמש בה כדי לכסות על פצעון או כתם.
כדי לקבל תוצאה נקיה ואחידה, נשתדל לדגום מאזור שהגוון שלו דומה לאזור שאנחנו מתקנים. כך התיקון ישתלב באופן טבעי.

העיגול הירוק מראה מאיפה נכון לדגום, ואילו העיגולים האדומים, מראים מאיפה לא נכון לדגום.

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

2. טישטוש

אמנם נפטרנו מהפצעונים ומהפגמים הבולטים, אבל העור עדיין לא נראה חלק ונקי לחלוטין. על מנת להחליק את העור עוד יותר, ניעזר בפילטר טישטוש.
ניצור שכבה חדשה – ע"י שכפול של השכבה הקיימת (ctrl+J)
נחיל עליה טשטוש – לדעתי הטשטוש המתאים ביותר למטרה זו, הוא טשטוש median שנמצא תחת תפריט Filter>Noise>Median

הטישטוש החליק את עור הפנים בצורה יפה, אבל גם העלים פרטים חשובים, ובכך פגע בחדות התמונה.
אל דאגה, בעזרת יצירת מסכה, נשאיר רק את האזורים שאותם אנחנו באמת מעוניינים לטשטש.
ניצור מסיכה (לחיצה על Alt+Ctrl+G), בעזרת כלי המברשת, נשחיר את האזורים שבהם ישנם פרטים חשובים שאבדו בגלל הטישטוש – עיניים, שפתיים, נחיריים, שיער… שימו לב, כדי ליצור חיבור יפה בין האזורים המטושטשים לאזורים החדים, נגדיר את המברשת לשקיפות של 50%, כך נוכל לחשוף רק חלקית אזורים מסויימים שאותם נעדיף להשאיר מטושושים קלות.
לסיום, ניתן לכל השכבה שקיפות חלקית של בערך 75%-60%, באופן כזה, נשמור על חלק מהטקסטורה הטבעית של העור.

כך אמורה להיראות התמונה אחרי השלב הזה:

3. קצת אור

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

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

אחרי שטישטשנו את ההעתק של הערץ הכחול, נבחר שוב בערוץ RGB ונחזור לחלון השכבות.
נלך לתפריט Select>Load Selection שם נבחר מתוך תיבת הבחירה את האפשרות Blue Copy. כך:

נלחץ OK, ונקבל בחירה המבוססת על הערוץ הכחול המוטשטש.
נשתמש בבחירה זו כדי ליצור שכבה חדשה (Ctrl+J).
לשכבה שנוצרה נגדיר שיטת כיסוי של Screen, ושקיפות של כ-50%. כך:

התוצאה היא אור רך שגורם לעור להיראות יותר בוהק וזוהר.
אמנם נשארו אזורים מסויימים שאותם אולי נרצה להבהיר עוד קצת. את זה נוכל לעשות ע"י הכלי Shadow/Highlight שנמצא תחת התפריט Image>Ajustments. כלי זה מפחית את מידת הכהות של האזורים החשוכים בתמונה.

אחרי שהבהרנו את האזורים הכהים, ייתכן שנרצה להפחית את מידת הרוויה של התמונה שפתאום נראית קצת צבעונית מידי. את זה נעשה בקלות בעזרת כלי Hue/Saturation (גוון/רוויה).

בשלב זה, התמונה שלנו נראית בערך ככה:

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

4. אופציונלי: שקיות מתחת לעיניים

בעזרת כלי החותמת, נדגום אזור מתחת לחלק הכהה שמתחת לעיניים, ונשכפל אותו על גבי השקית הכהה. מומלץ להשתמש במברשת עם שקיפות חלקית, כך הדבר ייראה טבעי יותר. להיזהר שלא לפגוע בעפעפיים.

מקווה שהמדריך הזה יהיה שימושי עבורכם, להתראות במדריך הבא!
יהושע.

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

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

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

אז בשביל כולם, העליתי אוסף לוגואים מוכנים ענק. יש כאן כמה מאות… (לא היה לי כח לספור…)

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

לבריאות!
יהושע.

מדריך פשוט ליצירת אפקט "רולאובר" – (מעבר עכבר) לבוני אתרים. מבוסס על CSS. שיטה יעילה, חכמה ופשוטה, שאינה משתמשת ב-javascript, ופותרת בעיה נפוצה של זמן טעינת התמונה השניה.

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

במדריך זה, נשתמש בגליונות עיצוב (CSS) כדי ליצור אפקט מעבר עכבר שמשתמש בתמונה בודדת כדי ליצור אפקט רולאובר מוצלח.

נצטרך 3 דברים:

1. כפתור בצורת DIV, אותו נכניס בגוף הדף.
2. סגנון CSS מיוחד לכפתור, אותו נכניס בHEAD או בקובץ CSS חיצוני.
3. תמונה בודדת שתשמש לצורך האפקט.

כפתור

כך נראה תג הDIV של הכפתור:

<div id="roll"><a href="#">CLICK ME!</a></div>

בינתיים לא עשינו שום דבר מיוחד. הקסם מסתתר בסגנון ה-CSS שנקרא roll.

סגנון CSS

בסגנון הCSS הזה הגדרנו בשלב ראשון, שגודלו של הכפתור הוא 30X120 פיקסלים, הטקסט שבתוכו מיושר לאמצע, ויש לו תמונת רקע ששמה bg.gif (אותה נכיר מיד). הגדרנו גם שתמונת הרקע צמודה לתחתית הכפתור.
בשלב שני קבענו איך מתנהג לינק שנמצא בתוך הכפתור. -הוא תופס את כל שטח הכפתור. כלומר, ששטח הלינק מתפרש על פני כל שטח הכפתור ולא מצטמצם לגבולות הטקסט.
בשלב אחרון, קבענו שבמעבר עכבר על הלינק, תוצג אותה תמונת רקע, אבל היא תוצמד לראש הכפתור.

תמונה

כפי שציינתי, התמונה מכילה את שני המצבים. אבל לא רק שהיא מכילה את שני המצבים, אלא שיש פה טריק נוסף, היא רק ברוחב פיקסל אחד. מה שגורם לה להיות קלה במיוחד. ובכן, הנה היא לפניכם: bg.gif
כן, זה הכל… תמונה ששוקלת פחות מק"ב בודד. חציה התחתון מוצג לפני מעבר העכבר, וחציה העליון, מוצע במעבר העכבר. (כשהיא מתוחה לרוחב של 120 פיקסלים.)

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

לחץ כאן כדי לראות דוגמה פועלת של המדריך.

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

בסופו של דבר תיקנתי את המחשב הישן, אם כי הפיתוי לרכוש מחשב חדש הוא חזק. לא מן הנמנע שבקרוב אכנע לפיתוי ואגשים פנטזיה של 64 ביט. (עם 8GB זיכרון DDR3…מעבד i7… )

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

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

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

מחכה לתגובותיכם,
יהושע מרום