บทที่3 การออกแบบเว็บเพจด้วย Photoshop CS6
เนื้อหาสาระ
การออกแบบเว็บไซต์หากต้องการให้เว็บไซต์ที่ออกแบบมีความสวยงาม
มีสีสันมีภาพสวยงามเหมาะสมกับการออกแบบเว็บไซต์ โปรแกรมที่เหมาะสมสำหรับปฏิบัติการคือโปรแกรมPhotoshop CS6เป็นโปรแกรมที่สามารถออกแบบตัวอักษรให้สวยงามตกแต่งภาพให้มีขนาดสีสันความสว่าได้ตามต้องการจากนั้นบันทึกเป้นไฟล์ชนิดที่สามารถนำไปใช่ในการออกแบบเว็บไซต์ได้ตามต้องการ
3.1
ความรู้พื้นฐานโปรแกรม Adobe Photoshop CS6
โปรแกรม Adobe Photoshop CS6คือ
โปรแกรมที่สามารถสร้างออกแบบกราฟฟิคแก้ไขภาพเคลื่อนไหวรวมทั้งการออกแบบหน้าเว็บเพจซึ่งโปรแกรม
Adobe โฟโต้ช็อปซีเอส6มีเครื่องมือเพื่อสนับสนุนการสร้างชิ้นงานประเภทต่างๆได้แก่ประเภทสิ่งพิมพ์งานนำเสนอตลอดจนการออกแบบเว็บเพจดังนั้นโปรแกรม
Adobe โฟโต้ช็อปซีเอส 6
จึงเป็นโปรแกรมที่มีความนิยมสูงและเหมาะสมกับการสร้างชิ้นงานด้านกราฟฟิกการแก้ไขภาพและการออกแบบประเภทต่างๆ
3.1.2ส่วนประกอบของโปรแกรม
Adobe โฟโต้ช็อปซีเอส 6
แสดงรูปด้านล่าง
1. แถบเมนู
คือกลุ่มเมนูที่รวบรวมคำสั่งต่างๆเพื่อควบคุมการทำงานกอบด้วยเมนูต่างๆดังต่อไปนี้Menu
file คือเธอชุดคำสั่งสำหรับการจัดไฟล์ภาพ
2. Menu
Edit คือแถบชุดคำสั่งที่ทำหน้าที่ในการแก้ไขปรับแต่งภาพชนิดงานต่างต่างที่สร้างขึ้นเช่นการปรับขนาดของภาพการคัดลอกภาพการมองภาพการย้อนกลับการทำงานเป็นต้น
3. Manu
Image คือแถบชุดคำสั่งที่ทำหน้าที่จัดการและปรับแต่งไฟล์ภาพเช่นสีแสงปรับแต่งภาพความคมชัดปรับเปลี่ยนโหมดให้เป็นขาวดำเป็นต้น
4.
Manu Layer คือแบบชุดคำสั่งที่ทำหน้าที่จัดการต่างๆของLayerเช่นการลบเพิ่มLayerและการย้ายตำแหน่งลำดับของได้Layerเป็นต้น
5. Menu
Select คือแถมชุดกลุ่มคำสั่งที่ทำหน้าที่จัดการกับการเลือกวัตถุหรือพื้นที่แบบต่างๆเพื่อนำไปใช้ร่วมกับคำลังอื่นเช่นเรื่องพื้นที่เพื่อย้ายตำแหน่งเลือกพื้นที่เพื่อเปลี่ยนสีเป็นต้น
6.
Menu Filter คือแถบชุดคำสั่งที่ใช้ปากและ effect พิเศษให้กับวัตถุ
7.
Menu 3D คือ แถบชุดคำสั่งที่ใช้ในการสร้างภาพแบบสามมิติ
8.
Menu View คือคำสั่งที่ใช้ปรับแต่งแก้ไขและแสดงผลให้หน้าจอโปรแกรมเช่นบรรทัดและการย่อ/ขยายของมุมภาพ
9.
Menu Window คือแถบชุดคำสั่งที่เกี่ยวข้องกับการแสดงและการซ่อนของแถบเครื่องมือต่างๆ
10.Menu Help คือถ้าซื้อคำสั่งที่เกี่ยวข้องกับการแสดงและการสอนของแถบAdobe
Photoshop CS6
2. เมนูของพื้นที่ทำงาน
Panel menu
Panel (พาเนล) เป็นวินโดว์ย่อย ๆ ที่ใช้เลือกรายละเอียด
หรือคำสั่งควบคุมการทำงานต่าง ๆ ของโปรแกรม ใน Photoshop มีพาเนลอยู่เป็นจำนวนมาก
เช่น พาเนล Color ใช้สำหรับเลือกสี, พาเนล
Layers ใช้สำหรับจัดการกับเลเยอร์ และพาเนล Info ใช้แสดงค่าสีตรงตำแหน่งที่ชี้เมาส์
รวมถึงขนาด/ตำแหน่งของพื้นที่ที่เลือกไว้
3. พื้นที่ทำงาน Stage
หรือ Panel
เป็นพื้นที่ว่างสำหรับแสดงงานที่กำลังทำอยู่
4. เครื่องมือที่ใช้งาน
Tools panel หรือ Tools box
Tool Panel (ทูลพาเนล) หรือ กล่องเครื่องมือ
จะประกอบไปด้วยเครื่องมือต่าง ๆ ที่ใช้ในการวาด ตกแต่ง และแก้ไขภาพ
เครื่องมือเหล่านี้มีจำนวนมาก ดังนั้นจึงมีการรวมเครื่องมือที่ทำหน้าที่คล้าย ๆ
กันไว้ในปุ่มเดียวกัน โดยจะมีลักษณะรูปสามเหลี่ยมอยู่บริเวณมุมด้านล่างดังภาพ 2 เพื่อบอกให้รู้ว่าในปุ่มนี้ยังมีเครื่องมืออื่นอยู่ด้วย
5. สิ่งที่ควบคุมเครื่องมือที่ใช้งาน
Tools control menu หรือ Option bar
Option Bar (ออปชั่นบาร์)
เป็นส่วนที่ใช้ปรับแต่งค่าการทำงานของเครื่องมือต่าง ๆ
โดยรายละเอียดในออปชั่นบาร์จะเปลี่ยนไปตามเครื่องมือที่เราเลือกจากทูลบ็อกซ์ในขณะนั้น
เช่น เมื่อเราเลือกเครื่องมือ Brush (พู่กัน)
บนออปชั่นบาร์จะปรากฏออปชั่นที่ใช้ในการกำหนดขนาด และลักษณะหัวแปรง, โหมดในการระบายความโปร่งใสของสี และอัตราการไหลของสี เป็นต้น
3.2เครื่องมือพื้นฐานของโปรแกรม Tools
เครื่องมือพื้นฐานของโปรแกรม Tools
Tool Panel (ทูลพาเนล) หรือ กล่องเครื่องมือ จะประกอบไปด้วยเครื่องมือต่าง ๆ ที่ใช้ในการวาด ตกแต่ง และแก้ไขภาพ เครื่องมือเหล่านี้มีจำนวนมาก ดังนั้นจึงมีการรวมเครื่องมือที่ทำหน้าที่คล้าย ๆ กันไว้ในปุ่มเดียวกัน โดยจะมีลักษณะรูปสามเหลี่ยมอยู่บริเวณมุมด้านล่างดังภาพ 2 เพื่อบอกให้รู้ว่าในปุ่มนี้ยังมีเครื่องมืออื่นอยู่ด้วย
ทำการแบ่งกลุ่มเครื่องมือได้ดังภาพต่อไปนี้
Marquee
ใช้สำหรับย้ายพื้นที่ที่เลือกไว้ของภาพ หรือย้ายภาพในเลเยอร์หรือย้ายเส้นไกด์
3.2เครื่องมือพื้นฐานของโปรแกรม Tools
เครื่องมือพื้นฐานของโปรแกรม Tools
Tool Panel (ทูลพาเนล) หรือ กล่องเครื่องมือ จะประกอบไปด้วยเครื่องมือต่าง ๆ ที่ใช้ในการวาด ตกแต่ง และแก้ไขภาพ เครื่องมือเหล่านี้มีจำนวนมาก ดังนั้นจึงมีการรวมเครื่องมือที่ทำหน้าที่คล้าย ๆ กันไว้ในปุ่มเดียวกัน โดยจะมีลักษณะรูปสามเหลี่ยมอยู่บริเวณมุมด้านล่างดังภาพ 2 เพื่อบอกให้รู้ว่าในปุ่มนี้ยังมีเครื่องมืออื่นอยู่ด้วย
ใช้สำหรับย้ายพื้นที่ที่เลือกไว้ของภาพ หรือย้ายภาพในเลเยอร์หรือย้ายเส้นไกด์
Lasso
ใช้เลือกพื้นที่บนภาพเป็นแนวเขตแบบอิสระ
Magic Wand
ใช้เลือกพื้นที่ด้วยวิธีระบายบนภาพ หรือเลือกจากสีที่ใกล้เคียงกัน
Crop
ใช้ตัดขอบภาพ
Slice
ใช้ตัดแบ่งภาพเพื่อบันทึกไฟล์ภาพย่อย ๆ ที่เรียกว่าสไลซ์ (Slice)
สำหรับนำไปสร้างเว็บเพจ
Eyedropper
ใช้เลือกสีจากสีต่าง ๆ บนภาพ
ไม่มีความคิดเห็น:
แสดงความคิดเห็น