• Print

Author Topic: 02/05/09 :: User Bar Sign Tutoria  (Read 1088 times)

0 Members and 1 Guest are viewing this topic.

★oGazettEo★

  • นักกีฬาควิดดิชทีมชาติ ตำแหน่งบีตเตอร์
  • *********
  • Offline Offline
  • Posts: 1698
02/05/09 :: User Bar Sign Tutoria
« on: 02 May 2009, 03:45:58 PM »
User Bar Sign Tutorial - ด้วยตัวท่านเองง่ายๆครับ..เอามาจากเว็บนอกอีกทีนึงง่ะ
http://www.pixel2life.com/forums/index.php?showtopic=6369
สืบเนื่องมาจาก..


ใครอยากเป็นเจ้าของ User Bar ตามรูปที่แทรกมาบ้างจ๊ะ หุหุหุหุ
ท่านใดสนใจบ้างครับ แวะมาชมกันได้นะครับผม
แต่ขอบอกว่า..ตัวท่านก้อสามารถทำขึ้นเองได้ง่ายๆครับผม..


เอาล่ะครับ ไปชมขั้นตอนคร่าวๆได้แระครับผม สำหรับท่านที่ไม่อยากซ้ำแบบใคร..
อ่ะ..ทำเสร็จแล้วก้อเอามาอวดกันบ้างนะครับ เหอๆๆๆ

ขั้นตอนที่ 1
เรียกโปรแกรม Adobe Photoshop ขึ้นมา เลือก "File -> New.." แล้วตั้งค่าตามภาพ 350 x 20 px
แล้วตอบ OK เพื่อเริ่มขั้นตอนต่อไปครับ..

ขั้นตอนที่ 2
ให้ใช้คำสั่ง Fill สีที่เราต้องการ จากภาพตัวอย่างนี้คือ #3093cc

ขั้นตอนที่ 3
สร้าง layer ขึ้นมาใหม่จากแถบเครื่องมือ ให้ใช้ Gradient Tool ลากจากมุมทำองศาอย่างภาพตัวอย่างครับ

จะได้ผลตามภาพ..

ขั้นตอนที่ 4
สร้าง layer ขึ้นมาใหม่อีกหนึ่ง layer ครับ..
เพื่อที่จะนำเอาโลโก้ที่เรามีอยู่มาแทรก..ตามภาพ

มีโลโก้แทรกอยู่ในภาพแล้ว..

พักส่วนตัวหลักนี้เอาไว้ก่อนครับ ต่อไปเราจะแต่ง Pattern ให้ดูงามขึ้นอีกนิด

ขั้นตอนที่ 5
ขั้นตอนนี้เราจะมาแต่งพื้นหลังให้ดูมีลูกเล่นนิดหน่อยนะครับ
ก้อเหมือนเดิมครับ เลือก "File -> New.." แล้วตั้งค่าตามภาพ 5 x 5 px แล้วตอบ OK เพื่อเริ่มขั้นตอนต่อไปครับ..

ขั้นตอนที่ 6
ทำการขยายภาพที่เราสร้างนี้เป็น 1600% ครับ เพื่อความชัดเจนไง
แล้วใช้เครื่องมือ Pencil Tool ตามใจชอบ สีดังภาพตัวอย่าง #004f7c.
เสร็จแล้วก้อไปที่คำสั่ง Edit -> Define Pattern.." เพื่อทำการเซฟ

ซึ่งท่านสามารถนำไปประยุกต์ใช้ในสไตล์ของตัวท่านเองได้ครับ..
ในส่วนนี้เราก้อจบเพียงเท่านี้ครับ..ต่อไปเราจะกลับไปแต่งในส่วนอื่นๆของ User Bar ต่อไปครับ

ขั้นตอนที่ 7
ขั้นตอนนี้นั้นเราจะทำการใส่ Pattern ที่ได้ทำเอาไว้มารวมกัน
เริ่มจากการสร้าง layer ขึ้นมาใหม่ ใช้คำสั่ง "Edit -> Fill.." แล้วปรับค่า "Opacity" ให้ลดลงเหลือ 10%

จัดการพิมพ์ข้อความตกแต่งอีกนิด ก้อจะได้ผลดังภาพตัวอย่างนี้ครับ..
แนะนำให้ใช้ฟอนต์ verdana ขนาด 8px ครับ..ดูดีสุด

ขั้นตอนที่ 8
ต่อไปเป็นการใส่ความมันวาวให้กับ User Bar เหมือนเคลือบด้วยกระจก หรือดูนูนมีมิติครับ
ทำการสร้าง layer ขึ้นมาใหม่ครับ...แล้วก้อ Fill สีขาวลงไปตามภาพตัวอย่างนี้

ขั้นตอนที่ 9
แล้วใช้ "Elliptical Marquee Tool" เลือกส่วนที่ต้องการเอาออกตามภาพตัวอย่างครับ

จากนั้นแล้วปรับค่า "Opacity" ให้ลดลงเหลือ 15%

ขั้นตอนที่ 10
ใส่กรอบเล็กน้อย แล้วจัดการเซฟ "File -> Save As.." ครับ
ก่อนเซฟก่อนทำการรวม layer ด้วยนะครับ หากไม่ต้องการแก้ไขไฟล์อีก

