Photoshop : วิธีทำรูปถ่ายให้กลายเป็นรูปวาด   

         วันนี้มีลูกเล่นที่(คิดว่า)น่าสนใจอีกหนึ่งอันนึงมาฝากกันค่ะ  นั่นก็คือการเปลี่ยนรูปถ่ายของเราให้กลายเป็นภาพวาดนั่นเอง  ลองมาดูวิธีกันเลยดีกว่าค่ะ :)

1. เปิดรูปที่ต้องการขึ้นมาเลยค่ะ                 

 

2. ก๊อปปี้เลเยอร์ Background ขึ้นมาอีกเลเยอร์นึง
โดยการคลิกขวาที่พาเลทเลเยอร์แล้วเลือก Duplicate Layer ดังภาพหรือจะกด Ctrl+J ที่คีย์บอร์ดก็ได้ค่ะ   

 

 

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

 

3. ทำการ invert เลเยอร์บนเลยค่ะ
โดยไปที่เมนูบาร์ เลือกImage >> Adjustments >> Invert
หรือกด Ctrl+i ที่คีย์บอร์ด รูปของเราก็จะกลายเป็นแบบนี้

 4. ไปที่พาเลทเลเยอร์ เปลี่ยน Blending Mode
ของเลเยอร์ที่เรา invert  จาก Normal เป็น Color Dodge ดังรูป 

 

 

 ตอนนี้รูปของเรากลายเป็นแบบนี้ไปแล้ว ...

 

5. ไปที่เมนูบาร์ เลือก Filter >> Other >> Minimum
จะมีหน้าต่างอีกอันนึงเด้งขึ้นมาดังภาพ   

ให้เราตั้งค่าในช่อง Radius ให้เป็น 1 หรือไม่ก็ 2 ค่ะ
(ในตัวอย่างใช้ค่า=1)

 

เสร็จแล้วกด OK รูปที่ได้ก็จะเป็นแบบนี้

 

เราได้ลายเส้นมาแล้ว
ต่อไปเป็นขั้นตอนของการแต่งสีค่ะ...

  6. ไปที่พาเลทเลเยอร์อีกครั้ง
ก๊อปปี้เลเยอร์ Background ขึ้นมาอีกเลเยอร์นึง (วิธีตามข้อ2.)
แล้วย้ายเลเยอร์ใหม่นี้ขึ้นมาไว้บนสุด
ให้หน้าตาของพาเลทเลเยอร์เป็นดังรูป

 

 แล้วเปลี่ยน Blending Mode จาก Normal เป็น Hard Light

รูปของเราตอนนี้เป็นแบบนี้แล้วค่ะ 

 

7. ก๊อปปี้เลเยอร์จากข้อ 6. ขึ้นมาอีกเลเยอร์นึง
แล้วเปลี่ยน Blending Mode ให้เป็น Color ค่ะ  

 

แล้วผลลัพท์ที่ได้ก็จะเป็นแบบนี้

!!!เสร็จแล้วจ้า!!!

 

 ปล. 1**
ขั้นตอนที่ 6 กับ 7 ที่เป็นขั้นตอนแต่งสี  ใครจะทำแค่ขั้นตอนเดียวก็ได้นะคะ
อย่างในตัวอย่าง แค่ข้อ 6 ก็โอเคแล้ว
แต่กับบางรูปสีมันจะดูหลอกๆ ก็ทำข้อ 7 เพิ่ม
หรือจะ blend เป็น color ตั้งแต่แรกเลยก็ได้ (อันนี้วิธีในเวบที่เจอมาอะค่ะ)
แต่สีตรงผมมักจะออกมาแปลกๆ ไม่เข้ม ละก็ไม่สวย

 วิธีแก้  ก็คือให้ไปปรับเลเวลของเลเยอร์ล่างสุดให้เข้มขึ้น
โดยไปที่เมนูบาร์ เลือก Image >> Adjustments >> Levels หรือกด Ctrl+L

 

 

เลื่อนลูกศรซ้ายสุดของกราฟ(1)ไปทางขวา
ถ้าจะปรับ midtone ด้วยก็เลื่อนลูกศรกลาง(2)ไปทางขวา
คอยดู preview ประกอบไปด้วยนะคะ

ปล. 2**
รูปที่ทำเสร็จออกมาจะสว่างกว่ารูปจริงเยอะเลย
ถ้ามันสว่างเกินไปก็ใช้วิธีใน ปล. 1 แต่งเพิ่มเอานะคะ
แนะนำว่าไม่ต้องปรับเยอะ เดี๋ยวลายเส้นจะหายนะจ๊ะ ^^

เพิ่มเติมhttp://mono-gokinjo.exteen.com/20070503/entry

             http://photoshop-thailand.blogspot.com/search/label/

 

   ...>> Code แต่ง Blog <<...

มาแว้วววว

      ใครอยากแต่ง Blog ของตัวเองบ้าง ก็ลองเอา Code ไปใช้ดูนะคะ

