วิธีสร้างภาพดูโอโทนใน Photoshop

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

ก่อนที่เราจะเรียนรู้วิธีสร้างภาพดูโอโทนใน Photoshop เรามาเจาะลึกลงไปในเทรนด์การออกแบบนี้กันก่อนดีกว่า

ภาพดูโอโทนคืออะไร?

ที่แกนกลางของ duotone เป็นเพียงภาพที่ประกอบด้วยสองสี คุณอาจเคยเห็นพวกเขามาก่อนในแคมเปญอย่าง Spotify's 2015 Year in Review

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

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

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

• หากคุณสนใจที่จะเข้าร่วมหลักสูตรและดาวน์โหลดแหล่งข้อมูล Photoshop ฟรี ข้ามไปที่ส่วนนี้!
• หากคุณได้เข้าร่วมหลักสูตรแล้ว คลิกที่นี่เพื่อข้ามไปยังบทช่วยสอนเกี่ยวกับเทมเพลต!

สำหรับบทช่วยสอนที่เหลือ ฉันจะพูดถึงสองวิธีที่คุณสามารถใช้สร้างภาพดูโอโทนใน Photoshop ได้ด้วยตนเอง อย่างแรกคือตัวเลือก Photoshop ในตัว (ใช้งานได้ดี แต่ไม่ใช่ที่โปรดของฉัน) และตัวเลือกที่สองใช้แผนที่แบบไล่ระดับ (วิธีที่ฉันชอบ เว้นแต่คุณจะใช้การกระทำฟรีของเราแน่นอน!)

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

พร้อมที่จะสร้างภาพดูโอโทนใน Photoshop แล้วหรือยัง? มาเริ่มกันเลย.

วิธีใช้ตัวเลือก Photoshop duotone เริ่มต้น

1. แปลงภาพเป็นระดับสีเทา 8 บิต

เพื่อที่จะใช้ตัวเลือกดูโอโทนที่มีอยู่ใน Photoshop อันดับแรก คุณจะต้องแปลงรูปภาพเป็นระดับสีเทา 8 บิต เลือกสำเนาของรูปภาพและไปที่ Image > Mode > Grayscale ตรวจสอบด้วยว่าตัวเลือก 8 บิต/ช่องสัญญาณถูกเลือกไว้ภายใต้เมนูโหมดเดียวกัน

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

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

2. แปลงภาพเป็นดูโอโทน

เมื่อโหมดรูปภาพของคุณเป็นระดับสีเทา 8 บิตแล้ว คุณสามารถใช้ตัวเลือกดูโอโทนเริ่มต้นใน Photoshop ได้ เลือกเลเยอร์แล้วไปที่ Image > Mode > Duotone

3. เลือกสีของคุณ

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

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

วิธีใช้ Gradient Map เพื่อสร้าง duotone

1. ใช้แผนที่ไล่โทนสี

สำหรับวิธีนี้ คุณจะไม่ต้องกังวลกับการเปลี่ยนภาพหรือเลือกโหมดสีเฉพาะ แน่นอน ถ้าคุณต้องการแก้ไขอะไรก็ตาม ดำเนินการต่อ แต่รูปภาพจะทำงานได้ดีเหมือนเดิม เมื่อคุณพร้อมแล้ว ให้เลือกสำเนาของรูปภาพและไปที่ Image > Adjustments > Gradient Map

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

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

2. เลือกสีของคุณ

การคลิกที่แถบไล่ระดับสีจะเป็นการเปิด Gradient Editor ในหน้าต่างใหม่ ที่นี่คุณสามารถเลือกสีของคุณและปรับวิธีการแสดงบนภาพได้

อย่างที่คุณเห็น ภาพสุดท้ายดูแตกต่างกันเล็กน้อย แต่ทั้งสองส่งผลให้ดูโอโทนที่ยอดเยี่ยม ฉันชอบใช้ Gradient Map มากกว่าเพราะว่ามันง่ายกว่าเล็กน้อยในการควบคุมความเข้มของสีและตำแหน่งของสีเข้มและสีอ่อน แต่ทั้งสองวิธีนั้นใช้งานง่าย

เข้าร่วมหลักสูตร Web Design Trends ปี 2019 ของเราสำหรับการดำเนินการ Photoshop duotone ฟรี!

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

[optin-monster-shortcode id =”dktout15rz4zcbcifnsl”]

ขอขอบคุณที่เข้าร่วมหลักสูตร Design Trends ของเรา!

ขั้นแรก ดาวน์โหลดแอคชั่น Photoshop ที่นี่

วิธีใช้ดูโอโทนเนอร์

ติดตั้งการดำเนินการ

เมื่อคุณดาวน์โหลดการดำเนินการแล้ว ให้ดับเบิลคลิกที่ไฟล์เพื่อติดตั้ง เปิดภาพที่คุณต้องการใช้ใน Photoshop จากนั้นเปิดหน้าต่างการดำเนินการ

หากต้องการนำทางไปยังหน้าต่างการ ทำงาน ให้เลือก Window > Actions หรือ กด Shift + F9 ค้างไว้

เมื่อคุณเปิดหน้าต่างการดำเนินการแล้ว ให้เลือกเลเยอร์ภาพที่คุณต้องการใช้เอฟเฟกต์ดูโอโทน

เลือกและเล่นการกระทำ

คลิกเมนูแบบเลื่อนลงในโฟลเดอร์ "Flywheel – Glitch-a-tron" ตอนนี้เลือก "Glitch-a-tron – Select and hit play" แล้วกดปุ่มเล่นสามเหลี่ยมที่ด้านล่างของหน้าต่าง

เมื่อคุณกดเล่น คุณจะเห็นเลเยอร์จำนวนมาก โดยแต่ละเลเยอร์มีโทนสีดูโอโทนที่แตกต่างกัน! ในการสลับ สิ่งที่คุณต้องทำคือทำให้เลเยอร์ที่คุณต้องการมองเห็นได้

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

โบนัส: รีเซ็ตภาพของคุณในพริบตา

ในกรณีที่คุณต้องการย้อนรอย การกระทำนั้นจะสร้างภาพหน้าจอโดยอัตโนมัติที่ให้คุณกลับไปที่ภาพของคุณก่อนที่จะดำเนินการ

ไปที่หน้าต่าง ประวัติ โดยเลือก Window > History เลื่อนขึ้นไปด้านบนแล้วคลิก "สแนปชอต" สิ่งนี้จะรีเซ็ตทุกอย่างเพื่อให้คุณพร้อม!

คุณคิดอย่างไรกับ duotones? คุณคิดว่านี่เป็นเทรนด์การออกแบบที่แข็งแกร่ง หรือคุณชอบภาพสีมากกว่ากัน? แบ่งปันความคิดของคุณด้านล่าง!

ดาวน์โหลดไฟล์ Photoshop ฟรีเหล่านี้

ดาวน์โหลดเทมเพลตฟรีด้านล่าง!

ไม่แน่ใจว่าจะอ่านอะไรต่อไป? ตรวจสอบรายชื่อนี้:

• 13 เทรนด์การออกแบบเว็บสำหรับปี 2020
• วิธีปรับรูปภาพให้เหมาะสมสำหรับเว็บ: คำแนะนำทีละขั้นตอนเพื่อประสิทธิภาพของเว็บไซต์ที่ดีขึ้น
• วิธีใช้เทคนิคการตัดและปิดบัง CSS และ SVG
• วิธีเพิ่มปุ่ม back-to-top แบบติดหนึบในเว็บไซต์ของคุณ