วันจันทร์ที่ 13 สิงหาคม พ.ศ. 2555

สร้างโปรเตอร์แบบเก๋ๆด้วย Photoshop

สร้างโปรเตอร์แบบเก๋ๆด้วย Photoshop


1. สร้าง file ใหม่ แล้วทำการวาดรูปสี่เหลี่ยมโดยใช้ Pen Tool จากนั้นให้เลือกสีแล้วใส่สีให้กับรูป


2. Double Click ที่ layer ข้อ 1  เลือก Drop Shadow แล้วทำการตั้งค่า


จะได้ตามด้านล่าง



3. วาดรูปสีเหลี่ยมด้านในอีกครั้งหนึ่ง แล้วใส่เงาให้โดยทำเหมือนกับข้อ 2


4. ใช้ Pen Tool ในการสร้างรูปเทปกาวที่มุมทั้งสี่


5. จากนั้นเลือกที่เลเยอร์เทปกาวอันใดอันหนึ่ง แล้ว double click จากนั้นให้เลือกที่ Pattern Overlay จากนั้นเลือก pattern ตามรูปได้เลย


จากนั้นเลือกที่ Stoke แล้วตั้งค่า


6. จะได้ตามด้านล่าง จากนั้นให้ Click ขวา ที่ เลเยอร์ที่ดังกล่าว แล้วเลือก copy layer style แล้วไปที่เลเยอร์อีก 3 เลเยอร์ที่เป็นมุมทั้งสาม แล้ว click ขวาเลือก paste layer style 


จากนั้นเลือกเลเยอร์ทีละมุม แล้วดูในแทปของเลเยอร์ให้เลือก Difference 


จะได้ตามด้านล่าง


7. ใส่รูปภาพ หรือข้อความที่เราต้องการลงไปได้เลย แค่นี้เราก็ได้โปรเตอร์เก๋ๆสไตล์ัตัวเองแล้ว

การ copy ข้อความใน textarea

การ copy ข้อความใน textarea
บทความนี้ผมจะเอา script ที่ว่าเวลาคลิกเมาส์ใน textarea แล้วจะทำการไฮไลท์และคัดลอกข้อความใน textareaนั้นออกมา
1. สร้างไฟล์ demo.html เพื่อใช้ในการทดสอบ Script นะครับ แล้วให้ copy script ด้านล่างแล้วนำไปวางไว้ใน tag <head>...</head> นะครับ
<script type="text/JavaScript">
function copy(name){
var tempval=document.getElementById(name);
tempval.focus();
tempval.select();

try {
therange=tempval.createTextRange()
therange.execCommand("Copy")
} catch (err) {}

}
</script>

2. หลังจากนั้นเราก้อมาสร้าง textarea ที่จะใส่ข้อความ กันต่อเลยครับ โดยตั้งชื่อของ textarea ว่า "test_copy"
<textarea name="test_copy" cols="80" rows="3" id="test_copy" onClick="copy('test_copy')">Webthaidd.COM นิตยสารออนไลน์ ฉบับแรกของคนไทย สอน php, dreamweaver, photoshop, เพลงออนไลน์, Tools online, Free Background, Free icon, Free bullet, Free font</textarea>


คลิกดูตัวอย่าง

วันพุธที่ 1 สิงหาคม พ.ศ. 2555

วิธีใช้โปรแกรมโฟโต้ช็อปพื้นฐาน Adobe Photoshop


Adobe Photoshop CS6


โฟโต้ช็อป รุ่นเก่า


 โฟโต้ช็อปเวอร์ชั่น 4 หรือ CS4

 ในบรรดาโปรแกรมกราฟฟิคจัดการภาพ ในอดีตและปัจจุบันยังไม่มีโปรแกรมตัวใดจะมาเทียบเคียง โฟโต้ช็อป ได้ โฟโต้ช็อปได้รับการพัฒนามาอย่างต่อเนื่องและปรับปรุงจุดอ่อนข้อด้อยของรุ่นต่างๆมาจนถึงปัจจุบัน โฟโต้ช็อปยังเป็นสุดยอดโปรแกรมตัดต่อตกแต่งภาพอย่างไม่มีใครปฏิเสธ

