ภาพรวม กรณีการใช้งาน ทักษะ พรอมต์ราคา บล็อก อัปเดต

ม็อคอัพ UI เครื่องมือเปรียบเทียบ JSON แบบ Dark Mode

สร้างม็อคอัพ UI เดสก์ท็อปโหมดมืดที่ดูเป็นมืออาชีพสำหรับเครื่องมือเปรียบเทียบ JSON API และตรวจสอบโค้ด

พรอมต์

เป้าหมาย: สร้างม็อคอัพ UI แอปพลิเคชันเดสก์ท็อปในโหมดมืดสำหรับเครื่องมือเปรียบเทียบ JSON ที่ชื่อ Tilted Diffs โดยแสดงการเปรียบเทียบการตอบกลับ API ในหัวข้อ API Response — Checkout v2 ผืนผ้าใบ: ภาพหน้าจอเดสก์ท็อปแบบไวด์สกรีนอัตราส่วน 16:10 ขนาดประมาณ 1152×768 พิกเซล พร้อมหน้าต่างแอปสไตล์ macOS ที่ลอยอยู่บนพื้นหลังไล่ระดับสีน้ำเงินเข้ม ใช้เงาที่ดูนุ่มนวล มุมโค้งมน ขอบบาง และความสวยงามแบบเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ เลย์เอาต์: แอปมี 4 ส่วนหลัก ได้แก่ แถบด้านข้างซ้าย 1 ส่วน แถบเครื่องมือด้านบนที่ครอบคลุมพื้นที่ตัวแก้ไข 1 ส่วน และบานหน้าต่างแก้ไขโค้ดแนวตั้ง 3 ส่วน บานหน้าต่างแก้ไขแรกถูกเลือกและมีเส้นขอบเรืองแสงสีฟ้าสดใส บานหน้าต่างตรงกลางแสดงไฮไลต์ความแตกต่างของโค้ดแบบอินไลน์ที่มีสีสัน บานหน้าต่างขวาสุดมีขนาดแคบและมองเห็นได้บางส่วน เหมือนกับแท็บไฟล์เพิ่มเติมหรือคอลัมน์เปรียบเทียบที่สาม แถบด้านข้างซ้าย: แสดงปุ่มสัญญาณไฟจราจรของ macOS ที่มุมซ้ายบน ได้แก่ วงกลม 3 วง สีแดง สีเหลือง และสีเขียว ใต้ชื่อแอป ให้ใส่ช่องค้นหา 1 ช่องพร้อมข้อความตัวอย่าง “Search diffs…” และคำแนะนำคีย์บอร์ด ด้านล่างแสดงรายการ diff ที่บันทึกไว้ 8 รายการพร้อมไอคอนเอกสารขนาดเล็กและเวลา: 1) “API Response — Checkout v2” พร้อมเวลา “Today, 10:24 AM” โดยไฮไลต์เป็นสีฟ้าในฐานะรายการที่ถูกเลือก; 2) “User Profile — Public API” พร้อมเวลา “Yesterday, 4:18 PM”; 3) “Orders Endpoint — v1 vs v2” พร้อมเวลา “May 20, 2025, 9:14 AM”; 4) “Product Catalog — EU Region” พร้อมเวลา “May 19, 2025, 2:47 PM”; 5) “Auth Response — SSO” พร้อมเวลา “May 18, 2025, 11:03 AM”; 6) “Billing Summary — Q2” พร้อมเวลา “May 17, 2025, 3:22 PM”; 7) “Webhook Payload — Stripe” พร้อมเวลา “May 16, 2025, 10:11 AM”; 8) “Search Results — Relevance” พร้อมเวลา “May 15, 2025, 5:35 PM” ที่ด้านล่างให้ใส่ปุ่ม “+ New Diff” สีฟ้าที่โดดเด่น 1 ปุ่ม และไอคอนฟันเฟืองขนาดเล็ก 1 อัน แถบเครื่องมือด้านบน: ทางด้านซ้าย ให้แสดงชื่อ “API Response — Checkout v2” พร้อมไอคอนดินสอแก้ไขขนาดเล็ก ตรงกลางให้ใส่ตัวควบคุมแบบแบ่งส่วน (segmented control) ที่มีแท็บ 2 แท็บ: “Editors” ที่ถูกเลือกเป็นสีฟ้า และ “Diff” ที่ไม่ได้เลือก ทางด้านขวาให้ใส่ตัวควบคุมทางลัดขนาดกะทัดรัด 4 รายการ ได้แก่ “⌘T add column”, “⌘D toggle diff”, “⌘← / ⌘→ move focus” และเว้นระยะห่างเล็กน้อยระหว่างกลุ่ม บานหน้าต่างแก้ไข: ใช้ฟอนต์โค้ดแบบ monospaced, หมายเลขบรรทัด, การเน้นไวยากรณ์ JSON, แผงสีน้ำเงินเข้ม และขอบโค้งมนบางๆ ส่วนหัวของบานหน้าต่างซ้ายคือ “source.json” พร้อมไอคอนเอกสารและเมนูสามจุด ส่วนหัวของบานหน้าต่างกลางคือ “target.json” พร้อมไอคอนเอกสารและเมนูสามจุด ส่วนหัวของบานหน้าต่างขวาที่แคบคือ “more.json” และควรแสดงเฉพาะส่วนซ้ายของโค้ดเพื่อสื่อถึงการล้นของข้อมูล บานหน้าต่างแก้ไขแต่ละส่วนมีแถบสถานะด้านล่างแสดง “Ln 1, Col 1”, “Spaces: 2”, “UTF-8”, “LF” และ “JSON” เนื้อหาโค้ด: แสดง JSON สำหรับการตอบกลับการชำระเงินของคำสั่งซื้อ ใช้ requestId “req_8f3a9b42”, orderId “ord_123456”, สกุลเงิน USD, รายการสินค้าสำหรับ Wireless Headphones และ Travel Case รวมถึงข้อมูลการจัดส่ง เวอร์ชันต้นฉบับทางซ้ายควรมี timestamp “2025-05-21T10:24:31Z”, เวอร์ชัน “v1”, สถานะ “pending”, totalAmount 129.99, Wireless Headphones unitPrice 99.99 พร้อมส่วนลด null, Travel Case จำนวน 1, unitPrice 30.00, ส่วนลด null, วิธีการจัดส่ง “standard”, estimatedDays 5 และที่อยู่ “123 Market St” เวอร์ชันเป้าหมายตรงกลางควรแสดงเครื่องหมาย diff ในช่องว่างด้านซ้ายและไฮไลต์แถวที่มีสี: แถวที่ลบออกเป็นสีแดง, แถวที่เพิ่มเข้ามาเป็นสีเขียว, แถวที่เปลี่ยนแปลงเป็นสีเหลือง โดยควรแสดง timestamp ที่เปลี่ยนจาก “2025-05-20T15:11:09Z” เป็น “2025-05-21T10:24:31Z”, เวอร์ชันเปลี่ยนเป็น v2, สถานะเปลี่ยนจาก pending เป็น confirmed, totalAmount เปลี่ยนเป็น 139.99, Wireless Headphones unitPrice เปลี่ยนเป็น 109.99 และเพิ่มส่วนลดเป็น 10.00, Travel Case จำนวนเปลี่ยนเป็น 2 และวิธีการจัดส่งเปลี่ยนเป็น express พร้อม estimatedDays 2 แสดงหมายเลขบรรทัดประมาณ 32 บรรทัดในแต่ละตัวแก้ไข สไตล์ภาพ: อินเทอร์เฟซเครื่องมือสำหรับนักพัฒนา SaaS ระดับพรีเมียม, การเรนเดอร์ที่คมชัดเหมือนเวกเตอร์, ธีมมืด, สีเน้นสีน้ำเงินโคบอลต์, ข้อความสีเทาหม่น, ภาพหน้าจอ UI ที่สมจริงแต่สะอาดตา, ไม่มีบุคคล, ไม่มีลายน้ำ, ไม่มีส่วนประกอบของเบราว์เซอร์นอกหน้าต่างแอป รักษาข้อความทั้งหมดให้อ่านง่ายและจัดวางตามตาราง

