112
שרייבר שגיא מגזין פרפקט פיקסלpixelperfect.co.il

עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

Embed Size (px)

Citation preview

Page 1: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

שגיא שרייברפיקסל פרפקט מגזין

pixelperfect.co.il

Page 2: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מה יש שם בשבילנו שם בחוץ1

Page 3: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

התפיסה שאיתה גדלנו היא שאנחנו האמנים המיוסרים

Page 4: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אבל זה ממש לא נכון - בעולם הדיגיטלי אנחנו סופר מגניבים

Page 5: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

ויש כמות עבודה אין סופית בתחום העיצוב הדיגיטלי

Page 6: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

לקוח

ויש לנו לקוחות - המון לקוחות שם בחוץ

Page 7: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

לקוחות באים בכל מני צורות

Page 8: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים
Page 9: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים
Page 10: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים
Page 11: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

וכאשר הם מגיעים אלינו אנחנו צריכים לדעת לתת להם תשובות

Page 12: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אתרים

אילו סוגי אתרים יש? ומה יש מסביבם שאנו צריכים להכיר ולדעת?

Page 13: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

נניח ולקוח בעל חנות תכשיטים מגיע אלינו

Page 14: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הלקוח רוצה אתר עם כמה עמודים, אתר שרק יציג את העסק שלו

Page 15: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אתר תדמיתי

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

Page 16: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

כמה דוגמאות:

Page 17: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים
Page 18: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים
Page 19: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אתר קטלוגי

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

Page 20: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אתר קטלוגי

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

Page 21: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

דוגמה של אתר קטלוגי - דף הבית

Page 22: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הקטלוג

Page 23: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

דף המוצר

Page 24: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אתר סחר מקווןe-commerce

דוגמה של אתר קטלוגי - דף הבית

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

Page 25: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

דוגמה

Page 26: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

דוגמה

Page 27: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

cssdesignawards.com

השראה מאתרים

awwwards.com

csswinner.com

makebetterwebsites.com

pixelperfect.co.il/inspiration

verynicesites.com

siteinspire.com

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

Page 28: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטים

Page 29: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתר רגיל

HTML + CSS + Javascript (mostly)

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

Page 30: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים
Page 31: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתר רגיל

1024x768px 960x700px

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

ברזולוציה של 960 פיקסלים רוחב על 600-700 פיקסלים לגובה.

Page 32: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

1024x768px 960x700px

סוגי פורמטיםאתר רגיל

1280x768px 1140x700px

היום כבר הרזולוציה גדלה. אנשים משתמשים כבר במסכים רחבים יותר. לכן הנורמה לעיצוב .1140x700-1280. ואם מתחשבים בטווח הבטיחות אז נעצב לx768 אתר השתנתה לגודל של

Page 33: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

1024x768px 960x700px

pixelperfect.co.il/freebies/free-hebrew-web-design-template

סוגי פורמטיםאתר רגיל

1280x768px 1140x700px

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

Page 34: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתרי מובייל

ישנם עוד סוגים של אתרים כמו אתרי מובייל. אלו אתרים “מותאמים” לצפייה בסמארטפונים ולפעמים גם טבלטים.

Page 35: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתרי מובייל

Jquery mobile בשם Javascript לרוב אתרים אלו נעשים על ידי שימוש בספריית

Page 36: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הנה דוגמה לאתרים מותאמים למובייל

Page 37: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתרים רספונסיביים

אתרים רספונסיביים. זה מה שהולך היום! נכון ל-2012 זהו הסוג החם והחדש של האתרים.

Page 38: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתרים רספונסיביים

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

Page 39: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

סוגי פורמטיםאתרים רספונסיביים

http://designmodo.com/responsive-design-examples/תוכלו למצוא דוגמאות בקישור הבא:

Page 40: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

http://www.smashingmagazine.com

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

Page 41: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

שמקווצים את הדפדפן - שימו לב איך התפריט הצדדי עבר למעלה.

Page 42: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 43: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מצב מובייל. במצב זה הטקסטים גם גדלים על מנת

לאפשר קריאות נוחה גם בסמארטפונים.

Page 44: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 45: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מערכות ניהול תוכן

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

שלו. בעצם אתר ששולט לו בתכני האתר שלו.

Page 46: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מערכות ניהול תוכן

הלקוח מקבל שם משתמש וססמה על מנת להיכנס למערכת ניהול האתר שלו

Page 47: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מערכות ניהול תוכן

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

Page 48: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מערכות פופולאריותמערכות ניהול תוכן

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

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

