חלקה צבע כותרת Photoshop Tutorial

21 מרס 2006 על ידי Oli · 15 תגובות




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


זה העיצוב המוגמר ייראה כך:
מדרון חלקלק כותרת הדרכה

כדי להתחיל, ליצור מסמך רחב 770px x 200px גבוה.
בחרו בכלי מלבן מעוגל, להגדיר את הרדיוס כדי 10px ולצייר את הצורה עבור הכותרת:

מדרון חלקלק כותרת הדרכה 1

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

מדרון חלקלק כותרת הדרכה שלב 2

בשלב הבא, 'כיסוי צבע' לחץ ולתת לו הגדרות אלה:

מדרון חלקלק כותרת הדרכה שלב 3

לבסוף, לחץ על "שבץ" ולתת לו את ההגדרות האלה:

מדרון חלקלק כותרת הדרכה צעד 4

צורה הכותרת שלך צריכה עכשיו להיראות כך:

מדרון חלקלק כותרת הדרכה צעד 5

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

מדרון חלקלק כותרת הדרכה צעד 6

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

מדרון חלקלק כותרת הדרכה צעד 7

לחץ על אישור בר הניווט שלך עכשיו צריך להיראות כך:

מדרון חלקלק כותרת הדרכה צעד 8

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

מדרון חלקלק כותרת הדרכה צעד 9

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

מדרון חלקלק כותרת הדרכה צעד 10

הטקסט שלך צריך עכשיו להיראות כך:

מדרון חלקלק כותרת הדרכה צעד 11

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

מדרון חלקלק כותרת הדרכה צעד 12

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

Nav שלך עכשיו מלא:

מדרון חלקלק כותרת הדרכה הסופי

מדרון חלקלק כותרת הדרכה לעיצוב הסופי

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

מדרון חלקלק כותרת הדרכה

הורד את. Psd כאן


לעבור 100% ערבות בעזרתו של האחרונה testking 70-640 שאלות testking 70-642 תשובות testking 642-902 הבדיקה בפועל.

אודות Oli
אוליבר דייל רץ Kooc Media, חברה בבריטניה מבוסס אינטרנט אשר מתמחה Apps אינטרנט, צ'כית, Wordpress הדרכות & Wordpress Plugins .

תגובות

15 תגובות ל "Smooth כותרת Gradient Photoshop Tutorial"
  1. Abs - http://technopedia.info/tech אומר:

    אני אוהב את זה הדרכה, ולכן הגשתי את זה digg ...

  2. סטיבן - אומר:

    האם אתה בחופשה? אני מצפה הדרכה חדש!

  3. Cillaa - אומר:

    יווו! מדריך נחמד!

  4. סטיוארט - http://crazy-tutorials.com אומר:

    מדריך נהדר!
    אני הולך להשתמש בו באתר שלי

    סטיוארט
    ---
    http://crazy-tutorials.com

  5. dom - http://bildupl.de אומר:

    די נחמדה אני אוהב את זה

  6. מרקו - http://www.phpldtemplates.info אומר:

    מדריך נחמד מאוד. הורידו.

  7. אנדריי - http:// ... אומר:

    נו ... גדול. מזל טוב

  8. אדי - http://www.nordicminority.com אומר:

    מדריך נחמד אבל לא יכול להשתמש בו PSD CS 8.0, לשמש במקום FW 8.0.
    אני ישתמש בו בפיתוח אתרי אינטרנט מסוימים.
    להתראות

  9. דיקן - http://www.mcrump.co.uk אומר:

    הודות הדרכה גדול מאוד אני יכול להשתמש בו עבור אתר האינטרנט שלי!

  10. אובדניות, ילד - אומר:

    דומה מאוד לבר הניווט עבור Newgrounds.com

  11. ברוקר - http://www.hiddensuccessstories.com/blog אומר:

    הדרכה טובה. אתה יכול גם להראות לנו איך לפרוס אותו ב-HTML.

  12. גיא - אומר:

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

    בהחלט להשתמש בו! :)

  13. Andly - http://www.giannirusso.info אומר:

    שימושי מאוד הדרכה. הציל אותו ברשימה הדרכה שלי כאן רשימה Photoshop הדרכה שלי [http://www.giannirusso.info/index.php?option=com_weblinks&catid=13&Itemid=40]

  14. ג'ייסון - http://none.com אומר:

    ניס turorial - פקודות לא עובדים או שהם שונים מאוד PS CS3 המורחבת.

מדריך בלוג