ชุด UI นี้มีหน้าและไฟล์อะไรบ้าง?

ZIP มีหน้าเดสก์ท็อป SVG 6 หน้า ได้แก่ หน้าแรก เข้าสู่ระบบและสมัครสมาชิก สร้างภาพ ประวัติ แพ็กเกจและเครดิต และตั้งค่าบัญชี พร้อมธีมสี 2 ธีม บอร์ดคอมโพเนนต์และสถานะ แบบอ้างอิงมือถือ 2 หน้า คำอธิบายสถานการณ์ ข้อมูลตัวอย่าง และภาพพรีวิว

ใช้ไฟล์เหล่านี้เปิดเว็บสร้างภาพได้ทันทีไหม?

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

เปลี่ยนข้อความในแบบเป็นภาษาไทยได้ไหม?

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

ส่วนไหนใช้ฟรี และส่วนไหนต้องมีสมาชิกแบบชำระเงิน?

AI UI Designer Skill ใช้ฟรีสำหรับออกแบบจากความต้องการ นำเข้าชุดไฟล์ และใช้ธีม การดาวน์โหลดชุดเสริมนี้จากเว็บไซต์ต้องมีสมาชิกแบบชำระเงินที่ยังใช้งานอยู่ โดยไม่หักเครดิต

เมื่อสมาชิกสิ้นสุดแล้ว ยังใช้ไฟล์ได้ไหม?

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

ออกแบบบริการสร้างภาพ AI · ชุดไฟล์ SVG

ชุด UI เว็บสร้างภาพ AI วางโครงหน้าจอก่อนเริ่มเขียนโค้ด

ชุด UI นี้เหมาะกับนักพัฒนาอิสระและทีมผลิตภัณฑ์ที่กำลังทำบริการสร้างภาพ AI ลองดูตั้งแต่ช่องพรอมต์ ผลลัพธ์ ประวัติผลงาน ไปจนถึงหน้าเลือกแพ็กเกจ แล้วปรับข้อความ เลย์เอาต์ และธีมของ SVG ด้วย AI UI Designer Skill ฟรีใน Codex หรือ Claude Code

รวมอยู่ในสมาชิกแบบชำระเงินที่ยังใช้งานอยู่ ไม่หักเครดิต

ดูแบบหน้าจอทั้งหมด

แบบ SVG คงที่ · ข้อความตัวอย่างภาษาจีน · ไม่มีโค้ดแอปพลิเคชัน

แบบหน้าสร้างภาพธีมสว่าง มีช่องพรอมต์ การตั้งค่า และการ์ดผลลัพธ์ — หน้าสร้างภาพที่อยู่ในชุด · ธีมสว่าง

หน้าสำหรับเดสก์ท็อป: 6
ธีมสี: 2
แบบอ้างอิงมือถือ: 2
ไฟล์ต้นฉบับแก้ไขได้: SVG

หลังสร้างภาพแล้ว ผู้ใช้จะไปหน้าไหนต่อ?

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

แบบหน้าแรกธีมสว่าง มีส่วนแนะนำบริการ แกลเลอรี และขั้นตอนใช้งาน — หน้าแรกของบริการ
วางคำอธิบายบริการ ภาพตัวอย่าง และจุดเริ่มต้นสร้างภาพให้ผู้ใช้เข้าใจ

แบบหน้ายืนยันตัวตน มีช่องเข้าสู่ระบบและคำแนะนำการสมัครสมาชิก — เข้าสู่ระบบและสมัครสมาชิก
ดูช่องเข้าสู่ระบบ และตรวจช่องสมัครสมาชิกกับข้อความผิดพลาดในบอร์ดสถานะ

แบบหน้าสร้างภาพ มีแผงพรอมต์ พารามิเตอร์ และการ์ดภาพผลลัพธ์ — หน้าสร้างภาพ
จัดพรอมต์ โมเดล สัดส่วน จำนวนภาพ ค่าเครดิต และผลลัพธ์ให้อยู่ในลำดับที่เหมาะสม

แบบหน้าประวัติ มีช่องค้นหา การ์ดผลงาน และรายละเอียดภาพที่เลือก — ประวัติผลงาน
ดูการค้นหา รายละเอียดภาพ การใช้ค่าตั้งเดิม และการยืนยันลบ

