วิธีสร้างแอนิเมชั่นการเลื่อนพื้นหลังข้อความที่มีสีสันด้วย Divi

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

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

มาเริ่มกันเลย!

แอบมอง

ต่อไปนี้คือภาพรวมคร่าวๆ ของการออกแบบที่เราจะสร้างในวันนี้

ดาวน์โหลดเค้าโครงภาพเคลื่อนไหวการเลื่อนพื้นหลังข้อความฟรี

หากต้องการใช้การออกแบบจากบทช่วยสอนนี้ คุณจะต้องดาวน์โหลดโดยใช้ปุ่มด้านล่างก่อน ในการเข้าถึงการดาวน์โหลด คุณจะต้องสมัครรับรายชื่ออีเมล Divi Daily ของเราโดยใช้แบบฟอร์มด้านล่าง ในฐานะสมาชิกใหม่ คุณจะได้รับ Divi goodness และ Divi Layout pack ฟรีทุกวันจันทร์! หากคุณอยู่ในรายชื่อแล้ว เพียงป้อนที่อยู่อีเมลของคุณด้านล่างแล้วคลิกดาวน์โหลด คุณจะไม่ถูก "สมัครใหม่" หรือรับอีเมลเพิ่มเติม

ดาวน์โหลดไฟล์

ดาวน์โหลดฟรี

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

ดาวน์โหลด

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

ในการนำเข้าเลย์เอาต์ไปยังเพจของคุณ เพียงแตกไฟล์ zip แล้วลากไฟล์ JSON ไปที่ Divi Builder

ไปกวดวิชากันเถอะ

สิ่งที่คุณต้องการเพื่อเริ่มต้น

ในการเริ่มต้น คุณจะต้องทำสิ่งต่อไปนี้:

1. หากคุณยังไม่ได้ติดตั้ง ให้ติดตั้งและเปิดใช้งานธีม Divi
2. สร้างหน้าใหม่ใน WordPress และใช้ Divi Builder เพื่อแก้ไขหน้าในส่วนหน้า (ตัวสร้างภาพ)
3. เลือกตัวเลือก "สร้างตั้งแต่เริ่มต้น"

หลังจากนั้น คุณจะมีผืนผ้าใบเปล่าเพื่อเริ่มออกแบบใน Divi

การออกแบบ 1: การไล่ระดับสีพื้นหลังข้อความพร้อมเอฟเฟกต์เลื่อนแนวนอน

การออกแบบครั้งแรกนี้จะมีเอฟเฟกต์การเลื่อนแนวนอนที่เคลื่อนไหวโมดูลตัวแบ่งที่มีสีสันด้านหลังโมดูลข้อความด้วยตัวกรองหน้าจอ

เพิ่มคอลัมน์

ในการเริ่มต้น ให้เพิ่มแถวหนึ่งคอลัมน์ในส่วนเริ่มต้น

เพิ่มโมดูลข้อความ

จากนั้นเพิ่มโมดูลข้อความใหม่ลงในคอลัมน์

เนื้อหา

สำหรับเนื้อหาคอลัมน์ ให้วาง HTML ต่อไปนี้ลงในกล่องเนื้อหา:

การออกแบบข้อความ

จากนั้นอัปเดตการออกแบบข้อความดังนี้:

• สีพื้นหลัง: #ffffff
• รูปแบบตัวอักษรของข้อความ: TT
• สีข้อความ: #000000
• ขนาดข้อความ: 100px (เดสก์ท็อป), 40px (โทรศัพท์)
• ระยะห่างของตัวอักษรข้อความ: 0.15em
• ความสูงของบรรทัดข้อความ: 1em
• การจัดตำแหน่งข้อความ: กึ่งกลาง

• แบบอักษรของหัวเรื่อง: Merriweather
• น้ำหนักตัวอักษรของหัวเรื่อง: ตัวหนา
• รูปแบบตัวอักษรของหัวเรื่อง: TT
• การจัดตำแหน่งข้อความหัวเรื่อง: Center
• หัวเรื่องข้อความสี: #000000
• ขนาดข้อความหัวเรื่อง: 200px (เดสก์ท็อป), 80px (โทรศัพท์)
• ระยะห่างหัวเรื่องตัวอักษร: 0.15em
• ความสูงของบรรทัดหัวเรื่อง: 1em

