จัดอบรม ออกแบบเว็บสมัยใหม่ด้วย Adobe XD ร่วมกับ Bootstrap 5 โดยสถาบันไอทีจีเนียส

6 ชั่วโมง (3,500 บาท) โปรโมชั่นลด 10% เหลือ 3,150 บาท

โทรศัพท์ 02-570-8449

เบอร์มือถือ 088-807-9770

ไลน์:

การออกแบบเว็บสมัยใหม่ ไม่ได้แค่ต้องการความสวยงามเพียงอย่างเดียวอีกต่อไป แต่การออกแบบที่ดียังต้องคำนึงถึงหลายเหตุปัจจัยประกอบด้วย ไม่ว่าจะเป็นเรื่องของการแสดงผลอุปกรณ์พกพา (mobile, tablet) โดยต้องออกแบบให้มีลักษณะเป็น Responsive web

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

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

สาขากรุงเทพฯ (ลาดพร้าว)

ยังไม่มีรอบเปิดอบรม (ลงชื่อจองไว้ได้)

ลงทะเบียนจอง ขอใบเสนอราคา

ออกแบบเว็บสมัยใหม่ด้วย Adobe XD ร่วมกับ Bootstrap 5 (Course outline PDF)
โปรไฟล์ของบริษัทไอทีจีเนียส เอ็นจิเนียริ่ง (โปรไฟล์ไอทีจีเนียส PDF)

เข้าใจแนวทางการออกแบบเว็บสมัยใหม่
สามารถสร้าง Slide ภาพแบบไม่ต้องมี jQuery
สามารถทำ Prototype เชื่อมโยงหน้าเว็บเพจใน Adobe XD ได้
สามารถจัดวาง layout แบบต่างๆ ใน Adobe XD ได้
สามารถเขียน CSS ทำการ custom หน้าตาของ bootstrap ตามต้องการ

ผู้ที่ต้องการออกแบบเว็บด้วยการใช้
โปรแกรม Adobe XD
UX/UI designer
Developers
กลุ่มผู้สนใจทั่วไป

สามารถใช้งานระบบคอมพิวเตอร์และอินเทอร์เน็ตได้

6 ชั่วโมง

ราคาปกติ 3,500 บาท / คน
โปรโมชั่นลด 10% เหลือ 3,150 บาท / คน
ราคาเหมาจ่าย (ผู้อบรมตั้งแต่ 10 คน) ตามแต่ตกลงกัน
ขอใบเสนอราคา

อาจารย์สามิตร โกยม

Basic HTML5 and CSS3 (คอร์ส html 5 และ css 3 พื้นฐาน)

การตกแต่งภาพด้วยโปรแกรม Adobe Photoshop

แนวทางการออกแบบเว็บและการใช้โปรแกรม Adobe XD

แนวทางการออกแบบเว็บสมัยใหม่
รู้จักการออกแบบ wireframe ก่อนเริ่มออกแบบจริง
แนะนำโปรแกรม Adobe XD สำหรับการออกแบบเว็บ
เครื่องมือพื้นฐานที่ทุกคนควรรู้จักใน Adobe XD
เรียนรู้การจัดวาง layout แบบต่างๆ ใน Adobe XD
การสร้างชุดเมนู เส้นโค้ง จัดกลุ่มวัตถุ และการทำ masking เพื่อรวมรูปต่างๆ
การทำ Prototype เชื่อมโยงหน้าเว็บเพจใน Adobe XD
การใส่ Animation และ Transition ต่างๆ ในการเปลี่ยนหน้า
การสร้างชุด Assets ไว้ใช้งานปรับคุณสมบัติให้วัตถุครั้งเดียวได้ทั้งหมด
การ Export ไฟล์ออกแบบไปใช้งานใน Bootstrap 5 กันต่อไป

การออกแบบเว็บสมัยใหม่ด้วย Bootstrap 5

ความเปลี่ยนแปลงใหม่ใน Bootstrap 5
เริ่มต้นใช้งานอย่างง่าย
เรียนรู้การวาง layout อย่างง่ายใน Bootstrap 5
การออกแบบเว็บด้วย flex box ใน Bootstrap 5
การสร้างเมนูนำทางอย่างรวดเร็ว
การสร้าง Slide ภาพแบบไม่ต้องมี jQuery
การทำงานกับแบบฟอร์ม
การทำงานกับตาราง
การทำงานกับ popup modal แบบใหม่ ไม่ต้องใช้ jQuery
การใช้งาน Components พื้นฐาน เช่น Alert, Badge, Button, Card, List, Tooltips เป็นต้น
การเขียน CSS ทำการ custom หน้าตาของ bootstrap ตามต้องการ
การทดสอบและปรับแต่งความเร็วในการใช้งานของเว็บที่ออกแบบมาให้เหมาะสมกับการนำไปใช้งานจริง
เรียนรู้การน้ำ Bootstrap ไปใช้งานกับ Framework อื่นๆ เช่น React JS และ Angular, Vue ต่อไป

Basic React.js

ปัจจุบันภาษา JavaScript มีการพัฒนาเป็นรูปแบบ Framework ต่างๆ มากมาย สำหรับนักพัฒนาเว็บไซต์น่าจะเคยผ่านการใช้งาน JavaScript ยอดนิยมหลายตัวมาบ้าง อาทิ jQuery, Angular, VueJS...

ดูข้อมูลเพิ่มเติม