สอน PhotoShop : การหมุนพื้นที่ทำงานโดย Rotate Canvas

บทที่ 2 การใช้งานโปรแกรม Photoshop : การหมุนพื้นที่ทำงานโดย Rotate Canvas 

การหมุนพื้นที่ทำงานโดย Rotate Canvas

คำสั่งนี้เป็นการหมุนภาพทั้งภาพ โดยแบ่งการหมุนออกเป็น 2 ทิศทาง คือ ทิศทางตามเข็มนาฬิกา และทิศทางทวนเข็มนาฬิกา 

1. คลิกที่เมนู Image > Rotate Canvas จะปรากฏเมนูย่อย 6 คำสั่ง

หมุนภาพ 180 องศา

หมุนภาพ 90 องศา ทิศทางตามเข็มนาฬิกา

หมุนภาพ 90 องศา ทิศทางทวนเข็มนาฬิกา

หมุนภาพแบบกำหนดองศาและทิศทางการหมุน

กลับด้านภาพ > กลับจากซ้ายไปขวา

กลับด้านภาพ > กลับด้านบนเป็นด้านล่าง

2. เลือกคำสั่งตามต้องการ จะได้ภาพตามต้องการค่ะ

สอน PhotoShop : การย่อขยายขนาดของภาพโดยคำสั่ง Image size

บทที่ 2 การใช้งานโปรแกรม Photoshop : การย่อขยายขนาดของภาพโดยคำสั่ง Image size 

1. เปิดไฟล์ภาพที่ต้องการขึ้นมา ( File > Open , Ctrl + O ) คลิกเลือกที่เมนู Image > เลือก Image size

Pixel Dimension ช่องแสดงความกว้างและความสูงปัจจุบัน

- Width ความกว้าง

- Height ความสูง

Scale Styles 

Constrain Proportions การรักษาความสมดุลของภาพ

Resample Image 

ปรับแต่งค่าต่าง ๆ ตามต้องการ จะได้ภาพตามที่เราต้องการค่ะ

Tip & Trick : Constrain Proportions คือการรักษาความสมดุลของภาพ 

แต่ถ้าหากเราต้องการเปลี่ยนทั้งความกว้างและความสูงก็ยกเลิก 

สอน PhotoShop : การเปิด / file Browser การสร้างพื้นที่ทำงาน

บทที่ 2 การใช้งานโปรแกรม Photoshop : การเปิด / file Browser การสร้างพื้นที่ทำงาน 

การเปิดไฟลล์ใหม่ขึ้นมาทำงาน

1. Click ที่เมนู File

2. เลือกคำสั่ง New หรือกด Ctrl + N

3. จะปรากฏหน้าต่าง New 

Name ตั้งชื่อให้กับงาน

Preset ช่องสำหรับเลือกพื้นที่ ที่โปรแกรมกำหนดมาให้

Width ความกว้าง ซึ่งมีหน่วยต่าง ๆ เช่น Pixel , เซนติเมตร , นิ้ว

Height ความสูง ซึ่งมีหน่วยต่าง ๆ เช่น Pixel , เซนติเมตร , นิ้ว

Resolution ค่าความละเอียด ( ซึ่งความละเอียดบนหน้าจอ = 72 )

mode เลือกชนิดของระบบสี

เราจะได้พื้นที่หน้างานเปล่าที่เราต้องการค่ะ

Tip & Trick : กด Ctrl + N จากแป้นคีย์บอร์ด เพื่อสร้างพื้นที่ทำงานใหม่ได้นะค่ะ

สอน PhotoShop : ส่วนประกอบต่างๆ ของโปรแกรม Photoshop CS3

หน้าจอของโปรแกรม Photoshop ประกอบไปด้วยองค์ประกอบต่าง ๆ ดังต่อไปนี้

1. สัญลักษณ์ของโปรแกรม Photoshop

2. แถบเมนู ( Manu Bar )

3. ปุ่มควบคุมการทำงาน

4. แถบกำหนดรูปแบบของเครื่องมือที่ใช้งาน ( Tool Option Bar )

5. กล่องเครื่องมือ ( Tool Box )

6. Palette ที่รวบรวมคุณสมบัติของการทำงานต่างๆ เช่น Navigator , Color , Layer , History เป็นต้น 

7. พื้นที่ทำงาน

Tip & Trick : หัวใจของ Photoshop คือการทำงานเป็น Layer 

Layer คือ ชั้นของรูปภาพ วัตถุ จะไม่เกี่ยวข้องกัน

สอน PhotoShop : จิตวิทยาเกี่ยวกับสี

บทที่ 1 ความรู้เบื้องต้น : จิตวิทยาเกี่ยวกับสี

 