วิธีใช้ prompt นี้

1
คัดลอก prompt เต็มด้านบน
2
เปิดแพลตฟอร์มที่รองรับ GPT Image 2 เช่น YouMind แล้ววาง prompt ลงไป
3
เปลี่ยนหัวข้อ สไตล์ หรือรายละเอียดให้ตรงไอเดียของคุณ แล้วสร้าง

นี่คือ AI prompt ฟรีจากคลัง prompt ของ YouMind สำรวจ ภาพ prompt อีกนับพันรายการ ทั้งหมดคัดลอกและปรับใช้ได้ฟรี

ดู ภาพ prompt เพิ่มเติม

เพิ่มเติมจาก GPT Image 2

หมวดหมู่ภาพทั้งหมด

กรณีใช้งาน

โปรไฟล์ / รูปประจำตัว โพสต์บนโซเชียลมีเดีย อินโฟกราฟิก / ภาพประกอบเพื่อการศึกษา ภาพขนาดย่อของ YouTube คอมิก / สตอรี่บอร์ด ดูเพิ่มเติม

สไตล์

การถ่ายภาพ ภาพยนตร์ / ภาพนิ่งจากภาพยนตร์อนิเมะ / มังงะ ภาพประกอบ ภาพร่าง / ลายเส้น ดูเพิ่มเติม

หัวข้อ

ภาพบุคคล / เซลฟี่อินฟลูเอนเซอร์ / นางแบบ ตัวละคร กลุ่ม / คู่ผลิตภัณฑ์ดูเพิ่มเติม

ฟีเจอร์พรอมต์เพิ่มเติม

คลัง AI

ค้นหา prompt ด้วย AI

ให้ AI ช่วยค้นหา prompt หลายหมื่นรายการ กรองตามโมเดล ช่วงเวลา คีย์เวิร์ด และจัดเรียงตามยอดมีส่วนร่วม เช่น ยอดวิว ยอดบันทึก ยอดแชร์ และอื่นๆ

ลองใช้ฟรี

เครื่องมือด้านภาพ

รูปภาพเป็นพรอมต์

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

แปลงรูปภาพเป็นพรอมต์