ขั้นตอนการตกแต่ง

ก่อนอื่นก็ต้องรู้จักส่วนต่าง ๆ ของบล็อกก่อน จะได้ปรับแต่งให้ถูกจุด ตามใจของเรา

 

 

หมายเลข  1  เรียกว่า  title ส่วนนี้จะแสดงชื่อบล็อก (โดยส่วนใหญ่มีขนาด 960 x 200 px)

หมายเลข  2  เรียกว่า subtitle (จะอยู่ติดกับ title ส่วนใหญ่จะเป็นรูปที่ต่อกันแล้วนำไปตัดออกด้วยโปรแกรม Photoshop มีขนาด 960 x 30 px)

หมายเลข  3  เรียกว่า  page-wrapper เป็นพื้นหลังของส่วนที่แสดงข้อความต่าง ๆ

หมายเลข  4  เรียกว่า  screen-wrapper เป็นพื้นหลังของส่วน title

หมายเลข  5  เรียกว่า  body เป็นส่วนพื้นหลังของหน้าบล็อกทั้งหมด

 ..เมื่อรู้จักส่วนต่าง ๆ แล้ว ก็เริ่มตกแต่งกันได้เลย..  

     การที่จะตกแต่งได้ เราต้องมีรูปที่จะตกแต่ง และอัพโหลดไฟล์รูปที่ต้องการขึ้นบล็อกเราก่อน โดยไปที่ เมนูของฉัน --> ไฟล์ของฉัน --> นำไฟล์ขึ้น

-->เมื่อนำไฟล์ขึ้นเรียบร้อยแล้วให้คลิ๊กดูที่ไฟล์รูปเพื่อจดจำ ที่อยู่ของไฟล์ของเรา หรือที่เรียกว่า url

    เมื่อนำไฟล์ขึ้นแล้ว ต่อไปก็เป็นการเริ่มตกแต่งซะที  

-->การตกแต่งบล็อกให้เราเข้าไปที่บล็อกของเรา แล้วเลือก ตกแต่งบล็อก 

-->แล้วเลือกแถบ แก้ไข CSS ที่ตกแต่งมาเอง

-->จากนั้นในกล่องข้อความให้ใส่โค้ดของ CSS ที่เราต้องการตกแต่ง   โดยมีตัวอย่างโค้ดต่อไปนี้

1. Title :

div#title{font-size:ขนาดของตัวอักษร;color:#รหัสสี; background:#รหัสสี;background-image: url(ที่อยู่ของไฟล์ภาพ); background-repeat:no-repeat;background-position:top center;height:ความสูงของภาพpx;} 

2. Subtitle :

div#subtitle {background:#รหัสสี;background-image: url(ที่อยู่ของไฟล์ภาพ); background-repeat:no-repeat;background-position:center;height:ความสูงของภาพpx} 

3. Page-wrapper :

div#page-wrapper {background:#รหัสสี6หลัก;background-image: url(ที่อยู่ ของไฟล์ภาพที่ต้องการ);}

4. screen-wrapper : 

ลบพื้นหลังที่มากับเว็บ :  

#screen-wrapper,#screen-wrapper #bottom {background-image: none;}  

5. ใส่รูปภาพให้พื้นหลัง :  

#screen-wrapper,#screen-wrapper #bottom {background-image: url(ที่อยู่ของไฟล์ภาพ);}Body : body{background:#รหัสสี; background-image: url(ที่อยู่ของไฟล์ภาพที่ ต้องการ);}

                         ขั้นตอนการแต่งกล่องคอมเม้นท์

1. อยู่ที่บล็อกที่ต้องการตกแต่งกล่องคอมเม้นท์   

 ไปที่  เมนูทางลัด-->จัดการบล็อก--> ตกแต่งบล็อก

 

2.จะเข้ามาที่หน้า แก้ไขชุดตกแต่ง  เลือกแก้ไข css ที่ตกแต่งมาเอง  ดังรูป 

 

3. ให้ copy code ของ css   ตามแบบข้างล่าง      

นำไปวางในช่องของ  CSS  ที่ตกแต่งมาเอง -->บันทึก CSS   ดังรูป

 

 

เป็นอันเสร็จแล้วค่ะ!!

 

เพิ่มเติม  :  http://learners.in.th/blog/teddy-blog/267253

               http://gotoknow.org/blog/jatupunn/353329

 

 ตารางค่าสี

 
         เพื่อนๆสามารถ Copy Code สีที่เห็นในตารางไปใช้ได้เลยค่ะ เช่น

 <font color=#FF0033 size=3>ข้อความต่าง ๆ ที่จะทำสี</font>(เปลี่ยนเฉพาะส่วนที่เป็นสีแดง)

#FFFFFF

#FFFFCC

#FFFF99

#FFFF66

#FFFF33

#FFFF00

#FFCCFF

#FFCCCC

#FFCC99

#FFCC66

#FFCC33

#FFCC00

#FF99FF

#FF99CC