เมื่อเราเปิดโปรแกรมขึ้นมาหน้าตาของโฟโต้ช็อปแต่ละรุ่นจะมีความแตกต่างกันเล็กน้อยในส่วนของกล่องเครื่องมือ ซึ่งเป็นเครื่องมือพื้นฐานหลัก ที่อยู่ฝั่งซ้ายของหน้างาน

เราจะมาทำความเข้าใจและรู้จักกับหน้าที่ของเครื่องมือเหล่านี้กันว่าแต่ละตัวมีหน้าที่อย่างไร

 Marquee เป็นกลุ่มเครื่องมือที่ใช้ในการเลือกหรือกำหนดพื้นที่งานตามที่เราต้องการหรือภาษาเทคนิคเราเรียกว่า ซีเล็คชั่น ( Selection)
  Rectangular Marquee Tool - เป็นเครื่องมือในการกำหนดขอบเขตพื้นที่งานแบบสี่เหลี่ยม
Elliptical Marquee Tool        -  เป็นเครื่องมือเลือกขอบเขตแบบวงรี หรือวงกลม
Single Row Marquee Tool   -  เป็นเครื่องมือเลือกขอบเขตแบบเส้นตรงแนวนอน หรือความสูงของพิกเซล
Single Column Marquee Tool - เป็นเครื่องมือเลือกขอบเขตแบบเส้นตรงแนวตั้งหรือ ความกว้าวงของ พิกเซล

 Lasso Tool -เป็นกลุ่มเครื่องมือที่กำหนดขอบเขตของพื้นที่เช่นเดียวกับ Marquee แต่ Lasso จะกำหนดขอบเขตได้อย่างอิสระมากกว่า
Lasso Tool - ใช้เลือกขอบเขตตามที่เราต้องการโดยการ Drag Mouse ให้จุดสุดท้ายมาจบกับจุดเริ่มต้นพอดี
Lasso Tool  Polygonal - ใช้กำหนดพื้นที่แบบเหลี่ยมโดยการคลิก เมาส์ที่จุดแรกและกดคลิกไปเรื่อยๆตามบริเวณที่เราต้องการจนวนมาจบที่จุดเริ่มต้นเช่นเดียวกัน หรือ ดับเบิ้ลคลิกเพื่อหยุดก็ได้