אתרים ובלוגים

Page 49: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אתרים ובלוגים

סחר מקוון

מערכות פופולאריותמערכות ניהול תוכן

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

Page 50: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מסביב לאתר

אז מה יש לנו עוד שלקוחות יכולים לבקש?

Page 51: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מסביב לאתרבאנרים

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

Page 52: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

מסביב לאתררי-סייזינג

בנוסף עם כל עבודת עיצוב באנר באה עבודת רי-סייזינג לגדלי הבאנרים על מנת להתאים אותם לאתרים השונים והמיקומים השונים שהם יוצגו בהם.

Page 53: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

דפי נחיתהמסביב לאתר

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

Page 54: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

CTA (Call to action)

דפי נחיתהמסביב לאתר

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

Page 55: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

ווידג’טים

מסביב לאתרבלוג

וכמובן שיש עוד הרבה עבודות רציניות שלא עברתי עליהם כאן רק מסביב לעיצוב אתרים.

Page 56: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

קומפלט

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

Page 57: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

ישראל ידוע בעולם כ-Startup nation. יש לנו המון סטארטאפים כאן בארץ. והמודעות לעיצוב טוב היא גבוהה מאוד בקרב סטארטאפים בארץ.

Page 58: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הכל מתחיל שליזם יש רעיון

Page 59: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 60: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 61: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 62: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

לוגו ותדמית

שלקוח פונה אליכם הוא ירצה שתתנו לו פתרון שלם...

Page 63: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציה

לוגו ותדמית

Page 64: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

לוגו ותדמית

Page 65: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

אייקוניםלוגו ותדמית

Page 66: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

חומרים שיווקיים

אייקוניםלוגו ותדמית

Page 67: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

דף פייסבוק

חומרים שיווקיים

אייקוניםלוגו ותדמית

Page 68: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

רקע לטוויטר דף פייסבוק

חומרים שיווקיים

אייקוניםלוגו ותדמית

Page 69: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

רקע לטוויטר דף פייסבוק

ערוץ יוטיובחומרים שיווקיים

אייקוניםלוגו ותדמית

Page 70: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

רקע לטוויטר דף פייסבוק

ערוץ יוטיובחומרים שיווקיים

לוגו ותדמיתכרטיסי ביקוראייקונים

Page 71: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

רקע לטוויטר דף פייסבוק

ערוץ יוטיובחומרים שיווקיים

לוגו ותדמיתכרטיסי ביקוראייקונים

חולצות+ווסאח

Page 72: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

אפליקציהאתר לאפליקציה

רקע לטוויטר דף פייסבוק

ערוץ יוטיובחומרים שיווקיים

לוגו ותדמיתכרטיסי ביקוראייקונים

חולצות+ווסאח

עוד פרינט

Page 73: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

איך נדע לתת מענה בצורה מקצועית להכל?

Page 74: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

התשובה היא פשוטה... יותר פשוטה ממה שאתם חושבים.

Page 75: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

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

Page 76: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

guidelines-ו ,template, tutorial שאתם מחפשים חומר, חפשו בצורה ספציפית עם המילים

Page 77: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

iOSteehanlax.com/downloads/ios-5-gui-psd-iphone-4s

http://mobile.smashingmagazine.com/2010/11/17/designing-for-iphone-4-retina-display-techniques-and-workflow/

טמפלט לעיצוב לאייפון - רטינה

מאמר מצויין על עיצוב לאייפון ואיך לחתוך

http://mobile.smashingmagazine.com/2010/04/16/design-tips-for-your-ipad-app/

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

http://www.ipadatelier.com/design-for-ipad.html

אוסף של כלים ומאמרים לעיצוב לאייפד

http://www.teehanlax.com/downloads/ipad-gui-psd-retina-display/טמפלט לעיצוב ממשקים לאייפד החדש - עם רטינה

http://blog.cocoia.com/2010/iphone-4-icon-psd-file/

טמפלט לעיצוב אייקונים לאייפון ואייפד

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

Page 79: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

http://msdn.microsoft.com/en-us/library/windows/apps/hh700403.aspx

Windows 8

http://msdn.microsoft.com/library/windows/apps/hh779072

ערכה שלמה של אלמנטים וממשק לעיצוב אפליקציות מטרו לווינדוס 8

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

http://www.netcraft.co.il/blog/?p=7454

מאמר של נטקראפט על הממשק של אפליקציות מטרו וקישורים יעילים

Page 80: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

