
บอร์ดระบบสไตล์ UI
สร้างบอร์ดระบบสไตล์ UI หลายหน้า พร้อมกริด 8px, color tokens, scale ตัวอักษร, สถานะคอมโพเนนต์ และตัวอย่างเลย์เอาต์ที่จัดแนว
พรอมป์รูปภาพ
Seedream 5.0 Lite
เทมเพลตพรอมป์ต์ภาพ
ตัวอย่าง
พรอมป์รูปภาพ

ตัวอย่างสำหรับบอร์ดระบบสไตล์ UI เน้นความสอดคล้องของระบบ การจัดแนวกริด token ที่แก้ไขได้ และตัวอย่าง UI ที่พร้อมใช้กับผลิตภัณฑ์
พรอมป์เต็ม
บอร์ดระบบสไตล์ UI
บอร์ดระบบสไตล์ UI หลายหน้า พร้อมกริด 8px, color tokens, scale ตัวอักษร, คอมโพเนนต์ และเลย์เอาต์ responsive
สร้างบอร์ดระบบสไตล์ UI หลายหน้าที่เนี้ยบสำหรับ [PRODUCT_OR_BRAND] นำเสนอระบบเป็นชุดหน้าดีไซน์ที่เป็นหนึ่งเดียวบนผืน preview canvas ที่สะอาด ใช้กริดระยะห่าง 8px อย่างเคร่งครัด ระยะขอบสม่ำเสมอ การจัดแนวแม่นยำ และลำดับชั้นชัดเจนในทุกหน้า ใส่แผง color token ที่มี swatches สำหรับ primary, secondary, neutral, semantic และ background; ใส่ scale ตัวอักษรสำหรับ heading, body, caption และ numeric styles; ใส่แผ่นคอมโพเนนต์ที่มีปุ่ม input, cards, navigation, badges และ empty states; และใส่ตัวอย่างเลย์เอาต์ responsive สองแบบที่แสดงสัดส่วน desktop และ mobile รักษาระบบให้สอดคล้องทางภาพ แก้ไขได้ และเหมาะกับผลิตภัณฑ์ SaaS, creator tool, ecommerce brand หรือ dashboard ภายใน ใช้ข้อความ placeholder ที่สมจริงเฉพาะจุดที่จำเป็น และให้ label สั้นพอที่จะอ่านได้ หลีกเลี่ยงโลโก้จริง ระบบดีไซน์ที่คัดลอกมา ชื่อแบรนด์ที่ผู้ใช้ไม่ได้ให้ ตัวอักษรบิดเบี้ยว ระยะห่างไม่สม่ำเสมอ เงาไม่เข้ากัน ของตกแต่งรก contrast ที่ไม่เข้าถึงได้ และตัวอย่างคอมโพเนนต์ที่ทำลายกริด
หมายเหตุการใช้งาน
แทนที่ประเภทผลิตภัณฑ์ โทนแบรนด์ ทิศทางพาเลต รายการคอมโพเนนต์ ตัวอย่างเลย์เอาต์ และข้อกำหนด accessibility ก่อนรัน
FAQ ของพรอมป์
ก่อนใช้พรอมป์นี้
ตรวจสอบอย่างรวดเร็วเรื่องอินพุต ความเหมาะของโมเดล และวิธีปรับเทมเพลตโดยไม่ทำให้ผลลัพธ์อ่อนลง
ควรปรับอะไรก่อนเป็นอันดับแรก
กำหนดประเภทผลิตภัณฑ์ โทนแบรนด์ พาเลตพื้นฐาน บุคลิกตัวอักษร ขอบเขตคอมโพเนนต์ และตัวอย่างควรรู้สึกนำโดยการตลาดหรือเป็น dashboard
พรอมป์ต์นี้สร้าง design system ที่ใช้งานจริงได้ไหม
มันสร้างบอร์ดระบบสไตล์เชิงภาพสำหรับการสำรวจและนำเสนอ ก่อนแปลงเป็น UI tokens สำหรับ production ให้รีวิวระยะห่าง contrast ตัวอักษร และพฤติกรรมคอมโพเนนต์ก่อน
ก่อนเผยแพร่ภาพควรตรวจอะไร
ตรวจว่า label อ่านได้ swatches สีแยกจากกันชัดเจน ลำดับชั้นตัวอักษรชัด คอมโพเนนต์ใช้ตรรกะระยะห่างเดียวกัน และไม่ได้คัดลอกระบบแบรนด์จริง
พรอมป์เพิ่มเติมในโหมดนี้

