วิธีสร้างไอคอนแอพใน Illustrator

Sep 13, 2025

วิธีการ

หน้า 1 จาก 2:

วิธีการสร้างไอคอนแอปใน Illustrator: ขั้นตอนที่ 01-11

วิธีการสร้างไอคอนแอปใน Illustrator: ขั้นตอนที่ 01-11
วิธีสร้างไอคอนแอพใน Illustrator: ขั้นตอนที่ 12-23

ในเรื่องนี้ สอน Illustrator ฉันจะแสดงวิธีสร้างไอคอนแอปเครื่องคิดเลขใน Adobe Illustrator CC . เราจะใช้เครื่องมือรูปร่างที่แตกต่างกันเครื่องมือปากกาพร้อมกับคุณสมบัติ 3D ของ Illustrator หวังว่าคุณจะได้เรียนรู้เคล็ดลับที่มีประโยชน์บางอย่างตลอดทาง

คุณจะต้องดาวน์โหลดสองสามข้อ แบบอักษรฟรี สำหรับการกวดวิชานี้: DS-DIGITAL และ Bebas Neue . หากคุณยังไม่มีแล้วคุณจะได้รับ Adobe Creative Cloud ที่นี่ .

แต่ก่อนอื่นเรามาดูผลลัพธ์สุดท้าย:

01. เปิดเอกสาร

illustrator font icon — คลิกที่ภาพเพื่อขยาย

สร้างเอกสารใหม่ใน Illustrator ด้วยความกว้าง 600px และความสูง 450px

02. สร้างพื้นหลัง

illustrator app icon — คลิกที่ภาพเพื่อขยาย

เลือกเครื่องมือสี่เหลี่ยมผืนผ้า (m) และเลือก # 44484D เติมสีเพื่อวาดสี่เหลี่ยมผืนผ้าที่ครอบคลุมผ้าใบเป็นพื้นหลัง

03. ทำฐาน

เราจะเริ่มต้นด้วยการสร้างฐานของไอคอน ดังนั้นเลือกเครื่องมือสี่เหลี่ยมผืนผ้า (m) แล้วคลิกหน้าต่างผ้าใบเพื่อดูตัวเลือกหน้าต่าง ป้อนความกว้าง 280px ความสูง 265px และกดตกลงเพื่อวาดสี่เหลี่ยมดังที่แสดงด้านล่าง เลือก # E7DED0 เป็นสีเติม

ต่อไปเราจะแปลงเป็นสี่เหลี่ยมโค้งมน เลือกรูปสี่เหลี่ยมผืนผ้านี้ด้วยความช่วยเหลือของเครื่องมือการเลือก (V) Orby คลิกเป้าหมายรูปวงแหวนที่ด้านขวาของชั้นที่เกี่ยวข้อง และไปที่เอฟเฟกต์ & GT; stylize & gt; รอบมุม ป้อน 50px สำหรับรัศมีและกดตกลง

Click image to enlarge — คลิกที่ภาพเพื่อขยาย

04. ชุดเอฟเฟกต์

เลือกสี่เหลี่ยมผืนผ้านี้และไปที่เอฟเฟกต์ & GT; 3D & GT; ขับไล่และแอมป์; เอียง. ใช้การตั้งค่าที่กำหนดที่นี่

05. ใช้การไล่ระดับสี

หากต้องการใช้การไล่ระดับสีที่ลึกซึ้งเหนือฐานวาดรูปสี่เหลี่ยมผืนผ้าที่ครอบคลุมรูปร่าง 3D ทั้งหมดโดยใช้สีเติมใด ๆ ตอนนี้แปลงเป็นสี่เหลี่ยมโค้งมนด้วยรัศมีมุม 50px

ตอนนี้เปลี่ยนกรอกข้อมูลด้วยการไล่ระดับสีดำ - ดำโดยใช้เครื่องมือไล่ระดับสี (G) เปลี่ยนโหมดการผสมเป็นสีเผาด้วยความทึบ 20% ในแผงความโปร่งใส (Shift + Ctrl + F10)

06. สร้างสี่เหลี่ยมผืนผ้าอื่น

ถัดไปวาดรูปสี่เหลี่ยมผืนผ้าอีกอันที่มีความกว้าง 280px และความสูง 178px โดยใช้ # E9E3D9 เติมสีและสีขาว เลือก 1PT Stroke น้ำหนักจากแถบควบคุมด้านบน

ตอนนี้แปลงเป็นสี่เหลี่ยมโค้งมนโดยรัศมี 40px

หลังจากนั้นใช้การไล่ระดับสีต่อไปนี้และเปลี่ยนโหมดการผสมเพื่อคูณด้วยความทึบ 50% ในแผงความโปร่งใส (Shift + Ctrl + F10)

07. ทำสี่เหลี่ยมโค้งมน

วาดรูปสี่เหลี่ยมผืนผ้าอีก 230px ด้วยและความสูง 35px โดยใช้ # BCBA95 เติมสีและสำหรับโรคหลอดเลือดสมองใช้แสงไปจนถึงการไล่ระดับสีเทาเข้มดังที่แสดงด้านล่าง เลือก 3PT Troke Weight จากแถบควบคุมด้านบน

