ฉันได้พบสคริปต์ที่ทำอย่างนั้น (สร้าง CSS และ HTML สำหรับเลเยอร์และเสนอตัวเลือกในการส่งออกในค่า%) และตัดงานสำหรับ web-dev ครึ่งหนึ่งสำหรับ Photoshop ตอนนี้ฉันอยากรู้อยากเห็นถ้าใครเจอหรือมีปลั๊กอินหรือชี้ให้ฉันไปที่คุณสมบัติดั้งเดิมเช่นนั้นสำหรับแอป Sketch การขาดงานดังกล่าวทำให้ฉันเปลี่ยนไปใช้ Sketch ได้อย่างเจ็บปวดอีกครั้ง หรือเป็นสิ่งใหม่สำหรับ Sketch ฉันเพิ่งขาดสิ่งที่แตกต่างในเชิงอุดมคติเกี่ยวกับวิธีที่ Sketch ทำงานกับ CSS และ HTML

นี่อาจไม่ใช่คำตอบที่คุณมองหา แต่ฉันคิดว่ามันดีกว่าการส่งสไตล์ที่สร้างโดยอัตโนมัติให้กับวิศวกร

มาร์กอัปแบบเลือก

ฉันแน่ใจว่าคุณได้ค้นพบ CSS grabber เมนูบริบทของ Sketch แล้ว คุณสามารถเลือกวัตถุได้มากเท่าที่คุณต้องการและคุณจะได้ CSS บนคลิปบอร์ดของคุณเร็วกว่าที่คุณจะวาง

แน่นอนว่าไม่มีตัวเลือกมันเป็นเพียงแค่โน้ต CSS แต่ละบล็อกถูกเรียกโดยความคิดเห็นก่อนหน้าโดยใช้ชื่อของเลเยอร์เช่น:

/* Rectangle 1: */
background: #C7C1B5;

/* Rectangle 1 Copy: */
background: #F5E618;

/* Rectangle 1 Copy 2: */
background: #FFFFFF;

คำอธิบายประกอบไฟล์

Sketch Measureเป็นปลั๊กอินที่สร้างคำอธิบายประกอบในระดับต่างๆตามข้อกำหนดของคุณ มีความเป็นวิดีโอสาธิตที่นี่ แนวคิดพื้นฐานคือการใส่คำอธิบายประกอบตัวเลขที่สำคัญและให้ dev เขียนโค้ดของตัวเอง

เกินคำอธิบายประกอบ

คุณสามารถลองใช้เครื่องมือเช่นนี้เพียงอย่างเดียวหรือรวมกัน:

• Zeplinสร้างร่างแบบร่างที่ใช้ร่วมกันได้แบบสแตนด์อโลนสำหรับการตรวจสอบ dev ของคุณโดยดึงรายละเอียดตามความต้องการ
• Marvelเป็นเครื่องมือสร้างต้นแบบที่นำเข้าไฟล์ Sketch ไม่มีอะไรสื่อสารเหมือนต้นแบบแบบโต้ตอบ!

เครื่องมือสร้าง HTML แบบทดลอง

ฉันไม่เคยใช้สิ่งนี้และมันชัดเจนในช่วงเริ่มต้นของการพัฒนา แต่ปลั๊กอินของ Blade นั้นดูมีแนวโน้ม

Blade เป็นปลั๊กอิน Sketch 3 สำหรับการสร้าง HTML โดยอัตโนมัติ มันจะสร้างแท็ก <div> สำหรับกลุ่มแท็ก <p> สำหรับข้อความ ฯลฯ

ดูลิงค์ต่อไปนี้ http://blog.mengto.com/the-best-hidden-features-in-sketch/

ติดตามบล็อกของ Meng To เพื่อติดตามข่าวสารล่าสุดเกี่ยวกับแบบฝึกหัด Sketch เคล็ดลับและลูกเล่นที่น่าสนใจ http://blog.mengto.com/ https://designcode.io/