อาจารย์สามิตร โกยม
Basic HTML+CSS (คอร์สเขียนเว็บพื้นฐาน)
HTML 5 CSS 3 and Bootstrap 5Basic HTML+CSS (คอร์สเขียนเว็บพื้นฐาน)
สอนการออกแบบเว็บไซต์ด้วยภาษา HTML และ CSS สำหรับผู้เริ่มต้น ที่ยังไม่มีความรู้มาก่อนเลย สามารถเริ่มต้นเรียนรู้ได้จากคอร์สนี้ โดยลักษณะการสอนจะเป็นการเรียนรู้ทฤษฎี ควบคู่ไป...
รายละเอียด Course ID: gpc-34
การออกแบบเว็บสมัยใหม่ ไม่ได้แค่ต้องการความสวยงามเพียงอย่างเดียวอีกต่อไป แต่การออกแบบที่ดียังต้องคำนึงถึงหลายเหตุปัจจัยประกอบด้วย ไม่ว่าจะเป็นเรื่องของการแสดงผลอุปกรณ์พกพา (mobile, tablet) โดยต้องออกแบบให้มีลักษณะเป็น Responsive web
เรื่องของความเร็วก็เป็นอีกองค์ประกอบสำคัญไม่แพ้กัน เว็บสวยแต่เข้าใช้งานได้ช้า ก็อาจถูกทอดทิ้งไว้ข้างหลังได้ นอกจากการเลือกใช้แนวทางในการออกแบบเว็บ นักพัฒนาและนักออกแบบจึงต้องใส่ใจในเรื่องความเร็วของเว็บในการเรียกใช้งานด้วย
เริ่มต้นจากเล่าแนวคิดในการออกแบบ แล้วพาใช้ Figma เครื่องมือออกแบบที่เหล่า UX/ UI Designerใช้มากที่สุดเป็นอันดับ 1 ในปี 2022 จากนั้นนำสิ่งที่ออกแบบเสร็จแล้วไปขึ้นโครงเว็บกันจริงๆ ด้วย Bootstrap 5 ซึ่งเป็นเวอร์ชั่นล่าสุดที่เน้นความเบา และเร็วขึ้นกว่าเดิมเยอะ
รอบการเปิดอบรม
ไฟล์รายละเอียดคอร์ส
- ออกแบบเว็บสมัยใหม่ด้วย Figma ร่วมกับ Bootstrap 5 (Course outline PDF)
- โปรไฟล์ของบริษัทไอทีจีเนียส เอ็นจิเนียริ่ง (โปรไฟล์ไอทีจีเนียส PDF)
วัตถุประสงค์
- เข้าใจแนวทางการออกแบบเว็บสมัยใหม่
- สามารถทำ Prototype เชื่อมโยงหน้าเว็บเพจใน Figma ได้
- สามารถจัดวาง layout แบบต่างๆ ใน Figma ได้
- สามารถเขียน CSS ทำการ custom หน้าตาของ bootstrap ตามต้องการ
กลุ่มเป้าหมาย
- ผู้ที่ต้องการออกแบบเว็บด้วยการใช้โปรแกรม Figma
- UX/UI designer
- Developers
- กลุ่มผู้สนใจทั่วไป
ความรู้พื้นฐาน
- สามารถใช้งานระบบคอมพิวเตอร์และอินเทอร์เน็ตได้
ระยะเวลาในการอบรม
- 6 ชั่วโมง
ราคาคอร์สอบรม
- ราคาปกติ 3,500 บาท / คน
- โปรโมชั่นลด 10% เหลือ 3,150 บาท / คน
- ราคาเหมาจ่าย (ผู้อบรมตั้งแต่ 10 คน) ตามแต่ตกลงกัน
- ขอใบเสนอราคา
วิทยากรผู้สอน
คอร์สที่ควรอบรมก่อนหน้า
คอร์สต่อเนื่องที่แนะนำ
เนื้อหาการอบรม
แนวทางการออกแบบเว็บและการใช้โปรแกรม Figma
- แนวทางการออกแบบเว็บสมัยใหม่
- รู้จักการออกแบบ wireframe ก่อนเริ่มออกแบบจริง
- แนะนำโปรแกรม Figma สำหรับการออกแบบเว็บ
- เครื่องมือพื้นฐานที่ทุกคนควรรู้จักใน Figma
- เรียนรู้การจัดวาง layout แบบต่างๆ ใน Figma
- การสร้างชุดเมนู เส้นโค้ง จัดกลุ่มวัตถุ และการทำ masking เพื่อรวมรูปต่างๆ
- การทำ Prototype เชื่อมโยงหน้าเว็บเพจใน Figma
- การใส่ 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 JavaScript
JavaScript นับว่าเป็นภาษาที่เข้ามาช่วยเติมลูกเล่นและเทคนิคต่าง ๆ บนเว็บไซต์ของเรา การใช้งาน javascript นั้นทำให้ซอฟแวร์ บน Web base นั้นมีความใกล้เคียงกับ A...
การตกแต่งภาพด้วยโปรแกรม Adobe Photoshop
โปรแกรม Adobe Photoshop เป็นโปรแกรมที่ใช้สำหรับสร้างงานทางด้านกราฟิกที่บุคลากรในหลายสาขาอาชีพให้ความสนใจและนิยมใช้กันอย่างแพร่หลายในปัจจุบัน เนื่องจากโปรแกรม Adobe Photosh...
อัพเดทข้อมูลเมื่อ
06/11/2024 12:00:08