ช่องว่างภายในและตัวกรอง

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

หากต้องการเพิ่มช่องว่างภายในและตัวกรอง ให้อัปเดตสิ่งต่อไปนี้:

• ช่องว่างภายใน: บน 15px ล่าง 20px
• โหมดผสมผสาน: หน้าจอ

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

ตัวแบ่งด้านบนและด้านล่าง

เมื่อโมดูลข้อความของเราเสร็จสิ้น ให้เพิ่มตัวแบ่งสองสามตัว (ด้านบนและด้านล่างโมดูลข้อความ) สำหรับองค์ประกอบการออกแบบเพิ่มเติม

เพิ่มตัวแบ่งด้านล่าง

เพิ่มโมดูลตัวแบ่งใหม่ด้านล่างโมดูลข้อความ

การตั้งค่าตัวแบ่งด้านบน

เปิดการตั้งค่าตัวแบ่งและเลือกไม่แสดงตัวแบ่ง

จากนั้นอัปเดตพื้นหลังและกำหนดให้ตัวแบ่งมีโหมดผสมผสานเดียวกันกับโมดูลข้อความดังนี้:

• ไล่ระดับพื้นหลังซ้ายสี: #000000
• สีพื้นหลังไล่ระดับสีขวา: #ffffff
• ทิศทางการไล่ระดับสี: 90deg
• ตำแหน่งเริ่มต้น: 48%
• ตำแหน่งสุดท้าย: 0%
• โหมดผสมผสาน: หน้าจอ

จากนั้นอัปเดตความสูงของตัวแบ่งบนจอแสดงผลโทรศัพท์ดังนี้:

• ความสูง: 15px (โทรศัพท์)

เพิ่มตัวแบ่งด้านบน

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

จากนั้นสลับสีบนพื้นหลังแบบไล่ระดับ

อัปเดตการตั้งค่าแถว

เมื่อตัวแบ่งด้านบนและด้านล่างของเราเข้าที่แล้ว ให้อัปเดตการตั้งค่าแถวดังนี้:

• ความกว้างของรางน้ำ: 1 (เพื่อลบระยะขอบด้านล่างระหว่างโมดูล)
• ความกว้างสูงสุด: 600px (เพื่อให้การออกแบบสอดคล้องกันบนเดสก์ท็อปและแท็บเล็ต)
• การจัดแนวแถว: กึ่งกลาง
• ช่องว่างภายใน: 0px บน, 0px ด้านล่าง
• แนวนอนล้น: ซ่อน
• ล้นแนวตั้ง: ซ่อน

สร้างตัวแบ่งสำหรับสีพื้นหลังข้อความเคลื่อนไหว

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

จากนั้นเลือกไม่แสดงตัวแบ่ง

การตั้งค่าตัวแบ่งพื้นหลัง

อัปเดตตัวแบ่งด้วยพื้นหลังไล่ระดับสีดังนี้:

• พื้นหลังไล่ระดับสีซ้าย: #e02b20
• พื้นหลังไล่ระดับสีด้านขวา: #8300e9
• ทิศทางการไล่ระดับสี: 90deg
• ตำแหน่งเริ่มต้น: 30%
• ตำแหน่งสุดท้าย: 70%

เราต้องการตั้งค่าความสูงของตัวแบ่งให้สูงพอที่จะใส่สีข้อความทั้งหมดในโมดูลข้อความและตัวแบ่งด้านบนและด้านล่าง สำหรับการออกแบบนี้ ให้ตั้งค่าความสูงเป็น 400px

• ความสูง: 400px

จากนั้นให้ตำแหน่งที่แน่นอนกับตัวแบ่งเพื่อจัดตำแหน่งโดยตรงบนโมดูลอื่นๆ ใช้ดัชนี Z เพื่อให้ตัวแบ่งอยู่ด้านหลังโมดูลอื่นๆ

