ทำตามตัวอย่างที่ตรวจสอบแล้ว จากนั้นปรับการควบคุมให้เข้ากับรูปภาพของคุณเอง เปิด เครื่องมือตกแต่งภาพหน้าจอ.
เริ่มต้นด้วยภาพหน้าจอที่อ่านง่าย
เปิด Screenshot Beautifier และเลือก Try an example เพื่อโหลดแดชบอร์ดสมมติที่ใช้ที่นี่ หรืออัปโหลดรูปภาพของคุณเอง แหล่งที่มาตัวอย่างคือ PNG ขนาด 1440 คูณ 900 พิกเซล ใช้การจับภาพต้นฉบับแทนภาพหน้าจอที่คัดลอกมาจากตัวอย่างแชทที่บีบอัดเมื่อตัวอักษรขนาดเล็กมีความสำคัญ
เครื่องมือนี้จัดสไตล์รูปภาพ ไม่ได้เรียกดูเว็บไซต์หรือจับภาพ URL สำหรับขั้นตอนการทำงานนั้น ให้สร้างการจับภาพด้วย URL to Image ก่อน แล้วจึงเปิดรูปภาพที่บันทึกไว้ใน Screenshot Beautifier
ครอบตัดพื้นที่หน้าเว็บที่ไม่เกี่ยวข้องก่อนจัดสไตล์ หากภาพหน้าจอจะเล็กเกินกว่าจะอ่านได้
เลือกเทมเพลตที่สมบูรณ์
บนโทรศัพท์ ให้เปิดการตั้งค่า เลือก Midnight ในแกลเลอรีดีไซน์ ซึ่งจะใช้การไล่ระดับสีน้ำเงินเข้ม กรอบเบราว์เซอร์สีเข้ม การเว้นระยะที่สอดคล้องกัน มุมโค้งมน และผืนผ้าใบแบบจอกว้างพร้อมกัน ตัวอย่างจะอัปเดตทันที
ดีไซน์อื่นๆ ได้แก่ Studio, Minimal, Floating, Ocean, การ์ดโซเชียล, สีชมพูกุหลาบอ่อน และ กระดาษโทนอุ่น ซึ่งเป็นจุดเริ่มต้นที่แก้ไขได้ไม่ใช่ภาพจำลองที่ล็อกไว้ ให้เลือกองค์ประกอบที่ใกล้เคียงที่สุดก่อน แล้วค่อยปรับเฉพาะส่วนที่จำเป็นต้องเปลี่ยน ปุ่มเลิกทำจะย้อนกลับไปที่การตั้งค่าก่อนหน้า
Midnight เหมาะกับอินเทอร์เฟซที่สว่างเพราะส่วนรอบที่มืดกว่าทำให้มองเห็นขอบของภาพหน้าจอได้ง่าย
ตัวอย่างในคู่มือนี้
รวมแดชบอร์ดสมมติ 1440 x 900; เทมเพลต Midnight พร้อมการตั้งค่าที่สอดคล้องกันที่ไม่ได้เปลี่ยนแปลง; สเกลการส่งออก 1x; PNG ผลลัพธ์ 2312 x 1301 ถูกดาวน์โหลดจากเครื่องมือปัจจุบัน
- แหล่งที่มา
- 1440 x 900 พิกเซล
- เอาต์พุต
- 2312 x 1301 พิกเซล
- รูปแบบ
- PNG
- กำลังประมวลผล
- ในเบราว์เซอร์ของคุณ
ปรับองค์ประกอบสำหรับปลายทาง
พื้นหลังสามารถเป็นแบบไล่ระดับสี สีทึบ รูปภาพของคุณเอง หรือความโปร่งใส สำหรับรูปภาพที่กำหนดเอง ให้ใช้เลือกรูปภาพพื้นหลัง พื้นหลังนั้นจะเติมเต็มผืนผ้าใบและอาจถูกครอบตัด ส่วนภาพหน้าจอจะถูกปรับให้พอดีโดยไม่สูญเสียขอบเดิม กรอบหน้าต่างสามารถเป็นเบราว์เซอร์สว่าง เบราว์เซอร์มืด หรือไม่มีเลย ชื่อหน้าต่างเป็นป้ายกำกับตกแต่ง
การเว้นระยะจะควบคุมพื้นที่ว่างรอบภาพหน้าจอ มุมโค้งมนและเงาจะกำหนดรูปร่างของการ์ด รูปร่างผืนผ้าใบรวมถึงรูปแบบสี่เหลี่ยม จอกว้าง แนวตั้ง สตอรี่ และโซเชียล รวมถึงขนาดที่กำหนดเอง ภาพหน้าจอที่สูงมากจะดูเล็กเมื่ออยู่ในกรอบกว้าง ให้เลือกผืนผ้าใบที่สูงขึ้นหรือลดการเว้นระยะแทนที่จะคาดหวังรายละเอียดเพิ่มเติมจากการขยายภาพ
คงการตั้งค่า Midnight และสเกลการส่งออกที่ 1x เพื่อให้ตรงกับตัวอย่างนี้ สเกลการส่งออกมี 1x, 2x และ 3x ภายในขีดจำกัดขอบ 8,000 พิกเซล และ 32 เมกะพิกเซล ขนาดที่ใหญ่ขึ้นไม่ได้สร้างรายละเอียดที่ไม่มีอยู่ในภาพที่อัปโหลดขึ้นมาใหม่
ใช้ต้นฉบับเพื่อเปรียบเทียบภาพที่จัดสไตล์กับภาพที่จับมาจริง และตรวจสอบข้อความขนาดเล็กที่ระดับการซูมที่เหมาะสม
ส่งออกภาพที่คมชัด
เลือก PNG แล้วเลือกเริ่ม ใช้ดาวน์โหลดบนหน้าผลลัพธ์เพื่อบันทึกไฟล์จริง ด้วยแหล่งที่มาตัวอย่างและการออกแบบ Midnight ที่ไม่ได้เปลี่ยนแปลง ผลลัพธ์คือ 2312 คูณ 1301 พิกเซล การ์ดโค้งมน เงา กรอบ และพื้นหลังทั้งหมดรวมอยู่ในภาพเดียว
PNG เป็นค่าเริ่มต้นที่มีประโยชน์สำหรับข้อความอินเทอร์เฟซ WebP รองรับพื้นที่โปร่งใสด้วยการบีบอัดแบบสูญเสียข้อมูล และ JPG มีประโยชน์สำหรับภาพที่มีพื้นหลังทึบเมื่อขนาดที่เล็กกว่ามีความสำคัญ JPG จะแทนที่ความโปร่งใสด้วยสีขาว การส่งออกจะถูกรวมเลเยอร์ ดังนั้นให้เก็บภาพหน้าจอต้นฉบับไว้หากคุณอาจต้องการองค์ประกอบอื่น
ตรวจสอบภาพที่ดาวน์โหลดก่อนเผยแพร่ โดยเฉพาะข้อความขนาดเล็กและโลโก้
คำถามที่พบบ่อย
เครื่องมือนี้สามารถจับภาพหน้าเว็บจากลิงก์ได้หรือไม่
เครื่องมือนี้จะตกแต่งภาพที่คุณจัดเตรียมให้ ใช้ URL to Image เพื่อจับภาพหน้าเว็บก่อน จากนั้นจึงเปิดผลลัพธ์ที่นี่
มีเทมเพลตอะไรบ้าง
Studio, Midnight, Minimal, Floating, Ocean, Social card, Soft rose และ Warm paper ทุกการออกแบบสามารถปรับเปลี่ยนได้
ภาพหน้าจอจะถูกครอบตัดหรือไม่
ภาพหน้าจอจะถูกปรับให้พอดีภายในงานออกแบบโดยยังคงรักษาขอบไว้ ภาพพื้นหลังที่กำหนดเองจะเติมเต็มผืนผ้าใบและอาจถูกครอบตัดเพื่อให้พอดี
ฉันสามารถใช้ภาพพื้นหลังของตัวเองได้หรือไม่
ได้ เลือก Your own image ใน Background เลือกภาพในเครื่องที่รองรับ และตรวจสอบพื้นหลังที่ปรับพอดีในตัวอย่าง
ฉันสามารถส่งออกพื้นหลังโปร่งใสได้หรือไม่
ได้ เลือก Transparent และใช้ PNG หรือ WebP ส่วน JPG จะใช้พื้นหลังสีขาวเนื่องจากไม่รองรับความโปร่งใส
สเกลการส่งออกช่วยให้ภาพหน้าจอขนาดเล็กคมชัดขึ้นหรือไม่
ไม่ มันจะขยายขนาดผลลัพธ์ ใช้ต้นฉบับที่มีความละเอียดสูงขึ้นเมื่อข้อความขนาดเล็กจำเป็นต้องคงความชัดเจน
ทำให้ภาพหน้าจอแชร์ได้ง่ายขึ้น
ลองใช้ตัวอย่างหรือใช้ไฟล์ของคุณเอง และตรวจสอบผลลัพธ์ก่อนแชร์