แบบหน้าแพ็กเกจธีมสว่าง แสดงยอดเครดิตและแพ็กเกจสมมติสามแบบ — แพ็กเกจและเครดิต
ตรวจยอดเครดิต แพ็กเกจตัวอย่าง และแบบแจ้งผลการซื้อ

แบบหน้าบัญชี มีฟอร์มโปรไฟล์และข้อความผลการบันทึก — ตั้งค่าบัญชี
วางช่องโปรไฟล์ ข้อความหลังบันทึก และทางออกจากระบบ

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

คิดเผื่อหน้าว่าง ระหว่างรอ และเมื่อเกิดข้อผิดพลาด

ZIP รวมแบบหน้าเว็บ คอมโพเนนต์ และคำอธิบายสถานการณ์ไว้ด้วยกัน เพื่อใช้เทียบการปรับแก้กับหน้าอื่นในบริการ

ไฟล์ SVG ต้นฉบับที่ปรับแก้ได้

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

ตรวจโครงสร้างก่อนเลือกสี

มีไฟล์ JSON ธีมสี 2 ไฟล์ ใช้ไวร์เฟรมตรวจลำดับความสำคัญของข้อมูล แล้วเลือกแบบสว่างหรือมืดเป็นจุดเริ่มต้น

คอมโพเนนต์และสถานะหน้าจอ

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

ระบุขอบเขตแบบมือถือชัดเจน

หน้าสร้างภาพและประวัติมีแบบกว้าง 390px ส่วนหน้าอื่นอธิบายพฤติกรรมบนมือถือไว้ในเอกสารสถานการณ์ ไม่มีแบบมือถือแยกให้

นำเข้า ZIP แล้วบอกสิ่งที่ต้องการปรับ

นำเข้าชุดไฟล์ด้วย Skill ฟรี สคริปต์ช่วยนำเข้าต้องใช้ Python 3.9 ขึ้นไป

1
ดาวน์โหลด ZIP ผ่านบัญชีสมาชิก
เข้าสู่ระบบด้วยสมาชิก AI UI Designer แบบชำระเงินที่ยังใช้งานอยู่ การดาวน์โหลดชุดแบบไม่ใช้เครดิตสร้างภาพ
2
ส่งพาธไฟล์ในเครื่องให้ Skill
ติดตั้ง AI UI Designer Skill ใน Codex หรือ Claude Code ส่งพาธ ZIP ที่ดาวน์โหลดไว้ แล้วขอให้ผู้ช่วยนำเข้าชุดไฟล์
3
ปรับแบบและตรวจ SVG
ระบุธีม ช่องข้อมูล และเลย์เอาต์ที่ต้องการ ตรวจผลลัพธ์แล้วแก้ต่อในสำเนาสำหรับทำงาน โดยเก็บต้นฉบับไว้

ตัวอย่างคำสั่ง: หน้าทำภาพสินค้าสำหรับร้านค้าออนไลน์

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

เริ่มจากความต้องการของคุณ หรือใช้แบบหน้าจออ้างอิง?

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

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

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

FAQ

ไฟล์ ภาษา และเงื่อนไขดาวน์โหลด

ตรวจสิ่งที่ได้ในชุดออกแบบ และส่วนที่ต้องพัฒนาเพิ่มก่อนเปิดบริการจริง

ดูหน้าจอให้ครบ แล้วค่อยปรับเป็นผลิตภัณฑ์ของคุณ

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

ดาวน์โหลดแบบ SVG

รวมอยู่ในสมาชิกแบบชำระเงินที่ยังใช้งานอยู่ ไม่หักเครดิต

ชุด UI เว็บสร้างภาพ AI วางโครงหน้าจอก่อนเริ่มเขียนโค้ด

หลังสร้างภาพแล้ว ผู้ใช้จะไปหน้าไหนต่อ?

หน้าแรกของบริการ

เข้าสู่ระบบและสมัครสมาชิก

หน้าสร้างภาพ

ประวัติผลงาน

แพ็กเกจและเครดิต

ตั้งค่าบัญชี