สีนั้นมีความสำคัญอย่างยิ่งในการออกแบบเว็บไซต์ ในการทำงานกราฟฟิคต่างๆ การเลือกสีให้เข้ากับเนื้อหาของงาน จะทำให้งานที่ทำออกมามีความน่าเชื่อถือยิ่งขึ้น และยังส่งผลอย่างมากกับความสวยงามของงานที่ออกมาด้วย ความรู้สึกที่คนส่วนใหญ่มีต่อสีต่างๆ
สีฟ้า     ให้ความรู้สึกสงบ สุขุม สุภาพ หนักแน่น เคร่งขรึม เอาการเอางาน ละเอียด รอบคอบ สง่างาม มีศักดิ์ศรี สูงศักดิ์ เป็นระเบียบถ่อมตน สามารถลดความตื่นเต้น และช่วยทำให้มีสมาธิ แต่ถ้ามีสีน้ำเงินเข้มเกินไป ก็จะทำให้รู้สึกซึมเศร้าได้   สีเขียว     เป็นสีในวรรณะเย็น จะสร้างความรู้สึกเย็นสบาย ใช้เป็นสีที่ช่วยผ่อนคลายความเครียดได้ ให้ความรู้สึก สงบ เงียบ ร่มรื่น ร่มเย็น การพักผ่อน การผ่อนคลาย ธรรมชาติ ความปลอดภัย ปกติ ความสุข ความสุขุม เยือกเย็น   สีเหลือง     เป็นสีแห่งความเบิกบาน เร้าอารมณ์ และเรียกร้องความสนใจ ให้ความรู้สึกแจ่มใส ความสดใส ความร่าเริง ความเบิกบานสดชื่น ชีวิตใหม่ ความสด ใหม่ ความสุกสว่าง การแผ่กระจาย อำนาจบารมี  ให้ลองสังเกตดูว่า วันที่ท้องฟ้ามืดครื้มปราศจากแสงแดด เราจะรู้สึกหงอยเหงา หดหู่ แต่พอมีแสงแดด ท้องฟ้าสว่าง มีสีเหลือง เราจะรู้สึกมีชีวิตชีวาขึ้น   สีแดง     เป็นสีที่สร้างความตื่นเต้น และกระตุ้นสมอง สีแดงปานกลางแสดงถึงความมีสุขภาพดี ความมีชีวิต ความรัก ความสำคัญ ความอุดมสมบูรณ์ ความมั่งคั่ง สีแดงจัดมีความหมายแฝงด้านกามารมณ์ นอกจากนี้สีแดงยังสร้างความรู้สึกรุนแรง ให้ความรู้สึกร้อน กระตุ้น ท้าทาย เคลื่อนไหว ตื่นเต้น เร้าใจ มีพลัง มันจะใช้กันกรณีที่เกี่ยวกับความตื่นเต้น หรืออันตราย   สีม่วง     ให้ความรู้สึก มีเสน่ห์ น่าติดตาม เร้นลับ ซ่อนเร้น มีอำนาจ มีพลังแฝงอยู่ ความรัก ความเศร้า ความผิดหวัง ความสงบ ความสูงศักดิ์ เป็นสีที่ปลอบโยน และช่วยลดความเครียด แต่เดิมสีม่วงได้มาจากสัตว์มีกระดอง,เปลือก ในทะเลเมดิเตอร์เรเนียน มีชื่อว่า Purpura จึงได้ชื่อภาษาอังกฤษว่า Purple   สีส้ม     ให้ความรู้สึก ร้อน ความอบอุ่น ความสดใส มีชีวิตชีวา วัยรุ่น ความคึกคะนอง การปลดปล่อย ความเปรี้ยว การระวัง เป็นสีที่เร้าความรู้สึก ปรกติควรใช้แต่น้อยเมื่อเทียบกับสีอื่น สังเกตว่าคนที่อยู่ในห้องสีส้มจะอยู่ได้ไม่นาน   สีน้ำตาล     ให้ความรู้สึกอบอุ่น ได้พักผ่อน แต่ควรใช้ร่วมกับสีส้ม เหลือง หรือสีทอง เพราะถ้าใช้สีน้ำตาลเพียงสีเดียว อาจทำให้เกิดความรู้สึกหดหู่ได้   สีเทา     ให้ความรู้สึก เศร้า อาลัย ท้อแท้ ความลึกลับ ความหดหู่ ความชรา ความสงบ ความเงียบ สุภาพ สุขุม ถ่อมตน สีนี้มีข้อดีคือทำให้เย็น แต่สร้างความสร้างความรู้สึกหม่นหมองได้ ควรใช้ร่วมกับสีที่มีชีวิต โทนสว่างอย่างน้อยหนึ่งสี   สีขาว       ให้ความรู้สึก บริสุทธิ์ สะอาด สดใส เบาบาง อ่อนโยน เปิดเผย การเกิด ความรัก ความหวัง ความจริง ความเมตตา ความศรัทธา ความดีงาม  ให้ความรู้สึกรื่นเริง โดยเฉพาะเมื่อใช้กับสีแดง เหลือง และส้ม