• ตำแหน่ง: Absolute
• ดัชนี Z: -1

เอฟเฟกต์การเลื่อนพื้นหลังตัวแบ่ง

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

อัปเดตสิ่งต่อไปนี้:

ใต้แท็บการเคลื่อนไหวในแนวนอน…

เดสก์ทอป

• เปิดใช้งานการเคลื่อนไหวในแนวนอน: ใช่
• ออฟเซ็ตเริ่มต้น: 6 (ที่ 20%)
• ออฟเซ็ตกลาง: 0 (ที่ 40% -60%)
• ออฟเซ็ตสิ้นสุด: -6 (ที่ 80%)

โทรศัพท์

• ออฟเซ็ตเริ่มต้น: 3
• ออฟเซ็ตสิ้นสุด: -3

ตรวจสอบให้แน่ใจว่าได้ตั้งค่าทริกเกอร์เอฟเฟกต์การเคลื่อนไหวไปที่กึ่งกลางขององค์ประกอบด้วย:

• ทริกเกอร์เอฟเฟกต์การเคลื่อนไหว: กลางองค์ประกอบ

เพิ่มการเว้นวรรคส่วน

ในการสร้างพื้นที่เลื่อนชั่วคราวเพื่อทดสอบการออกแบบ ให้เพิ่มส่วนต่อไปนี้:

• ขอบ: 80vh บน 80vh ล่าง

ผลลัพธ์

นี่คือผลลัพธ์สุดท้ายของการออกแบบครั้งแรก

การออกแบบ 2: การไล่ระดับสีพื้นหลังข้อความพร้อมเอฟเฟกต์การเลื่อนแบบหมุน

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

ส่วนซ้ำ

ในการสร้างการออกแบบถัดไป ให้ทำซ้ำทั้งส่วนที่มีการออกแบบแรกที่เราสร้างขึ้น

การตั้งค่าตัวแบ่งพื้นหลัง

จากนั้นอัปเดตการตั้งค่าสำหรับตัวแบ่งที่ใช้สำหรับพื้นหลังข้อความดังนี้:

• ความกว้าง: 600px (เดสก์ท็อป), 300px (โทรศัพท์)
• ความสูง: 600px (เดสก์ท็อป), 300px (โทรศัพท์)

จากนั้นอัปเดตมุมโค้งมนดังนี้:

• มุมโค้งมน: 50%

สิ่งนี้จะทำให้ตัวแบ่งมีรูปร่างเป็นวงกลมซึ่งเป็นสิ่งที่เราต้องการสำหรับเอฟเฟกต์การเลื่อนการหมุนที่เราจะเพิ่มลงในตัวแบ่ง

ถัดไป ปรับออฟเซ็ตแนวตั้งเพื่อจัดตำแหน่งวงกลมด้านหลังเนื้อหาข้อความดังนี้:

• ออฟเซ็ตแนวตั้ง: -100px (เดสก์ท็อป), -50px (โทรศัพท์)

อัปเดตตัวแบ่งด้านบนและด้านล่าง

เมื่อตัวแบ่งอยู่ในตำแหน่งแล้ว ให้อัปเดตพื้นหลังตัวแบ่งด้านบนดังนี้:

• พื้นหลังไล่ระดับสีขวา: โปร่งใส

จากนั้นอัปเดตพื้นหลังตัวแบ่งด้านล่างดังนี้:

• พื้นหลังไล่ระดับสีซ้าย: โปร่งใส

อัปเดตเอฟเฟกต์การเลื่อนพื้นหลังตัวแบ่ง

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

ใต้แท็บ Fading In and Out …

• เปิดใช้งานการเฟดเข้าและออก: ใช่
• ความทึบปานกลาง: 100% (ที่ 40% -60%)
• ความทึบสิ้นสุด: 0%

ภายใต้แท็บการ ปรับขนาดขึ้นและลง ...