http://www.smashingmagazine.com/2011/12/22/freebie-new-twitter-profile-page-gui-psd/

Social Media

http://www.nealcampbell.com/2011/12/17/facebook-timel-for-photoshop/

הטמפלט לעיצוב דף בטוויטר

טמפלט להורדה ודוגמאות לטיימליין של פייסבוק

http://club.richkid.co.il/facebook-timeline/

טמפלט לעיצוב טיימליין של פייסבוק מאת ריצ’קיד - יש להזין אימייל להורדה

Page 83: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

טיפים מהנסיון האישי שלי2

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

Page 84: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

להיות בעניינים השראה השראה השראה!

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

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

אנחנו נמצאים בתחום שאם לא נשאב בו השראה אנחנו נשאר מאחור מהר מאוד.

Page 85: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

להיות בעניינים השראה השראה השראה!

יש שני אתרים מעולים שמומלץ להתעדכן בהם יומית: דריבל וסמאשינג מגזין.

Page 86: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

להיות בעניינים השראה השראה השראה!

דריבל - dribbble.com - רשת חברתית למעצבים איכותיים. אפשר להיכנס שם לשאוב השראה מדברים לפני שפותחים את הפוטושופ.

Page 87: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

להיות בעניינים השראה השראה השראה!

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

Page 88: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

http://www.dribbble.com

http://www.smashingmagazine.com/

http://www.noupe.com

http://webdesignledger.com

http://sixrevisions.com

http://webdesignerwall.com/

http://www.land-of-web.com

http://www.onextrapixel.com

http://designinstruct.com

http://line25.com/

http://www.blog.spoongraphics.co.uk/

http://the99percent.com/

http://www.developerdrive.com/

http://www.netmagazine.com/

http://designmodo.com/

http://speckyboy.com/

http://mashable.com/

http://www.webdesignerdepot.com/

http://designshack.net/

http://www.uxbooth.com/

http://thinkvitamin.com/

http://www.alistapart.com/

http://johnnyholland.org/

http://css-tricks.com/

http://dailyinspiration.nl/

http://inspirationfeed.com/

http://fribbble.com/

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

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

Page 89: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

צברו נסיוןהתחילו לעבוד בתחום

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

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

דבר שלא מובן מאליו.

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

פתוחות בפניכם.

אז לפני הלקוח הראשון ובמיוחד בהתחלה, איך אפשר לצבור נסיון ותיק עבודות?

Page 90: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

צברו נסיוןהתחילו לעבוד בתחום

v

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

Page 91: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

צברו נסיוןהתחילו לעבוד בתחום

v

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

Page 92: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

צברו נסיוןהתחילו לעבוד בתחום

v

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

Page 93: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הדברים הטכניים הם יותר מחצי הדרךהכינו את הקרקע לעבודה

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

Page 94: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הדברים הטכניים הם יותר מחצי הדרךהכינו את הקרקע לעבודה

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

Page 95: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הדברים הטכניים הם יותר מחצי הדרךהכינו את הקרקע לעבודה

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

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

Page 96: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הדברים הטכניים הם יותר מחצי הדרךהכינו את הקרקע לעבודה

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

Page 98: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

עם חברים, משפחה, מכריםדברו על זה

תתחילו להפיץ את השמועה שיש מעצב חדש בשכונה.

Page 99: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

עם חברים, משפחה, מכריםדברו על זה

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

הזמנה לבת מצווה. כל עבודה מהווה קפיצת מדרגה לעבודה יותר גדולה.

Page 100: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 101: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 102: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

והאנשים שהם סיפרו להם עליכם יעבירו הלאה את השם אפילו אם הם לא היו לקוחות שלכם.

Page 103: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

ומתישהו יפנו אליכם חלק מהאנשים ותתחילו לקבל לקוחות.

Page 104: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

הם יזכרו לאט לאט אבל זה יגיע, כי התחלתם גל.

Page 105: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

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

Page 106: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

ומאחל לכם שתגיעו למצב האופטימלי.

Page 107: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

לכל חברה אפשריתשלחו קורות חיים

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

כל מייל בנפרד ובאופן אישי.

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

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

Page 108: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

יש גם חיים לחיותהלימודים זה לא הכל

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

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

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

Page 109: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

להתנסות בהכל ולהרחיב אופקיםלהתפרע!

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

במהלך הלימודים.

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

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

Page 110: עיצוב בעולם הדיגיטלי - הסבר, טיפים וקישורים יעילים

ביטול האגו ועזרה הדדיתNo Ego

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

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

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