สอน PhotoShop : ทฤษฎีสี

บทที่ 1 ความรู้เบื้องต้น : ทฤษฎีสี 

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

กราฟฟิคต่างๆ อยู่เราสามารถใช้ความสัมพันธ์ของวงล้อขอสีนี้ให้เกิดประโยชน์ได้อย่างมากมาย เช่น ต้องการออกแบบให้เว็บไซต์รู้สึกตัดกันโดยสิ้นเชิง เราอาจใช้ชุดสี 4 สีที่ทำมุมกัน 90 องศา เช่นดังตัวอย่างถ้าเราเลือกชุดสี 1 , 6 , 11 , 16 สีที่ได้จะตัดกันชัดเจน ถ้าต้องการให้เว็บไซต์ดูกลมกลืนก็อาจเลือกชุดสีใกล้เคียงกันก็ได้เช่น เลือกชุดสีเขียวเบอร์ 8 , 9 , 10 , 11 ก็จะได้สีในโทนสีเขียวสว่าง

ด้านล่างเป็นเบอร์สีที่ใช้แบ่งตามมาตราฐานการอ้างอิงของสี 

Hexadecimal - Browser Colour Codes 

1 - #FF0000 6 - #FFFF00 11 - #009900 16 - #0000FF 

2 - #FF3300 7 - #CCFF00 12 - #006633 17 - #3300CC 

3 - #FF6600 8 - #99CC00 13 - #006666 18 - #660099 

4 - #FF9900 9 - #66CC00 14 - #003399 19 - #990066 

5 - #FFCC00 10 - #339900 15 - #0033CC 20 - #CC0033 

Red, Green and Blue Values 

1 - R:255 G:000 B:000 

2 - R:255 G:051 B:000 

3 - R:255 G:102 B:000 

4 - R:255 G:153 B:000 

5 - R:255 G:204 B:000 

6 - R:255 G:255 B:000 

7 - R:204 G:255 B:000 

8 - R:153 G:204 B:000 

9 - R:102 G:204 B:000 

10 - R:051 G:204 B:000 

12 - R:000 G:102 B:051 

13 - R:000 G:102 B:102 

14 - R:000 G:051 B:153 

15 - R:000 G:051 B:204 

16 - R:000 G:000 B:255 

17 - R:051 G:000 B:204 

11 - R:000 G:153 B:000 

18 - R:102 G:000 B:153 

19 - R:153 G:000 B:102 

20 - R:204 G:00 B:051  

สอน PhotoShop : Raster / Vector และ Pixel

Raster / Vector และ Pixel 

ภาพบนคอมพิวเตอร์ หรือกราฟิคคอมพิวเตอร์สามารถแบ่งออกได้เป็นสองประเภทคือ ภาพแบบบิตแมป (bitmap) และภาพแบบเวกเตอร์(vector) ความเข้าใจความแตกต่างของกราฟิค ทั้งสองประเภทจะช่วยให้คุณสามารถเลือกใช้งานได้อย่างยืดหยุ่น มีประสิทธิภาพ และตรงตาม จุดประสงค์สูงสุดในการใช้งาน

Vector Graphic

ภาพแบบเวกเตอร์จะต่างจากภาพแบบบิตแมป ซึ่งคุณจะได้พบกับภาพแบบนี้บนโปรแกรม สำหรับวาดภาพเช่น Adobe Illustrator,Macromedia Freehand ภาพแบบเวกเตอร์จะประกอบด้วย เส้นสาย ลวดลายต่าง ๆ ที่สร้างขึ้นจากการคำนวณทางคณิตศาสตร์ของลักษณะทางเรขาคณิตเพื่อ สร้างรูปทรงต่าง ๆ ที่คุณเห็น ซึ่งเรียกว่าเวกเตอร์ (vectors)  

ข้อดีของภาพแบบเวกเตอร์ที่มีเหนือภาพแบบบิตแมป คือ คุณสามารถเคลื่อนย้าย ปรับขนาด เปลี่ยนสี รูปทรง โดยไม่สูญเสียคุณภาพของภาพ เพราะภาพแบบเวกเตอร์ เป็นภาพที่ไม่ขึ้นกับ ความละเอียด นั่นคือสามารถปรับขนาดและพิมพ์ที่ความละเอียดใด ๆ โดยไม่สูญเสียรายละเอียด และคุณภาพ ดังนั้นภาพแบบเวกเตอร์จึงเหมาะกับภาพลายเส้นต่าง ๆ เช่น ตัวอักษร โลโก้

  

Raster Graphic