Lasso Tool Magnetic  - เป็นการเลือกขอบเขตแบบอัตโนมัติ โดยการลากเม้าส์จากจุดเริ่มต้นไปตามพื้นที่ที่เราต้องการดดยโปรแกรมจะทำการอ่านค่าสีที่มีความแตกต่างกัน พื้นที่จะกว้างหรือแคบขึ้นอยู่กับสีบริเวณนั้น

 กลุ่มนี้เป็นเครื่องมือที่แบกแยกภาพออกเป็นชิ้นเล็กๆเพื่อนำไปใช้งานบนเว็บไซต์ทั่วไป เครื่องมือชุดนี้ใช้ประกอบการการเขียนเว็บออกแบบเว็บซึ่งคนทั่วไปมักไม่ได้ใช้และจะใช้ร่วมกับโปรแกรมสร้างเว็บอย่าง DW ( เนื่องจากเราไม่สามารถนำไฟล์ภาพทั้งภาพขึ้นไปยังเว็บได้
Slice Tool - แบ่งภาพออกเป็นส่วน
Slice  Select Tool - เป็นเครื่องมือ เลือกชิ้น Slice ที่ตัดแล้ว เพื่อนำไปจัดการบนเว็บ


Magic Wand Tool - เป็นเครื่องมือเลือกขอบเขตอัตโนมัติอีกตัว

Crop Tool            - เป็นเครื่องมือที่ใช้ในการตัดส่วนเกินของภาพ เลือกเฉพาะส่วนที่ต้องการ

Eyedropper tool -เป็นเครื่องมือที่ใช้ดูดสีจากภาพ
Measure Tool -    เป็นเครื่องมือวัดหรือไม้บรรทัด






Spot Healing -เป็นเครื่องมือในการไล่สีหรือเกลี่ยสี หรือลบจุดในภาพ
Healing Brush -เป็นเครื่องมือที่ใช้ในการ ก๊อปปี้ ส่วนที่ต้องการมาทับส่วนที่เราไม่ต้องการ พร้อมทั้งเกลี่ยสีให้กลมกลืน
Patch Tool - เป็นเครื่องมือที่ทำงานเหมือนกับ Healing Brush แต่ใช้พื้นที่มากกว่า
Red Eye Tool - เป็นเครื่องมือที่ใช้กำจัดจุดตาแดงที่เกิดจากการถ่ายภาพแล้วที่ดวงตาจะมีสีแดง ใช้เครื่องมืตัวนี้กำจัด



Brush Tool - เป็นเครื่องมือที่ใช้ระบายสี หรือพู่กันระบายสี สามารถกำหนดค่าสีให้มีลักษณะต่างกันออกไปได้ตามแต่ผู้ใช้
Pencil Tool - เป็นดินสอ มีหลักการทำงานเหมือนพู่กันแต่เส้นจะมีความคมชัดกว่า

Clone stamp Tool - เป็นเครื่องมือในการทำสำเนาภาพโดยต้องมีจุดเริ่มต้นที่ภาพต้นฉบับก่อน โดยทำงานร่วมกับ เครื่องมืออื่นในคีย์บอร์ด
 Pattern Stamp -เป็นเครื่องมือที่ทำงานคล้ายกับ Clone แต่จะทำการวาดได้เลยโดยไม่ต้องใช้ร่วมกับคีย์บอร์ด ภาพจะต่อเนื่องตามชนิดของหัวแปรงที่เราเลือก

History Brush Tool - เป็นเครื่องมือที่ใช้ในการลบ เอฟเฟ็กท์ บางส่วนของภาพออกไป
 Art History -    เป็นเครื่องมือที่ใช้บิดเบือนค่าสีและรูปทรงให้เพี้ยนไปจากเดิมทำให้ภาพถ่าย มีความคล้ายกับภาพเขียนสีได้
Eraser Tool - เป็นยางลบพื้นฐานทั่วไปที่ใช้ลบงานส่วนที่เราต้องการแก้ไขหรือดัดแปลงหรือไม่ต้องการออก
Background Eraser - เป็นยางลบที่ใช้ลบพื้นหลังของภาพหรือส่วนที่เราไม่ต้องการออก โดยการคลิกไปตามพื้นที่ที่เราต้องการลบ ( เครื่องมือตัวนี้ผมไม่แนะนำให้ใช้ เพราะจะทำให้โปรแกรมค้างได้ โดยเฉหพาะในเวอร์ชั่น CS4 ลงไป )

Magic Eraser -  เป็นยางลบที่ใช้ลบพื้นหลังที่เป็นสีเดียวกัน และแตกต่างจากสีของภาพชัดเจน โดยการคลิกเพียงครั้งเดียวก้สามารถลบได้ แต่ควรใช้ด้วยความระมัดระวังถ้าสีพื้นหลังมีสีเดียวกับสีของภาพที่เราต้องการเก็บยางลบนี้จะลบภาพไปด้วย ทำให้เราเสียเวลา

Dodge Tool  - เป็นเครื่องมือที่ใช้เพิ่มความสว่างให้ภาพ แต่ควรใช้ด้วยความระวังเช่นกันเพราะจำทำให้ภาพเบลอได้
Burn Tool - เป็นเครื่องมือที่เติมความมืดเข้าไปในส่วนต่างๆของภาพ เช่นที่เราต้องการสร้างเงาหรือขอบภาพในมุมมืดเพื่อสร้างให้ภาพมีมิติขึ้น

Sponge Tool - เป็นเครื่องมือที่ใช้ในการดูดซับสีออกจากภาพในส่วนที่เราต้องการเน้น หรือให้ภาพจางลงในบางจุด



Gradient Tool - เป็นเครื่องมือที่ใช้เติมไล่ระดับเฉดสี จากอ่อนไปเข้ม
Piant Bucket -เป็นกระป๋องสำหรับเทสีลงไปในพื้นงานที่ต้องการ แต่จะเป็นสีโทนเดียวไม่สามารถไล่ระดับสีได้





Pen Tool -เป็นเครื่องมือในการสร้างเส้น Path ในแบบต่างๆกลุ่มนี้เป็นกลุ่มสร้าง Pathและปรับแต่ง





เป็นกลุ่มเครื่องมือที่ใช้ในการพิมพ์ ทั้งแบบธรรมดาและแบบ Maskทั้งแนวตั้งบนลงล่างและแนวนอนซ้ายไปขวา
เป็นกลุ่มเครื่องมือในการวาดรูปทรงและเส้นPath เป็นแบบเวคเตอร์เพื่ออกแบบชิ้นงานอื่นๆตามที่เราต้องการ
บันทึกข้อมูลเกี่ยวกับชิ้นงานและสามรถใส่เสียงลงไปได้


ใช้เลื่อนพื้นที่ทำงานกรณีที่งานมีหลายเลเยอร์ Layer
แว่นขยายเพื่อขยายชิ้นงานในส่วนที่เราต้องการตกแต่งให้ละเลียดให้เห็นชัดเจน

เครื่องมือบรรจุสี ทั้ง Forground  และ Background สลับไปมาตามที่ต้องการ





ส่วนนี้จะมีในแค่รุ่น CS2 ลงไปเท่านั้น ใช้ในการเชื่อต่อโปรแกรม แอนิเมชั่นแฟลช





กล่องเครื่องมือ PS รุ่นต่างๆ


การใช้งานเครื่องมือของโฟโต้ช็อปเกือบทุกตัวจะต้องใช้ควบคู่กับเครื่องมืหรือชุดคำสั่งอื่นร่วมด้วย เช่น คีย์บอร์ด และเครื่องมือบนแถบเครื่องมือ Tool Bar นอกจากนี้โฟโต้ช็อปยังมีเครื่องมือและชุดคำสั่งงอื่นอีกมากมายในชุดคำสั่ง เช่น ในเมนู File ,Edit,Image ,Select ,Layer , Filter ,Window เป็นต้นซึ่งแต่ละชุดมีเครื่องมือที่ซับซ้อนและสูงขึ้นที่ผู้ใช้จะต้องศึกษาและเรียนรู้เพิ่มเติมและพัฒนาทักษะเราอย่างต่อเนื่องเพื่อให้เกิดความชำนาญในการใช้เครื่องมือ



การเปลี่ยนสีพื้นหลังและแต่งสีให้ภาพที่ต้องการเน้น


ภาพที่เกลี่ยสี ให้ดูกลมกลืนกัน
 การสร้างภาพแบบลายเส้น เวคเตอร์

ภาพกล่องของขวัญที่สร้างขึ้นจากการออกแบบขึ้นมาจากสิ่งที่ไม่มีอยู่จริงยกเว้นโบว์



การออกแบบการ์ดอวยพรในโอกาสต่างๆ


ภาพที่เกิดจากการผสมเลเยอร์และออกแบบผสมจากภาพจริงและกราฟฟิคที่สร้างมาใหม่


เป็นกราฟฟิคร้อยเปอร์เซ็นโดยไม่มีส่วนที่เป็นภาพจริงอยู่เลยแต่ใช้วิธีเทียบเคียงจนเหมือนจริง


การใช้แมสค์บังภาพบางส่วนเพื่อให้เห้นความแตกต่าง



การบิดภาพโดยใช้เครื่องมือในกลุ่ม Edit


การสร้างภาพแบบเวคเตอร์


การออกแบบปกหนังสือโดยไม่มีภาพจริงผสมอยู่เลย


การปรับแสงและแต่งบรรยากาศจากภาพถ่ายจริงที่มีเพียงดอกหญ้าเท่านั้น


การสร้างภาพจากเครื่องมือชุด 3 D 



การสร้างภาพจากเครื่องมือชุด Pen Tool โดยไม่มีภาพจริงปนอยู่เลย


การสร้างภาพแบบผสมเลเยอร์และใช้ภาพถ่ายจริงประกอบเข้ากับงานกราฟฟิคภาพจริงในนี้คือภาพคนและพื้นหลังที่เป็นดินสอและบังด้วย แมสค์



การย้อมสีภาพเพื่อให้มุมมองใหม่ๆกับภาพ (เป็นภาพเดียวกับภาพดอกไม้ข้างบนที่เกลี่ยสี)

กังวาล ทองเนตร