19 พรอมต์ Claude สำหรับงานออกแบบที่ใช้ได้ผลจริง

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

ด้านล่างคือพรอมต์ 19 ข้อที่ครอบคลุมการทำบรีฟ ระบบตัวอักษรและสี คำในอินเทอร์เฟซ การวิจารณ์งาน และการส่งต่องาน แต่ละข้อพร้อมคัดลอกไปใช้ได้ทันที ลองใช้ใน Chat Smith ซึ่งเป็น แชต AI ฟรีที่รวม Claude, GPT และ Gemini ไว้ในที่เดียว และดูชุด พรอมต์ Claude ที่กว้างขึ้นสำหรับงานนอกเหนือจากงานออกแบบ

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

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

ระบุกลุ่มเป้าหมายและการตัดสินใจ “ผู้ซื้อ SaaS แบบ B2B ที่กำลังเปรียบเทียบผู้ให้บริการสามราย” จะได้คำแนะนำต่างจากคำว่า “ผู้ใช้” การตัดสินใจที่งานออกแบบต้องผลักดันสำคัญกว่าความสวยงาม

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

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

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

1. ตัวช่วยสร้างครีเอทีฟบรีฟ

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

2. มู้ดบอร์ดแบบคำพูด

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

3. การตรวจสอบขนบของหมวดหมู่

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

4. ตัวแปลงข้อมูลผู้ชมเป็นแนวทางออกแบบ

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

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

5. การจับคู่แบบอักษร

แนะนำคู่แบบอักษรสามชุดสำหรับ [อธิบายแบรนด์และอุตสาหกรรม] ที่ควรให้ความรู้สึก [คำคุณศัพท์สามคำ] ในแต่ละชุดให้ระบุแบบอักษรหัวเรื่อง แบบอักษรเนื้อหา และเหตุผลที่ฉันใช้พูดในที่ประชุมลูกค้าได้ จำกัดเฉพาะตระกูลที่คุณมั่นใจว่ามีใน [Google Fonts / Adobe Fonts] และบอกด้วยว่าฉันควรตรวจสอบใบอนุญาตด้วยตนเองที่ใด

6. สเกลตัวอักษร

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

7. ตัวตั้งชื่อพาเลตสี

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

8. หลักการตั้งชื่อโทเคน

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

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

9. ไมโครคอปี้สำหรับออนบอร์ดดิ้ง

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

10. สถานะว่างและสถานะข้อผิดพลาด

เขียนสถานะว่างและข้อความข้อผิดพลาดสำหรับ [อธิบายส่วนของผลิตภัณฑ์] แต่ละรายการให้บอกว่าเกิดอะไรขึ้น ผู้ใช้ทำอะไรได้ และข้อความบนปุ่ม ห้ามขอโทษ ห้ามโทษผู้ใช้ และห้ามใช้คำว่า “อุ๊ปส์” หากข้อผิดพลาดเป็นความผิดของเราให้พูดตรง ๆ หากผู้ใช้แก้ไม่ได้ ให้บอกว่าเรากำลังทำอะไรแทน

11. ป้ายกำกับฟอร์มและข้อความช่วยเหลือ

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

12. การตรวจสอบปุ่มและการกระทำ

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

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

13. การวิจารณ์เลย์เอาต์

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

14. การตรวจสอบลำดับชั้น

นี่คือทุกสิ่งบนหน้าจอ เรียงตามลำดับที่ปรากฏ: [ระบุองค์ประกอบพร้อมขนาดและน้ำหนัก] บอกลำดับที่ผู้ใช้จะสังเกตเห็นจริง และดูว่าตรงกับลำดับความสำคัญที่ฉันตั้งใจไว้หรือไม่: [ระบุลำดับที่ตั้งใจ] หากต่างกัน ให้บอกว่าควรเปลี่ยนอะไร

15. การตรวจสอบการเข้าถึง

นี่คืองานออกแบบของฉัน: [อธิบายสีพร้อมค่า hex ขนาดตัวอักษร องค์ประกอบโต้ตอบ และสถานะ] ตรวจสอบด้านการเข้าถึง ได้แก่ คอนทราสต์สี ขนาดข้อความ ขนาดพื้นที่สัมผัส การใช้สีเพียงอย่างเดียวเพื่อสื่อความหมาย สถานะโฟกัส และการเคลื่อนไหว บอกว่าจุดใดควรตรวจด้วยเครื่องมือตรวจคอนทราสต์และโปรแกรมอ่านหน้าจอจริง แทนที่จะเชื่อคำตอบของคุณ

16. การวินิจฉัยสิ่งที่ไม่เวิร์ก

งานออกแบบนี้มีบางอย่างผิดปกติแต่ฉันบอกชื่อไม่ได้: [อธิบายให้ละเอียดที่สุด] ยังไม่ต้องเสนอวิธีแก้ ถามฉันได้สูงสุดหกคำถามเกี่ยวกับเจตนา ข้อจำกัด และบริบท แล้วจึงวินิจฉัยให้ดีที่สุดว่าปัญหาจริงคืออะไร บ่อยครั้งมันไม่ใช่สิ่งที่ฉันกำลังจ้องอยู่

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

17. เหตุผลเบื้องหลังงานออกแบบ

เขียนเหตุผลประกอบงานออกแบบสามย่อหน้าสำหรับ [อธิบายสิ่งที่ทำและการตัดสินใจเฉพาะเรื่องสี ตัวอักษร องค์ประกอบ และภาพ] ผู้อ่านคือผู้ที่ไม่ใช่นักออกแบบ [ผู้ก่อตั้ง / ลูกค้า / ผู้มีส่วนได้ส่วนเสีย] อธิบายแต่ละการตัดสินใจในแง่ผลต่อธุรกิจ ไม่ใช่ทฤษฎีการออกแบบ และไม่ใช้ศัพท์เฉพาะที่ต้องอธิบายเพิ่ม

18. คู่มือเสียงของแบรนด์

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

19. บันทึกส่งต่องานให้นักพัฒนา

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

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

นอกจากนี้ยังรัน โมเดล AI หลายตัวเคียงข้างกัน ได้แก่ Claude, GPT, Gemini, DeepSeek และ Grok ฟีเจอร์นี้มีประโยชน์จริงในงานออกแบบ เพราะโมเดลแต่ละตัวมีลีลาภาษาต่างกันอย่างเห็นได้ชัด ตัวที่เขียนบรีฟเชิงแนวคิดได้ดีมักไม่ใช่ตัวที่เขียนข้อความบนปุ่มได้กระชับที่สุด การส่งพรอมต์เดียวกันให้สองโมเดลใช้เวลาไม่กี่วินาทีและมักช่วยตัดสินได้ว่าจะใช้ผลลัพธ์ใด

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