เสร็จแล้วก้อจะได้ตามลักษณะนี้แหละครับ


เครดิต by คุณ eThon / IT-Friend.net

ปล.รึใครขี้เกียจ http://www.userbars.com/ coppyมาแปะ หรือhttp://userbarmaker.com/ ก้ไม่ว่ากัน ลองมาทำเล่นกันหนุกๆ :-D :smile:
« Last Edit: 04 May 2009, 07:17:57 AM by ~ Chicken_rengeR ~ »
เบื่อประเทศไทยจัง~

อัลบัส เต้ ดับเบิ้ลดอร์

  • อิอิอิอิ 555+ งิงิงิ
  • ผู้วิเศษเลือดผสม
  • ****
  • Offline Offline
  • Posts: 181
  • ผม อัลบัส ดัมเบิ้ลดอร์ ครับ
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #1 on: 03 May 2009, 01:00:15 PM »
 >:( ขอบคุนนะครับที่เอา วิทีทำ มาไห้ผม ผมจะเอาไปทำครับ  >:(
เตเต้เองครับ

Magic-Cvidiz

  • =^=//...Magic-Cvidiz....?[z(- -)//]
  • มนุษย์หมาป่า
  • ******
  • Offline Offline
  • Posts: 318
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #2 on: 03 May 2009, 01:19:28 PM »
อื้อ ,, แต่คงเรียนรู้นานหน่อย

55+ จะพยายามทำแล้วมาอวดนะคะ

ขอบคุณที่นำมาฝากคะ !!

love_Ron

  • ปาร์ค แจบอม ณ ซีแอตเทิล.
  • นักเรียนโรงเรียนเวทมนตร์ปี 6
  • *********
  • Offline Offline
  • Posts: 1024
  • ~i'm ฟางฟาง คอน~
    • ●  รู้ลึก รู้ดี (เรื่อง) รูเพิร์ต ●
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #3 on: 04 May 2009, 08:42:55 AM »
ขอบคุณนะค่ะ Shop พังพอดี ๕๕

แล้วจะเอาไปศึกษาค่ะ :"D


MaGiC PiNk !!

  • จงรีบทำในสิ่งที่ยังไม่ได้ทำ ก่อนที่จะสายเกินไป
  • นักเรียนโรงเรียนเวทมนตร์ปี 3
  • ********
  • Offline Offline
  • Posts: 679
  • Love Harry 4 Ever
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #4 on: 11 August 2009, 04:21:33 AM »
เจ๋งค่ะ

เดี๊ยวจะลองไปทำดู
Happy and Smile

rarue78

  • Guest
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #5 on: 21 August 2009, 04:08:12 PM »

 :)

555  เยี่ยมเลยค่ะ

หาวิธีทำมานานแล้ววว...ววว

ตอนนี้ขอกลับไปวางแผนแล้วก็หาภาพสวย ๆ ก่อน

ไว้ทำเสร็จแล้วจะเอามาอวดนะคะ

tongkc

  • Guest
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #6 on: 29 August 2009, 03:56:28 PM »
ขอบคุณค่ะ
จะเอาไปทำค่ะ

loveharry

  • หูไม่ตรงกับตา
  • มนุษย์หมาป่า
  • ******
  • Offline Offline
  • Posts: 278
  • ♥ --> Bigbang --> SHINee ♥
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #7 on: 15 September 2009, 02:33:56 PM »
ขอบคุณมากๆเลยนะคะ 

หามานานแล้ว  เยี่ยมเลยค่ะ ^^
Thanks >>>  P♥tterst♥ryweb

Reseus G.

  • มักเกิ้ล
  • *
  • Offline Offline
  • Posts: 11
  • 'ฮอกวอตส์' รักและเทิดทูน
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #8 on: 14 December 2009, 04:30:14 AM »
ขอบคุณมากๆค่ะ  แหะๆ  ทีแรกทำไอ้ขอบขาวขั้นตอนที่ 9 ไม่เป็น ไม่รู้ว่าเขาทำยังไง ทีนี้รู้แล้ว ขอบคุณมากๆค่ะ  :D

De_PaKaPol

  • ผู้วิเศษเลือดบริสุทธิ์
  • *****
  • Offline Offline
  • Posts: 215
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #9 on: 02 February 2010, 11:50:42 AM »
ขอบคุณครับ
และผมจะบอกเพื่อนต่อครับ

[ [ ◘ อะรี่ พอตเตอร์ ◘ ] ]

  • Hold On ~ Only U ...!
  • มนุษย์หมาป่า
  • ******
  • Offline Offline
  • Posts: 260
  • " Everything " means " Nothing " !!
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #10 on: 26 April 2010, 08:25:24 AM »
ขอบคุณจ้า จะพยายามเรียนรู้้ส่วนที่ไม่เข้าใจละกันนะคะ

^"^  เจ๋งดีเนอะ

caso

  • มักเกิ้ล
  • *
  • Offline Offline
  • Posts: 3
Re: 02/05/09 :: User Bar Sign Tutoria
« Reply #11 on: 29 December 2015, 06:50:12 AM »
เยี่ยมๆ  :D


gclub

  • Print