สีไม่ตรงกันในการส่งออกร่าง

เมื่อส่งออกด้วยภาพร่างสีที่ฉันได้รับนั้นอิ่มตัวเกินกว่าภาพต้นฉบับ ดูภาพด้านล่าง:

สีไม่ตรงกันปรากฏในซอฟต์แวร์ใด ๆ ที่ฉันใช้เพื่อเปิด การส่งออกสามารถเป็นไฟล์ประเภทใดก็ได้และเกิดปัญหาขึ้น

เมื่อฉันนำเข้ารูปภาพที่ส่งออกเป็นร่าง Sketch จะแสดงด้วยสีดั้งเดิม

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

นักพัฒนาตระหนักถึงปัญหานี้ แต่ไม่เต็มใจที่จะแก้ไขพวกเขาคิดว่ามันเป็น 'คุณสมบัติ'

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

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

ดังนั้น Sketch ทำอะไร เมื่อคุณเลือกสีใน Sketch เราจะเก็บค่า RGB เท่านั้น เมื่อเราเรนเดอร์หน้าจอเราจะแทรกค่าเหล่านั้นโดยใช้พื้นที่สีของจอภาพของคุณ

ข้อบกพร่องใดที่ชัดเจนสำหรับฉัน ซอฟต์แวร์สำหรับการออกแบบเนื้อหาสำหรับเบราว์เซอร์ที่ไม่แสดงผลเหมือนเบราว์เซอร์

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

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

ยิ่งไปกว่านั้นพวกเขาอ้างว่า:

หากคุณใช้ค่า RGB เดียวกันในงานศิลปะของคุณใน Sketch ตามที่คุณใช้ใน CSS บนเว็บไซต์ของคุณสีจะตรงกัน

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

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

ที่มา: http://blog.sketchapp.com/post/133932511180/colors-in-sketch

Sketch เวอร์ชันใหม่มีคุณสมบัติที่ใช้งานง่ายเพื่อให้แน่ใจว่าสีเมื่อส่งออกเป็นสีเดียวกับที่คุณเห็นบนหน้าจอ

นำทางไปที่การตั้งค่า› ทั่วไป› โปรไฟล์สีแล้วเปลี่ยนการตั้งค่าสีเป็นจอแสดงผล P3 การดำเนินการนี้จะเปลี่ยนโปรไฟล์สีของคุณเป็น Mac เครื่องเดียวที่ใช้ จากนั้นทำสิ่งเดียวกันอีกครั้ง แต่คราวนี้เลือก sRGB ตอนนี้คุณสามารถเลือกตัวเลือก "แปลง" แล้วคลิกที่ "เปลี่ยนโปรไฟล์" เพื่อแปลงสีให้เป็นพื้นที่สีมาตรฐาน ตอนนี้เมื่อคุณส่งออกสีจะมีลักษณะเหมือนกับที่ปรากฏใน Sketch

ข้อมูลเพิ่มเติมเกี่ยวกับเรื่องนี้สามารถพบได้ที่นี่ https://www.sketchapp.com/docs/other/color-management/

การตั้งค่าสีของระบบเปลี่ยนทุกอย่าง

ฉันใช้ sRGB แทนการใช้เบราว์เซอร์แทน ฉันยังใช้การตั้งค่าล่วงหน้าและหน้าจออื่น ๆ อีกมากมายเพื่อทดสอบความแปรปรวน นี่คือตัวอย่างของ sRGB กับ Adobe RGB

ความแปรปรวนภายในหน้าจอ

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

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

ปัญหานี้ได้รับการแก้ไข (และตอบ) ในเอกสารทางการของ Sketch: https://www.sketchapp.com/learn/documentation/other/color-management/

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

ขออภัยที่จะฟื้นเธรดเก่า ๆ แต่ก็ยังเป็นปัญหาอยู่ - แต่ฉันพบวิธีแก้ปัญหาที่ซับซ้อนบ้าง! เปิดไฟ Zeplin เลือกสีส่งออกเป็น. clr และคัดลอกไฟล์ลงใน ~ Library / Colors สร้าง AppleScript ใหม่ด้วย "เลือกสี" ทางด้านขวาสุดจะมีแท็บใหม่พร้อมสีจาก. clr คลิกที่สีที่คุณต้องการจากนั้นคลิกที่ไอคอนที่สองจากทางซ้ายแถบเลื่อน RGB คลิกที่วงล้อการตั้งค่าและเลือกโปรไฟล์ sRGB จากดรอปดาวน์ ค่า RGB ที่ได้ควรเป็นสิ่งที่คุณต้องการ

มีความสุขระบายสี!

หากคุณกำลังทำงานกับโครงการอยู่คุณสามารถแปลงโปรไฟล์สีจากไฟล์› เปลี่ยนโปรไฟล์สี… (เลือกโปรไฟล์ที่คุณชื่นชอบ)

ข้อมูลเพิ่มเติมที่นี่: https://www.sketchapp.com/docs/other/color-management/#changing-the-color-profile-of-an-existing-document

คุณสามารถตั้งค่าโปรไฟล์เริ่มต้นได้ที่นี่: ร่าง› ค่ากำหนด› ทั่วไป› โปรไฟล์สี