#FF9999

#FF9966

#FF9933

#FF9900

#FF66FF

#FF66CC

#FF6699

#FF6666

#FF6633

#FF6600

#FF33FF

#FF33CC

#FF3399

#FF3366

#FF3333

#FF3300

#FF00FF

#FF00CC

#FF0099

#FF0066

#FF0033

#FF0000

#CCFFFF

#CCFFCC

#CCFF99

#CCFF66

#CCFF33

#CCFF00

#CCCCFF

#CCCCCC

#CCCC99

#CCCC66

#CCCC33

#CCCC00

#CC99FF

#CC99CC

#CC9999

#CC9966

#CC9933

#CC9900

#CC66FF

#CC66CC

#CC6699

#CC6666

#CC6633

#CC6600

#CC33FF

#CC33CC

#CC3399

#CC3366

#CC3333

#CC3300

#CC00FF

#CC00CC

#CC0099

#CC0066

#CC0033

#CC0000

#99FFFF

#99FFCC

#99FF99

#99FF66

#99FF33

#99FF00

#99CCFF

#99CCCC

#99CC99

#99CC66

#99CC33

#99CC00

#9999FF

#9999CC

#999999

#999966

#999933

#999900

#9966FF

#9966CC

#996699

#996666

#996633

#996600

#9933FF

#9933CC

#993399

#993366

#993333

#993300

#9900FF

#9900CC

#990099

#990066

#990033

#990000

#66FFFF

#66FFCC

#66FF99

#66FF66

#66FF33

#66FF00

#66CCFF

#66CCCC

#66CC99

#66CC66

#66CC33

#66CC00

#6699FF

#6699CC

#669999

#669966

#669933

#669900

#6666FF

#6666CC

#666699

#666666

#666633

#666600

#6633FF

#6633CC

#663399

#663366

#663333

#663300

#6600FF

#6600CC

#660099

#660066

#660033

#660000

#33FFFF

#33FFCC

#33FF99

#33FF66

#33FF33

#33FF00

#33CCFF

#33CCCC

#33CC99

#33CC66

#33CC33

#33CC00

#3399FF

#3399CC

#339999

#339966

#339933

#339900

#3366FF

#3366CC

#336699

#336666

#336633

#336600

#3333FF

#3333CC

#333399

#333366

#333333

#333300

#3300FF

#3300CC

#330099

#330066

#330033

#330000

#00FFFF

#00FFCC

#00FF99

#00FF66

#00FF33

#00FF00

#00CCFF

#00CCCC

#00CC99

#00CC66

#00CC33

#00CC00

#0099FF

#0099CC

#009999

#009966

#009933

#009900

#0066FF

#0066CC

#006699

#006666

#006633

#006600

#0033FF

#0033CC

#003399

#003366

#003333

#003300

#0000FF

#0000CC

#000099

#000066

#000033

#000000

 เพิ่มเติม : http://www.abhidhamonline.org/color%20code.htm

  

เทคนิคการเลือกใช้สี

วรรณะของสี (Tones)

     วรรณะของสี หมายถึง กลุ่มสีที่ปรากฏให้ความรู้สึกที่แตกต่างกัน สังเกตจากวงล้อสี จะปรากฏเป็น 2 วรรณะ คือ
- วรรณะสีร้อน ( Warm Tone) ลักษณะของสีจะให้ความสดใส ร้อนแรง ฉูดฉาด หรือ รื่นเริง สีในกลุ่มนี้
ได้แก่ สีเหลือง สีแดง สีแสด และสีที่ใกล้เคียง
- วรรณะสีเย็น (Cool Tone) ความรู้สึกที่ปรากฏในภาพจะแสดงความสงบ เยือกเย็น จนถึงความเศร้า ได้แก่ สี้น้ำเงิน สีม่วง สีเขียว และสีที่ใกล้เคียง

 จิตวิทยาในการใช้สี

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

สีแดง
    เป็นสีของไฟ การปฏิบัติ ความรู้สึกทางกามารมณ์ ความปรารถนา สีของความอ่อนเยาว์ ดังนั้นจึงเป็นที่ชอบมากสำหรับเด็กเล็กๆ สีแดงเป็นสีที่มีพลังมากสามารถบดบังสีอื่นๆ จึงไม่เหมาะที่จะใช้เป็นสีพื้นหรือฉากหลัง (Background)

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

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

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

สีเหลือง เขียว และ ม่วง ทุกระดับสี (Shades)
     มีค่าแตกต่างกันไป ทั้งนี้ขึ้นอยู่กับสีที่มาผสม สีดังกล่าวอาจทำให้เกิดความรู้สึกในทางบวก การแสดงออกเต็มไปด้วยความรู้สึกชาญฉลาด หรือให้ความรู้สึกในทางลบ และเก็บกดก็เป็นได้ 

เพิ่มเติม : http://yalor.yru.ac.th/~sirichai/4123612/unit4/color-technique.html

  

 

BYE BYE !