• เปิดใช้งานการปรับขนาดขึ้นและลง: ใช่
• ระดับเริ่มต้น: 105%
• ระดับกลาง: 115%
• สเกลสิ้นสุด: 105%

ภายใต้แท็บ การหมุน …

• เปิดใช้งานการหมุน: ใช่
• การหมุนเริ่มต้น: 360deg
• สิ้นสุดการหมุน: -360deg

อย่าลืมปิดการใช้งานเอฟเฟกต์ Horizontal Motion ด้วย

ผลลัพธ์

นี่คือผลลัพธ์ของการออกแบบ 2

การออกแบบ 3: พื้นหลังข้อความพร้อมวงกลมเคลื่อนไหวหลายวง

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

ทำซ้ำมาตรา2

ขั้นแรกให้ทำซ้ำส่วนนี้

อัปเดตตัวแบ่งด้านบนและด้านล่าง

จากนั้นเปิดการตั้งค่าสำหรับตัวแบ่งด้านบนในส่วนใหม่/ที่สาม และเพิ่มสีดำกลับไปยังพื้นหลังการไล่ระดับสีดังนี้:

• พื้นหลังไล่ระดับสีขวา: #000000

เปิดการตั้งค่าสำหรับตัวแบ่งด้านล่างและอัปเดตพื้นหลังด้วย

• ไล่ระดับพื้นหลังซ้ายสี: #000000

การสร้างตัวแบ่งพื้นหลัง 1

ตัวแบ่งพื้นหลังแรกมีอยู่แล้วจากการออกแบบก่อนหน้านี้ เราจะทำให้มันเล็กลงและเคลื่อนไหวให้แตกต่างออกไป

ตัวแบ่งพื้นหลัง 1 การตั้งค่า

เปิดการตั้งค่าสำหรับตัวแบ่งพื้นหลังและอัปเดตสิ่งต่อไปนี้:

• ความกว้าง: 250px (เดสก์ท็อปและแท็บเล็ต), 125px (โทรศัพท์)
• ความสูง: 250px (เดสก์ท็อปและแท็บเล็ต), 125px (โทรศัพท์)
• ออฟเซ็ตแนวตั้ง: 0px (เดสก์ท็อป แท็บเล็ต และโทรศัพท์)

เอฟเฟกต์ตัวแบ่งพื้นหลัง 1 เลื่อน

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

ตอนนี้เราสามารถเพิ่มเอฟเฟกต์การเลื่อนใหม่ได้ดังนี้:

ใต้แท็บ Vertical Motion…

เดสก์ทอป

• เปิดใช้งานการเคลื่อนไหวในแนวตั้ง: ใช่
• ออฟเซ็ตเริ่มต้น: -2
• ออฟเซ็ตกลาง: 2 (ที่ 60%)
• ออฟเซ็ตสิ้นสุด: 4

โทรศัพท์

• ออฟเซ็ตเริ่มต้น: -1
• ออฟเซ็ตกลาง: 1 (ที่ 60%)
• ออฟเซ็ตสิ้นสุด: 2

ใต้แท็บการเคลื่อนไหวในแนวนอน…

• เปิดใช้งานการเคลื่อนไหวในแนวนอน: ใช่
• ออฟเซ็ตเริ่มต้น: 0
• ออฟเซ็ตกลาง: 2 (ที่ 45% -65%)
• ออฟเซ็ตสิ้นสุด: 0 (ที่ 80%)

การสร้างตัวแบ่งพื้นหลัง2

ในการสร้างตัวแบ่งพื้นหลังที่สอง ให้ทำซ้ำตัวแบ่งพื้นหลังแรก

ตัวแบ่งพื้นหลัง 2 อัปเดต

พื้นหลัง

จากนั้นเปิดการตั้งค่าสำหรับตัวแบ่งพื้นหลังที่สอง/ซ้ำกัน และอัปเดตสีพื้นหลังต่อไปนี้:

• พื้นหลังไล่ระดับสีซ้าย: rgba(224,153,0,0.9)
• พื้นหลังไล่ระดับสีขวา: rgba(255,243,71,0.9)

ขนาด