แปลงสี่เหลี่ยมผืนผ้านี้เป็นสี่เหลี่ยมโค้งมนโดยรัศมีมุม 10px

08. ทำให้เอฟเฟกต์เรืองแสง

ถัดไปเลือกสี่เหลี่ยมผืนผ้าใหม่นี้และไปที่หน้าต่าง & GT; ลักษณะที่ปรากฏเพื่อดูแผงลักษณะที่ปรากฏหรือกด Shift + F6 ตอนนี้เลือกแอตทริบิวต์เติมและคลิกไอคอนของรายการที่เลือกซ้ำที่ด้านล่างของแผงลักษณะที่ปรากฏเพื่อทำซ้ำการเติม และแทนที่การเติมใหม่นี้ด้วย Black & Amp; การไล่ระดับสีขาวที่ 90 องศาดังที่แสดงข้างต้น

เก็บสี่เหลี่ยมผืนผ้านี้ให้เลือกและไปที่เอฟเฟกต์ & GT; stylize & gt; เรืองแสงภายใน ใช้การตั้งค่าที่กำหนดที่นี่ เมื่อเสร็จแล้วให้เปลี่ยนโหมดการผสมแบบไล่ระดับสีเพื่อคูณด้วยความทึบ 30%

09. คัดลอกสี่เหลี่ยมผืนผ้า

เลือกสี่เหลี่ยมผืนผ้าใหม่นี้แล้วกด CTRL + C เพื่อคัดลอกและกด CTRL + B เพื่อวางในด้านหลัง ลากคัดลอกนี้ 1-2 ขั้นตอนลง ตอนนี้ลบแอตทริบิวต์กรอกข้อมูลโดยการลากเพื่อลบไอคอนที่ด้านล่างของแผงลักษณะที่ปรากฏและให้ 3pt จังหวะของ # D1D2D4 สี.

10. เพิ่มข้อความ

ถัดไปเราจะเพิ่มข้อความบนหน้าจอ เลือกเครื่องมือประเภท (t) เพื่อพิมพ์ข้อความโดยใช้ # 404041 เติมสี ฉันใช้แบบอักษร DS-Digital ที่นี่

ตอนนี้กด Ctrl + C เพื่อคัดลอกและกด CTRL + B เพื่อวางในด้านหลัง ลากข้อความที่คัดลอก 1-2 ขั้นตอนลงและเปลี่ยนสีเติมให้เป็น # 808284 .

11. ทำฐาน

ต่อไปเราจะสร้างฐานของปุ่ม เลือกเครื่องมือสี่เหลี่ยมผืนผ้าเพื่อวาดสี่เหลี่ยมผืนผ้าด้วยมิติต่อไปนี้โดยใช้ # 847d72 เติมสีและแสงเดียวกับการไล่ระดับสีเทาเข้มบนจังหวะที่ใช้ในขั้นตอนที่ 7 อย่างไรก็ตามเลือก 1PT Stroke Weight ที่นี่

และแปลงเป็นสี่เหลี่ยมโค้งมนโดยรัศมี 25px

หลังจากนั้นซ้ำแอตทริบิวต์เติมในแผงที่ปรากฏและใช้ Black & AMP; ไล่ระดับสีขาวที่ 90 องศา เปลี่ยนโหมดการผสมเพื่อคูณด้วยความทึบ 50%

หน้าถัดไป: ขั้นตอนสุดท้ายในการสร้างแอปไอคอนใน Illustrator ...

หน้าปัจจุบัน: วิธีการสร้างไอคอนแอปใน Illustrator: ขั้นตอนที่ 01-11

หน้าต่อไป วิธีสร้างไอคอนแอพใน Illustrator: ขั้นตอนที่ 12-23

วิธีสร้างไอคอนแอพใน Illustrator

01. เปิดเอกสาร

02. สร้างพื้นหลัง

03. ทำฐาน

04. ชุดเอฟเฟกต์

05. ใช้การไล่ระดับสี

06. สร้างสี่เหลี่ยมผืนผ้าอื่น

07. ทำสี่เหลี่ยมโค้งมน

08. ทำให้เอฟเฟกต์เรืองแสง

09. คัดลอกสี่เหลี่ยมผืนผ้า

10. เพิ่มข้อความ

11. ทำฐาน

วิธีการ - บทความยอดนิยม

วิธีทำความสะอาด Paintbrushes: คู่มือที่ชัดเจน

วิธีการวาด Asuka จาก Neon Genesis Evangelion

วิธีเปลี่ยน WordPress เป็นเครื่องมือสร้างภาพ

วิธีการสร้างเลย์เอาต์ที่ซับซ้อนโดยใช้ CSS

แคชในเครื่องบูสเตอร์ประสิทธิภาพของบีบีซี

วิธีการสร้าง Glazes ด้วยสีน้ำ

วิธีการออกแบบโปรโมชั่นสำหรับแบรนด์จินตภาพ

วิธีการสร้างริบบิ้นริบบิ้นที่ยืดหยุ่น

หมวดหมู่