Wordpress Theme Baby to Ninja
Chapter 1 - หลักการออกแบบ |
|
เตรียมเครื่องมือ ตัวอย่างPhotoshop Baby to Ninja เครื่องมือที่เราจะใช้คือ ตามชื่อเลย Photoshop CC 2014 ซึ่งเป็นเวอร์ชั่นล่าสุดตัวนี้จะเป็นโปรแกรมในรูปแบบของ Creative Cloud ซึ่งมีค่าบริการรายเดือน ๆ 300 บาท มาพร้อมกับ Adobe Light Room 300 บาท จะได้ทั้ง 2 โปรแกรมนี้ ใช้งานแบบถูกลิขสิทธิ์ สำหรับ Photoshop ผู้เรียนคงรู้แล้วเพรา... |
5:53 |
สอนใช้งาน brackets.io ตัวอย่างสอนใช้งาน brackets.io ตัวนี้จะเป็น code editor หรือที่เรามักจะเรียกกันว่า text editor นั้นเอง ก่อนอื่นเลยสร้าง folder project ไว้ชื่อ html จะสร้างที่ีไหนก็ได้ จากนั้นก็ทำการเปิด brackets ขึ้นมา จากนั้นผมจะลาก Folder html เข้ามายัง ซ้ายของ panels brackets จะติดตั้ง plug-in ก่อนอื่นจะ New flie index.h... |
11:00 |
สอนใช้ photoshop cc 2014 เบื้องต้น ตัวอย่างหลังจากที่เราได้ทดลองใช้งานตัว brackets.io แล้วใน VDO นี้ เราจะมาทำการเรียนรู้ สอนใช้ photoshop cc 2014 เบื้องต้น เปิดโปรแกรมขึ้นมาเลย เดี๋ยวผมจะอธิบายเมนูและการใช้งานอย่างคร่าวๆใน VDO นี้ คำสั่ง File จะเป็นส่วนของ จัดการเอกสารต่างๆที่อยู่ project นี้ แล้วจะมีส่วนของการ Save for Web การ Extract Ass... |
14:28 |
หลักการออกแบบหัวข้อนี้ผมจะพูดถึงการออกแบบนะครับ หลักการออกแบบไม่ได้เฉพาะเจาะจงเรื่องสวยงามเพียงอย่างเดียวนะครับ สิ่งที่ตอบโจทย์ของการออกแบบก็คือ เรื่องของความต้องการของผู้ใช้ การออกของเรามันตอบโจทย์เรื่องของการต้องการของผู้ใช้รึป่าว ถ้าเห็นในรูปตัวอย่างที่ผมยกมาตอนนี้ก็คือรูปของ iPhone ถ้าคนที่เคยใช้ iPhone ตั้ง... |
9:37 |
หลักการเลือกใช้สีหลักการเลือกใช้สี สีที่เราเลือกใช้กัน ไม่ใช่ว่าเราเลือก สีแดง สีเขียว เราชอบสีไหนเลือกใช้เลย มันมีหลักการในการเลืืกอยู่ สมมุติว่าเราชอบสีแดง เราก็มาที่โทนสีแดง เราก็มาเลือกหลักการว่าเราจะใช้หลักการอะไรในการตัดสินใจเลืิอก หลักกการหลัก ๆ มี 6 รูปแบบ โดยที่เราจะใช้บ่อย ๆ นะมี 4 รูปแบบ มีสีที่คล้ายกั... |
9:44 |
แนะนำเรื่องโครงร่าง หรือ WireframingWire framing หลังจากที่เราได้รู้จักกับทฤษฎีและหลักกการในการออกแบบ การใช้สี การรูปภาพ ตัวอักษร ช่องว่างหรือ white Space ทำไมเราต้องมีเรื่องของการออกแบบเว็บไซต์ การที่เราจะออกแบบเว็บไซต์ต้องมีแบบร่างขึ้นมาก่อน เพื่อเป็นต้นแบบหรือแนวทาง ต่อไปในส่วนของการทำ box up หรือ prototype ในเรื่องของ box up หรือ... |
2:38 |
หลักการเลือกใช้รูปภาพประกอบในหัวข้อนี้จะเป็นการเลือกใช้ภาพในงานออกแบบ การเลือกใช้ภาพในงานออกแบบก็เป็นเรื่องสำคัญ เพราะว่าเวลามีคนเข้ามาดูผลงานของเรา ประเภทเว็บไซต์หรือ portfolio ดึงดูดให้คนเข้ามาดูงานของเราได้ด้วย 3-5 วิแรก การสร้าง first impression ให้กับ User ที่เข้ามาชมเว็บไซต์เรา ตัวแรก Monochromatic Style เป็นภาพของสีโทน... |
5:03 |
Chapter 2 - การออกแบบโครงร่างเว็บไซต์ |
|
ออกแบบโครงร่าง serviceการออกแบบโครงร่างหน้า Service |
4:50 |
ออกแบบโครงร่าง portfolioออกแบบโครงร่างหน้า Portfolio |
3:50 |
ออกแบบโครงร่าง archiveออกแบบหน้า Archive |
6:53 |
ออกแบบโครงร่าง contactออกแบบโครงร่างหน้า Contact |
3:28 |
ออกแบบโครงร่าง searchออกแบบโครงร่างหน้า Search |
3:02 |
ออกแบบโครงร่าง 404ออกแบบโครงร่างหน้า 404 |
5:16 |
ออกแบบโครงร่าง indexออกแบบโครงร่าง index |
41:06 |
ออกแบบโครงร่าง aboutออกแบบโครงร่าง about |
39:7 |
Chapter 3 - การออกแบบเว็บไซต์จริง |
|
ออกแบบ Contact Pageออกแบบ Contact Page |
12:37 |
ออกแบบ Service Pageการออกแบบ Service Page |
7:17 |
ออกแบบ Portfolio Pageการออกแบบ Portfolio Page |
6:49 |
ออกแบบ Archive Pageการออกแบบ Archive Page |
17:49 |
ออกแบบ Search Pageการออกแบบ Search Page |
5:06 |
ออกแบบ About USการออกแบบ About US |
7:55 |
Chapter 4 - พื้นฐานการเขียนเว็บไซต์ |
|
พื้นฐาน jQuery Travelsing and Filteringพื้นฐาน jQuery Travelsing and Filtering |
27:11 |
พื้นฐาน jQuery Expanding on()พื้นฐาน jQuery Expanding on() |
9:38 |
พื้นฐาน jQuery KeyBoard Eventsพื้นฐาน jQuery KeyBoard Events |
14:49 |
พื้นฐาน jQuery Link layoverพื้นฐาน jQuery Link layover |
7:04 |
พื้นฐาน jQuery Taming CSSพื้นฐาน jQuery Taming CSS |
9:34 |
พื้นฐาน Jquery Animationพื้นฐาน Jquery Animation |
10:58 |
แนะนำ Bootstrap 3แนะนำ Bootstrap 3 |
5:28 |
Chapter 5 - การแปลงไฟล์ PSD เป็น HTML |
|
แปลงไฟล์ Portfolioแปลงไฟล์ Portfolio |
10:33 |
แปลงไฟล์ Serviceแปลงไฟล์ Service |
4:46 |
แปลงไฟล์ Archive ตอนที่ 1 ส่วน Blog Listแปลงไฟล์ Archive ตอนที่ 1 ส่วน Blog List |
29:44 |
แปลงไฟล์ Archieve ตอนที่ 2 ส่วน Side barแปลงไฟล์ Archieve ตอนที่ 2 ส่วน Side bar |
22:03 |
แปลงไฟล์ Searchแปลงไฟล์ Search |
10:43 |
แปลงไฟล์ 404 pageแปลงไฟล์ 404 page |
21:47 |
Chapter 1 - พื้นฐานการสร้าง WordPress Theme |
|
Chapter 2 - WordPress Theme Workshop |
|
ในหัวข้อนี้ผมจะมาเสนอหลักสูตรสอนเขียน WordPress Theme ในขั้น Advanced ครับ แต่อย่าพึ่งตกใจไปครับ ถึงผมจะบอกว่า Advanced ผมไม่ปล่อยให้ผู้เรียนเผชิญชะตากรรมในขณะเรียนแน่นอนครับ ในคอร์สนี้ผมได้รวบรวมองค์ความรู้ที่จำเป็นทั้งหมดมาให้ผู้เรียนแล้วครับ ไม่ว่าจะเป็นเรื่องของการออกแบบโดยจะสอนตั้งแต่เรื่องของหลักการการออกแบบ ทฤษฎีของสี การจัดการเรื่อง White Space และรวมไปถึงการออกแบบเทมเพลตเว็บไซต์ด้วยโปรแกรม Photoshop CC 2014 และ 2015 ซึ่งเป็นเวอร์ชั่นล่าสุดในขณะนี้ หลังจากที่เราออกแบบเสร็จเรียบร้อย ผมก็จะพาผู้เรียนไปทำความรู้จักการเขียนเว็บไซต์ขั้นพื้นฐาน โดยที่ผมจะปูพื้นความรู้ให้ทั้งหมดไม่ว่าจะเป็น Html, CSS, CSS3, JavaScript, Jquery และ Bootstrap 3 ที่จำเป็นต้องใช้ในการแปลงไฟล์จาก PSD เป็น HTML Template เพื่อใช้ในการแปลงเป็น WordPress Theme ต่อไปครับ ในบทสุดท้ายจะเป็นเรื่องของ WordPress Theme เพียวๆเลยครับ แต่ผมจะแบ่งออกเป็น 2 ส่วนเพื่อให้ผู้เรียนสามารถกลับมาทบทวนได้ง่ายๆครับในส่วนแรกผมจะแบ่งออกเป็นพื้นฐานของ WordPress Theme ครับโดยที่ผมได้แบ่งออกเป็นหัวข้อย่อยๆไว้แล้ว และหลังจากที่จบพื้นฐานแล้วเราจะนำความรู้ทั้งหมดมาใช้เพื่อประยุกต์เป็น WordPress Theme ครับส่วนเรื่องเด่นๆ ที่ผมนำมาใส่ไว้ในคอร์สของ WordPress Theme นั้นก็จะมีพวกการ Hooks ครับและการทำให้ Theme ของเรา Support กับปลักอิน Ecommerce ยอดนิยมอย่าง WooCommerce แค่นี้ยังไม่พอครับ ผมยังได้สอนถึงการ Hooks และ Overrides เจ้าตัว WooCommerce อีกด้วย
คอร์สเรียนที่น่าสนใจในหมวดหมู่ Web Design
เขียน Responsive Website ด้วย Bootstrap 3
Bootstrap 3 เป็น front end framework ในการออกแบบหน้าเว็บ คอร์สนี้จะทำให้ผู้เรียนเข้าใจภาพรวมของ fram...
สร้างเว็บไซต์ด้วย DREAMWEAVER CC สไตล์ BOOTSTRAP3
สร้างเว็บไซต์ด้วย DREAMWEAVER CC สไตล์ BOOTSTRAP3
สร้างคอร์สเรียนของคุณ
เรามี 45 คอร์สเรียน เพิ่มคอร์สเรียนของคุณเพิ่อรับรายได้แบบไม่จำกัด และเผยแพร่องค์ความรู้ของคุณกับคอร์สการเรียนรู้ออนไลน์ที่ทุกๆ คนสามารถเข้าถึงได้ทุกที่ทุกเวลา
สร้างคอร์สเรียน สังคมนักพัฒนาซอฟต์แวร์
117 M.9 Nongmueng Subdistrict, Muangsamsib District, Ubonratchathani Province 34140