จากนั้นอัปเดตขนาดดังนี้:

• ความกว้าง: 300px (เดสก์ท็อปและแท็บเล็ต), 150px (โทรศัพท์)
• ความสูง: 300px (เดสก์ท็อปและแท็บเล็ต), 150px (โทรศัพท์)

เอฟเฟกต์เลื่อน

จากนั้นอัปเดตเอฟเฟกต์การเลื่อนดังนี้:

ใต้แท็บ Vertical Motion…

เดสก์ทอป

• ออฟเซ็ตเริ่มต้น: 5
• ออฟเซ็ตกลาง: 0
• ออฟเซ็ตสิ้นสุด: -5

โทรศัพท์

• ออฟเซ็ตเริ่มต้น: 2
• ออฟเซ็ตกลาง: 0
• ออฟเซ็ตสิ้นสุด: -2

ใต้แท็บการเคลื่อนไหวในแนวนอน…

เดสก์ทอป

• ออฟเซ็ตเริ่มต้น: 0
• ออฟเซ็ตกลาง: 3
• ออฟเซ็ตสิ้นสุด: 2

โทรศัพท์

• ออฟเซ็ตกลาง: 1.5
• ออฟเซ็ตสิ้นสุด: -1

การสร้างตัวแบ่งพื้นหลัง 3

ในการสร้างตัวแบ่งพื้นหลังที่สามและสุดท้าย ให้ทำซ้ำตัวแบ่งพื้นหลัง 2

ตัวแบ่งพื้นหลัง 3 อัปเดต

พื้นหลัง

จากนั้นอัปเดตสีไล่ระดับพื้นหลังดังนี้:

• พื้นหลังไล่ระดับสีซ้าย: rgba(124,218,36,0.9)
• พื้นหลังไล่ระดับสีขวา: rgba(12,113,195,0.9)

ขนาด

จากนั้นอัปเดตขนาดดังนี้:

• ความกว้าง: 200px (เดสก์ท็อปและแท็บเล็ต), 100px (โทรศัพท์)
• ความสูง: 200px (เดสก์ท็อปและแท็บเล็ต), 100px (โทรศัพท์)

เอฟเฟกต์เลื่อน

จากนั้นอัปเดตเอฟเฟกต์การเลื่อนดังนี้:

ใต้แท็บ Vertical Motion…

• ออฟเซ็ตเริ่มต้น: 0
• ออฟเซ็ตกลาง: 0
• ออฟเซ็ตสิ้นสุด: 4

ใต้แท็บการเคลื่อนไหวในแนวนอน…

เดสก์ทอป

• ออฟเซ็ตเริ่มต้น: 6 (ที่ 20%)
• ออฟเซ็ตกลาง: 0 (ที่ 40% -60%)
• ออฟเซ็ตสิ้นสุด: 6 (ที่ 80%)

โทรศัพท์

• ออฟเซ็ตเริ่มต้น: 3
• ออฟเซ็ตสิ้นสุด: 3

นี่คือผลลัพธ์สุดท้ายของการออกแบบ 3

ผลลัพธ์สุดท้าย

ตอนนี้ มาดูผลลัพธ์สุดท้ายของการออกแบบทั้งสามกัน

และนี่คือการออกแบบบนมือถือ

เวอร์ชั่นมืด

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

นี่คือวิธีการทำสำหรับการออกแบบ 3

ขั้นแรก เปลี่ยนพื้นหลังของส่วนเป็นสีดำ

จากนั้นอัปเดตการตั้งค่าโมดูลข้อความดังนี้:

• สีพื้นหลัง: #000000
• สีข้อความ: #ffffffff
• หัวเรื่องสีข้อความ: #ffffff
• โหมดผสมผสาน: ทวีคูณ

นี่คือผลลัพธ์

และนี่คือสิ่งที่การออกแบบที่เหลือจะมีลักษณะเหมือนเมื่อใช้เวอร์ชันสีเข้ม

ความคิดสุดท้าย

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

ฉันหวังว่าจะได้ยินจากคุณในความคิดเห็น

ไชโย!