โปรแกรมปรับแต่งภาพส่วนใหญ่ที่มีอยู่ในท้องตลาดทุกวันนี้ มักจะทำงานกับภาพแบบบิตแมป หรือที่เรียกกันว่าแบบราสเตอร์ (raster) ภาพแบบบิตแมปนี้จะใช้ กริดของตารางเล็ก ๆ ที่เรารู้จักกันดีในชื่อ “พิกเซล” (pixel) สำหรับแสดงภาพ แต่ละพิกเซลก็จะมีค่าของตำแหน่งและค่าสีของตัวเอง ด้วยเหตุที่พิกเซลมีขนาดเล็กเราจึงเห็นว่าภาพ มีความละเอียดสวยงามไม่มีลักษณะของกรอบสี่เหลี่ยมให้เห็น แต่ถ้าเราขยายขนาดของภาพ ก็จะเห็นกรอบเล็ก ๆ หรือพิกเซลที่ประกอบกันขึ้นมาเป็นภาพ ดังนั้นนเมื่องคุณทำงานกับภาพแบบมิตแมป จึงเป็นทำงานกับพิกเซลเล็ก ๆ ที่ประกอบกันขึ้นมาเป็นภาพ ไม่ใช่วัตถุหรือรูปทรงที่เห็น ภาพแบบบิตแมปเป็นภาพที่ขึ้นอยู่กับความละเอียด (resolution)

นั่นคือ มีจำนวนพิกเซลที่แน่นอนในการแสดงภาพ ดังนั้นจากตัวอย่างในภาพที่ 1 คุณจะเห็นว่าเมื่อภาพถูกขยาย หรือพิมพ์ด้วยความละเอียดไม่มากพอภาพจะสูญเสียรายละเอียด และปรากฏเป็นรอยหยักอย่างชัดเจนอย่างไรก็ตามภาพแบบบิตแมป ถือเป็นรูปแบบที่เหมาะกับภาพที่มีเฉดและสีสันจำนวนมาก เช่น ภาพถ่าย หรือภาพวาด

Pixel

พิกเซล (Pixel) เป็นการผสมผสานของคำว่า “Picture” และ “element” คือหน่วย พื้นฐานของภาพ ภาพบิตแมปทุก ๆ ภาพประกอบขึ้นด้วยพิกเซล แต่ละพิกเซลจะมีลักษณะ เป็นรูปสี่เหลี่ยมที่เก็บข้อมูลของสีโดยถูกกำหนตำแหน่งไว้บนเส้นกริดของแนวแกน x และ y ในลักษณะคล้ายแผนที่ (map) นั่นจึงเป็นที่มาของคำว่าบิตแมป (bitmap) เช่น พิกเซลของ ภาพ 8 บิต จะเก็บข้อมูลของสี 8 บิต ที่จอภาพจะใช้ในการแสดงผล ดังนั้นภาพภาพหนึ่งจึงประกอบด้วยพิกเซลเล็ก ๆ จำนวนมาก ซึ่งคุณสามารถมองเห็นได้เมื่อ ขยายภาพให้มีขนาดใหญ่ขึ้น จำนวนของพิกเซล

 

ที่แสดงต่อหน่วยของความยาวในภาพจะถูกเรียกว่าความละเอียด ของภาพ โดยปกติจะวัดเป็นพิกเซลต่อนิ้ว (ppi : pixel per inch) ภาพที่มีความละเอียดสูงจะประกอบไปด้วยพิกเซลจำนวนมากที่มีขนาดเล็กกว่าภาพเดียวกันที่มีความละเอียดน้อยกว่า ตัวอย่าง เช่น ภาพขนาด 1 x 1 นิ้ว ที่ความละเอียด 72 ppi จะประกอบด้วยพิกเซล 5,184 พิกเซล (ความกว้าง 72 พิกเซล x ความยาว 72 พิกเซล = 5,184) และภาพเดียวกันที่ความละเอียด 300 ppi จะประกอบด้วยพิกเซล 90,000 พิกเซลที่มีขนาดของพิกเซลเล็กกว่า (300 x 300 = 90,000) แน่นอน ว่าภาพที่มีความละเอียดมากกว่าก็จะใช้พื้นที่ในการจัดเก็บมากกว่า

สอน PhotoShop : รู้จักกับโปรแกรม Photoshop

รู้จักกับโปรแกรม Photoshop 

 

 

โปรแกรม Photoshop เป็นโปรแกรมในตระกูล Adobe ที่ใช้สำหรับตกแต่งภาพถ่ายและภาพกราฟฟิก ได้อย่างมีประสิทธิภาพ ไม่ว่าจะเป็นงานด้านสิ่งพิมพ์ นิตยสาร และงานด้านมัลติมีเดีย อีกทั้งยังสามารถ