การพฒั นาสภาพแวดล้อมการเรยี นร้ดู ิจิทัลดว้ ยเทคโนโลยคี วามจริงเสริมแบบปฏิสัมพันธเ์ พื่อ ส่งเสรมิ ทกั ษะการใชโ้ ปรแกรมอะโดบีอิลลัสเตรเตอร์สาหรับประกาศนียบัตรช้ันปีที่2 The development of digital learning envrironments with augmented reality interaction technology to promate the using skills of Adobe illustrator for diploma 2 year
ค่มู ือการใช้งานหนังสอื B
C คานา โครงการการโปรแกรม Adobeillustrator CS6น้ีได้จัดทาข้ึนเพ่ือให้มีทักษะในการคิดการตกแต่งโปรแกรม Adobeillustrator CS6 เพอื่ ใชใ้ นงานการเรียนการสอนในรายวชิ าทีเ่ กยี่ วขอ้ งกับสาขาวิชาคอมพิวเตอร์ธุรกิจและอยาก ใหน้ ักศกึ ษารุน่ ต่อไปนาแนวคิดการสรา้ งโปรแกรม Adobe illustrator CS6 ใหมๆ่ เพ่อื พฒั นาและมปี ระโยชนเ์ พิ่มขน้ึ เพราะทุกวันนก้ี ารสร้างโปรแกรม Adobe illustrator CS6 ไดเ้ ข้ามามีบทบาท ใชีวิตประจาวันของเรามากข้ึน และโครงการนี้ยังสามารถนาไปพัฒนาและประยุกต์ใช้ในชีวิตประจาวันได้เป็นอย่างดีใน โอกาสต่างๆ ขอขอบคุณอาจารย์ทุกท่านท่ีช่วยให้คาแนะนาให้คาปรึกษามาโดยตลอดจนโครงการน้ีประสบความสาเร็จ ลลุ ว่ งดว้ ยดถี า้ มีความบกพรอ่ งประการใดคณะผู้จัดทาขออภยั ไว้ ณ ทน่ี ดี้ ้วย คณะผ้จู ดั ทา
D สารบญั หนา้ เโคปรรอ่ืแงกมรือมโหปAลรdแักกoๆรbมขeอAIงdllIoullbsutesratIlrtlauotsrot…rra……t……or………………………………………………………………………………ส………า…ร………บ………ญั …………………………………………………………………………………….….……………………………………………....….....…….….....ห422นา้ หลกั การทเคารง่อื างนมขอื อหงลักLๆayขeอrง…Il…lu…st…ra…t…or…………………………………………………………………………………………………………………………………..…………………………….…...…... 140 การปรับเหปลลักยี่ กนารรทูปารง่าางนTขอraงnLsafyoerrm……O…b…je…c…t…………………………………………………………………………………………………………………………………………….….…....….... 1160 การกาหนกดารปAรrtับbเปoลaยี่ rนdรsูปLรa่างyoTurat…ns…fo…rm……O…b…je…ct………………………………………………………………………………………………………………………….…. . 2146 การสร้างกาSรwกaาtหcนhดCAortlbooraarndds LGalyoobuat…l S…w…a…t…c…h…C…o…lo…r……………………………………………………………………………………….…..….…….…. .2284 การสร้างกตาัวรหสรนา้ ังงสSอื w...a..t.c..h...C...o..l.o..r...a..n..d....G..l.o..b...a..l..S..w...a..t.c..h....C..o..l.o..r..…..…...…...…..…...…...…..…...…...…..…...…..…...…...…..…...…....…..…...…...… 2384 การสร้างกตาวั รอสกัรา้ษงรตวั 3หมนติังสิ..ือ........................................................................................................................................................................................................................................ 3348 การ Savกeารชส้ินรง้าางนตวั..อ..กั..ษ...ร...3...ม..ิต..ิ........................................................................................................................................................................................................................ 4386 ตวั อยา่ งตกตา่าวั งรอๆยS.่าa..งv.ต.e.่า..ง.ช.ๆ.้ิน....ง....า....น...................................................................................................................................................................................................................................................................................................................................................................... 455677
How to use Adobe Illustrator
2 โปรแกรม Adobe Illustrator Adobe Illustrator เป็นซอฟต์แวรส์ าหรบั สร้างภาพกราฟิกในรูปแบบ Vector โดยมีคุณลักษณะท่สี าคัญท่สี ุด นั่นก็คอื คุณภาพของผลงาน ที่สรา้ งข้นึ นั้น จะไม่มปี ญั หาเรื่องความละเอยี ดในการแสดงภาพตามสื่อต่างๆ ไมว่ า่ จะนาไปขยาย หรอื ลดแค่ไหนก็ตาม ภาพจะไม่ต้องเสยี ความละเอยี ด หรือความคมชดั แม้แตน่ อ้ ย เมื่อเปรยี บเทียบกับภาพท่ีแกไ้ ขโดยใชเ้ คร่อื งมอื อน่ื ๆ เช่น Adobe Photoshop ท่จี ะมีปัญหาเรือ่ ง ความละเอียด และคุณภาพของภาพจะลดลงเมือ่ ขยายภาพ
4 เคร่อื งมือหลกั ๆ ของ Illustrator Selection tool เคร่ืองมกี ลุ่มนว้ี า่ ดว้ ยเรือ่ งการเลือกวตั ถุ ประกอบไปดว้ ย Selection tool ( ลูกศรสีดา ) ใชเ้ ลือกวตั ถทุ งั้ ชิน้ Direct-selection tool ( ลกู ศรขาว ) ใชเ้ ลือก points หรือ path ของวัตถ(ุ กดคีย์ Alt ) Magic wand tool ( ไมเ้ ท้าวิเศษ ) เป็นเคร่ืองมอื ใหม่ ใหเ้ ลอื กวัตถุที่มีสีเดียวกัน การใชง้ านเหมอื นใน Photoshop ( กดคีย์ Alt และ Shift ) Lasso tool ใชแ้ ลอื กโดยการคลกิ เมาส์ Drag การใชง้ านเหมือนใน Photoshop ( กดคยี ์ Alt และ Shift )
6 Create tool เครอ่ื งมือกลมุ่ นวี้ ่าดว้ ยการสร้าง objects ไม่วา่ จะเป็นเสน้ ต่างๆ และตัวหนงั สือ Pen Tool สรา้ งเสน้ parth อย่างแมน่ ยา โดยการใช้แขน มผี ลทาให้ object มีจุดนอ้ ย-นอ้ ยมาก สว่ นมาก ส่วนเครอ่ื งมอื ย่อยจะเอาไว้ใชป้ รับแต่ง curved ไมว่ า่ จะเป็นการเพิ่มจุด ลบจดุ หักแขนของแกนเส้นสมั ผัส ( กดคีย์ Alt ) Type tool ใช้พิมพ์ตัวหนงั สือ ข้อความต่างๆ สว่ นเครอื่ งมือย่อย ก็ง่ายๆ ตามรปู ใช้พิมพ์ตวั หนงั สือใหอ้ ยใู่ นกรอบบา้ ง ทาตัวอักษรว่ิงตาม paths บา้ ง ซ่ึงผมจะไม่อธิบายมากเพราะ ไอคอนกง็ า่ ยต่อการจดจาอยู่แลว้ Line segment tool อนั น้ไี ว้ลากเส้นตรง ในรายละเอียดของเครอื่ งมอื ยอ่ ยกไ็ มม่ อี ะไรมาก เชน่ ไว้ทาขดกน้ หอยทา grid ของตารางหมากรุก grid แบบใยแมงมมุ
8 Basic shape tool เอาไวว้ าดรูปทรงพื้นฐาน 3-4 หลายเหลย่ี ม และ วงกลม shapc รปู ดาวแตท่ ่เี ด่นทส่ี ดุ คือ flarc tool ใชส้ รา้ งเอฟเฟค lcns flare ( กดคยี ์ Alt หรอื Shift และ Alt+Shift ) Panitbrush tool แปรงท่ีเอาไว้สรา้ งเส้น parth โดยการ drag เมาส์ลาก อย่างอิสสระ สามารถใช้ prush แบบพิเศษ ( กดคยี ์ Alt ) Pencil tool จะคล้ายๆ paintbrush tool แต่มีเคร่อื งมือยอ่ ยให้เรียกใช้ ในการแก้ไขเส้น ซึง่ จะชว่ ยในการปรบั แตง่ แกไ้ ขและทาให้งานดูดี+เร็วขนึ้ ( กดคยี ์ Alt )
10 หลกั การทางานของ Layer ลเยอร์ (Layer) หมายถึง ชน้ั โดยในการจัดภาพท่เี รียงทบั ซ้อนกนั การทางานของเลเยอร์มีลักษระคล้ายกับการนาแผ่นภาพมาทับซ้อนกันเป็นช้ัน ๆโดยแผน่ ภาพแตล่ ะแผน่ เปรยี บเสมอื นเลเยอร์แต่ละเลเยอร์ ซึ่งเราสามารถทาการซ่อน แสดงผลได้ Layer panel มีหลายส่วนคล้ายกบั Layer ของโปรแกรม Photoshop เชน่ คลกิ Create New Layer เพ่อื สรา้ ง Layerใหมห่ รือคลิกท่ีชือ่ Layer เพื่อ แก้ไขช่ือแต่มีจุดท่ีไม่เหมือนคือในส่วนของ Click to Target คือปุ่มท่ีอยู่ด้านท้ายของแต่ละ Layer เม่ือคลิกแล้วจะรู้ว่า Object ใดอยู่ตรงใหน เพราะจะมี Bounding Box แสดงขนึ้ มาที่ Object นนั้
12 การปรับขนาด Layer Thumbnail ทาโดยคลกิ ท่ลี ูกศรบนแถบ Layer Panel เลอื ก Panel Option ปรบั แตง่ ในสว่ นของ Row Size และอ่ืนๆ ตามตอ้ งการ การยา้ ยตาแหนง่ Layer ใหค้ ลกิ บนพืน้ ทีว่ า่ งของ Layer คา้ งแลว้ ลากไปไวท้ ่ตี าแหน่งต้องการ การเปลยี่ น Layer เม่ือมีการสรา้ ง Layer เปล่า ข้ึนมา แล้วต้องการยา้ ย Layer ท่มี ีอยูเ่ ดมิ มาไวเ้ พ่ือแยกเปน็ รายการเฉพาะ ทาได้โดยการคลิกคา้ งตา แแหนง่ วา่ งถดั จาปุม่ Click to Target จะมกี รอบสี สเ่ี หล่ยื มเล็กแสดงให้เห็น จากนั้นคลกิ ทก่ี รอบสนี ี้ แลว้ ลากมาไวท้ ่ี Layer ทีส่ รา้ งข้นึ ถ้าเลเยอร์น้นั มีการใสส่ ไี ว้ เม่อื ยา้ ย Layer มาแล้วจะเปลยี่ นสใี ห้ตาม Layer ที่สร้างไว้ Layer ท่ีถูกนามาใส่จะเป็นSubLayer ของ Layer ทสี่ ร้าง
14 การใสส่ ี และกาหนดค่าต่างๆ ใหก้ ับ Layer ทาไดโ้ ดยดบั เบ้ิลคลกิ บนทีว่ ่างของ Layer จะมีหน้าตา่ ง Layer Option แสดงขึ้นมา สามารถเปลย่ี น ชื่อ สี และอนื่ ๆ ได้จากทนี่ ่ี การล็อค และ การลบ Layer ให้คลกิ ช่องทีอ่ ยถู่ ัดจากไอคอนรปู ดวงตาบน Layer จะเปน็ การล็อค และปลดลอ็ คก็เพียงคลิกท่ีเดิมซา้ อีกครั้งสามารถล็อค Sub Layer ได้ โดยไมต่ ้องลอ็ ค Layer ใหญ่ หรือถ้าจะล็อคทงั้ หมดกล็ ็อคท่ี Layer ใหญ่ สว่ นการลบ Layer กเ็ พียงคลิกท่ี Layer น้นั แล้วมาคลกิ ที่ไอคอนถงั
16 การปรับเปลย่ี นรูปรา่ ง Transform Object ใช้ Selection Tool คลิกที่ Object น้นั จะทาใหส้ ามารถปรับเปล่ียนได้โดยการลากปรับขนาดของ Bounding Box ทค่ี ลุม Object โดยให้ สังเกตุเมา้ ส์จะเปลย่ี นเป็นหัวลกู ศรสองฝัง่ ถงึ จะทาการลากเปล่ียนขนาดได้ หรอื ทา Rotating ได้ หรอื จะคลกิ ไอคอนเคร่อื งหมายลูกศรโค้ง นั่นคือ เครง่ื อมือ Rotate Tool ( R ) มาทาการ Rotate โดยตรงก็ไดเ้ ชน่ กัน สว่ นถ้าใชเ้ ครื่องมอื ทีต่ ิดกับ Rotate Tool นน่ั คอื Scale Tool ( S ) เม่ือคลิก ที่ Object จะไม่เหน็ Bounding Box แตส่ ามารถคลกิ และปรับขนาดไดเ้ ลย
18 การบิดเบือนรูปร่าง Distort Object ( Width and Wrap Tool ( W ) ) มวี ธิ กี ารบิดเบอื นรปู รา่ งอย่หู ลายแบบด้วยกนั ทรี่ วมอยใู่ นเคร่อื งมอื กลุม่ นี้ เช่น Width Tool, Wrap Tool, Twirl Tool, และ อืน่ ๆ ซง่ึ อยุ่ในเคร่ืองมอื การทา Distort Object ก่อนการใช้เครอ่ื งมอื เหลา่ นี้ จะต้องคลิกท่ี Object นั้นโดยใช้ Selection Tool ก่อน จากน้นั ส่วนมากจะทาโดยการคลิกคา้ ง หรอื ลากผ่าน Object เพือ่ ใหเ้ กิดการ Distort กอ่ นทาควรเปิด Properties ของเคร่ืองมอื เพ่อื กาหนดคา่ ตาม ตอ้ งการ เช่นการปรบั ขนาดแปรง อัตราการกระทา และอ่นื ๆ
20 การทา Repeating Transforming ถ้าตอ้ งการใช้คาสั่งเพอ่ื ใหเ้ กดิ ผลเหมือนกับการกระทาคาส่ังกอ่ นหนา้ หลงั จากทไี่ ด้ทาคาสัง่ นัน้ แลว้ เช่น การ Copy สามารถใช้ คาสัง่ Ctrl + D เพ่ือใหเ้ กิดการ Copy ซ้าได้ การทา Reflection and Skewing Object ใช้ Selection Tool คลิกท่ี Object นัน้ แล้วใช้เครือ่ งมือ Reflect ซงึ่ อยูร่ วมกบั Rotate Tool จากนน้ั ให้กดปุ่ม Alt กอ่ นทจี่ ะคลิก เมอื่ คลิกแล้วจะมีหนา้ ต่าง Reflect แสดงขน้ึ มาเพอ่ื ทาการต้งั คา่ โดยสามารถเลอื กการ Reflect แบบ Vertical หรอื Horizental ได้ รวมทงั้ สามารถ กาหนดองศาไดด้ ้วย ถา้ ตอ้ งการเห็นการเกดิ ส่วนที่ Reflect ใหค้ ลกิ เลือกที่ Preview ถ้าตอ้ งการทา Reflect Object แบบสรา้ งเพ่มิ ใหก้ ดท่แี ถบ Copy จากนั้นกด OK
22 สว่ นการ Skew ทาไดจ้ าก Tranform Panel ในสว่ นของ Shear หรือจะทาจากเครอื งมือ Shear Tool ซ่งึ อยรู่ วมกบั Scale Tool ทาการ คลกิ แลว้ ลากใหเ้ กดิ การ Shear การทา Align and Distribution bjects ให้ใชเ้ มนู Window - Align เพื่อเป็นการเปิด Align Panle ส่วนการทานนั้ ต้องเลอื ก Object ท่ีจะทาการ Align กอ่ น แลว้ เลอื กรปู แบบการ Align ซง่ึ จะเกดิ การ Align กับ Artboard หรือจะใช้เครอ่ื งมอื บนแถบเมนขู อง Selection tool ก็ได้เช่นกัน
24 การกาหนด Artboards Layout ใชส้ าหรับกาหนด Layout ใหก้ ับการสรา้ ง Artboards หลายช้นิ ในหนึ่งชน้ิ งาน การสรา้ งนีจ้ ะทาขณะท่สี ร้างงานใหม่ แลว้ เลอื ก ไอคอนตา่ งๆ ซง่ึ มี 5 แบบดว้ ยกัน เม่อื เลอื กรปู แบบ Layout ไดแ้ ล้ว ใหก้ าหนดความกวา้ งระหวา่ Artboards ไดจ้ าก Spacing คาศัพทค์ วรรู้ Artboard = ชนิ้ งานเปล่าตอนที่เปิดขี้นมา Artwork = สว่ นตา่ งๆ ทรี่ วมกนั อยบู่ น Artboard เช่น Object, Path Attribute = ได้แก่ ส่วนของ Fill, Stroke, Effect ต่างๆ
26 การ Edit Artboard ทาได้โดยการใชเ้ มนู File - Document Setup - Edit Artboard การใชค้ าสัง่ นจ้ี ะให้ Artboard ที่มอี ยู่ มีผลกบั Artborad Tool รวมท้งั ถา้ มกี ารเพิ่มArtborad ใหม่ก็จะมผี ลกบั เครือ่ งมอี Artborad Tool เชน่ กัน สามารถปรับเลือ่ นตาแหนง่ Artborad ได้ใน Artborad Panel การปรบั ขนาด Artboards ถ้าต้องการเปลีย่ นขนาด Artboards ให้คลิกเลอื กเคร่ืองมือ Artboard Tool (Shift + O) แลว้ ทาการคลิก Artboard ท่ตี อง้ การ ปรบั เปลย่ี นขนาด จากนัน้ ลากปรบั ขนาดไดต้ ามตอ้ งการ ถ้าตอ้ งการขนาดท่ีแนน่ อน ใหพ้ มิ พต์ ัวเลขทแี่ ถบด้านบน ในสว่ นของ W and H และยงั สามารถคลกิ เลอื ก Artboard เพ่ือเล่อื นตาแหนง่ ได้อกี ดว้ ย Selection Tools ( V ) เป็นเครอื่ งมอื ทใ่ี ช้สาหรับการเลอื กทง้ั หมด เชน่ Object, Path ตา่ งๆ เป็นตน้
28 การสรา้ ง Swatch Color and Global Swatch Color การสร้าง Swatch Color and Global Swatch Color มวี ธิ ีการทาไดส้ องแบบ โดยการคลิกที่ Object แลว้ มาคลิกไอคอน New Swatch บน Swatch Panel จะไดห้ น้าตา่ ง New Swatch ขน้ึ มา จากนน้ั ทาการตั้งช่ือ หรือ คลิกสีบนแถบเครือ่ งมือแล้วลากไปที่ Swatch Panel ก็จะไดส้ นี ั้นเกบ็ ไว้ท่ี Swatch Panel ถา้ ดบั เบ้ิลคลิกทีส่ นี น้ั ก็จะมหี นา้ ตา่ ง Swatch Option จากน้ันใหต้ ้ังชอ่ื Color ถ้าต้องการสร้างสีนใ้ี ห้เปน็ แบบ Global ก็ใหค้ ลิกเลือก ที่ช่อง Global การเลอื กเปน็ แบบ Global จะทาใหก้ รอบสนี ้ันมสี ญั ญลกั ษณส์ ามเหลย่ี มท่มี มุ ลา่ งขวาใหเ้ หน็ ดว้ ย เพราะเม่อื เปลย่ี นสีที่ ใชร้ ว่ มกันใน Object ทเ่ี ป็น Global Color กจ็ ะมีการอัพเดทเปล่ียนสใี หห้ มดทุก Object ทไี่ ดใ้ ช้ Global Swath Color
30 การลบสีจาก Swatch Panel กเ็ พียงแต่คลิกทีส่ ีน้นั แลว้ มาคลกิ ท่รี ปู ถัง จะมหี น้าตา่ งยืนยันการลบสีนนั้ ให้กดเลอื ก Yes การสร้าง Color Group ใหท้ าการเลือกสีบน Swatch Panel แล้วคลิกทีไ่ อคอน New Color Group จากนนั้ ทาการตงั้ ชอื่ การกาหนด Swatch Option ทาไดโ้ ดยคลกิ สบี น Swatch Panel แล้วมาคลกิ ทไ่ี อคอน Swatch Options จากนั้นทาการปรบั ตงั้ คา่ สีตา่ ง การสรา้ ง Spot Color เหมอื นการสร้าง Swath Color แตเ่ ลอื กเปน็ Spot Color ในแถบของ Color Type (ประกอบดว้ ย Process Color and Spot Color) จะมีสัญญลักษณท์ ต่ี าแหนง่ เดียวกับการสร้าง Global Color
32 การใช้ Swatch Libraries Menu ไอคอนของ Libraries จะอย่ทู ่มี ุมซา้ ยล่างของ Swath Panel ถ้าตอ้ การ Importing Swatch ให้คลกิ เลอื กท่ี Other Library แล้วเลอื กไฟลส์ ี ทบ่ี ันทึกเก็บไว้ทีค่ อมพวิ เตอร์ จะไดห้ น้าตา่ งสีขน้ึ มาท่โี ปรแกรมอกี หนงึ่ อนั ใหด้ ับเบล้ิ ทโี่ ฟลเดอร์สีที่ตอ้ งการกจ็ ะไปสร้างไวท้ ่ี Ai Swath Color แตถ่ า้ มีการเปดิ ชนิ้ งานใหม่จะตอ้ งทาการ Import ใหม่ โดยใชเ้ มนู Window - Swatch Libraries - Other Libraries เชน่ เดิม ถ้าตอ้ งการสง่ โฟลเดอร์ สีมาเก็บไวใ้ ชท้ ี่โปรแกรม ใหท้ าการคลกิ ลกู ศรบนแถบ Swath - Save Swatch Library as ASE or as AI
34 การสรา้ งตัวหนงั สอื การสร้างตวั หนงั สือ ตัวหนงั สอื ของโปรแกรม Illustrator จะเป็นตวั หนงั สือท่สี ร้างบนเสน้ Path ประกอบดว้ ย Point and Area text และวิธีการใช้งาน เหมอื นกับโปรแกรม Test in Photoshop การปรับขนาด และ Rotate เมือ่ พิมพต์ ัวหนงั สอื แลว้ สามารถปรับขนาดโดยการการใช้ Selection Tool คลกิ ท่ี Bounding box ลากปรับขนาดไดเ้ ลย การสรา้ ง Link Area Text เรม่ิ แรกใหส้ รา้ ง Area text ข้ึนมาหนง่ึ อันก่อน จากน้ันเมอ่ื พพิ ม์ข้อความใน Area แรกเตม็ แล้วจะเห็นเครอื งหมาย + ท่กี รอบด้านล่างขวา ใหเ้ ปล่ยี นเปน็ Selection Tool ก่อน แลว้ คลกิ ที่ Area Text แรก แล้วมาคลกิ ทีเ่ ครื่องหมาย + จะเห็นเครอ่ื งหมาย Area Text ทีเมา้ ส์ ก็ให้ ทาการลากแถบ Area Text เพิ่มใหม่ได้เลย
36 การยกเลิกการ Link Area Text ใหค้ ลกิ ท่เี ครอ่ื งหมายมมุ บนซา้ ยของ Area Text ท่ตี อ้ งการยกเลิกการ Link จะเหน็ เครือ่ งหมาย Unlink จากนนั้ ให้มาคลกิ ทีเ่ ครื่องหมาย การ Link ท่ีดา้ นลา่ งขวาของ Area Text ทเ่ี ป็นตวั ท่ี Link ไว้ การสรา้ ง Type on Path ใหเ้ ปลี่ยนเปน็ เครอ่ื งมอื นี้ หรือขณะอย่ทู เี่ ครื่องมอื Type ธรรมดา ให้กดปมุ่ Alt กไ็ ด้ หลังจากพิมพ์เสร็จแลว้ ให้เปลย่ี นเป็น Selection Tool กจ็ ะเห็นสัญญลกั ษณ์ Control Handle ที่ใช้ในการปรบั แต่ง การปรบั แตง่ หรือลากตัวหนงั สอื ใหค้ ลกิ ทก่ี ้านของ Handle
38 การสรา้ งตัวอักษร 3 มิติ การสรา้ งตัวอกั ษร 3D ข้นั ตอนการทา 1. เปดิ เอกสารขน้ึ มาใหม่ แล้วพมิ พต์ ัวอักษรตามต้องการพรอ้ มใสส่ ีตามใจชอบ
40 2. ไปท่เี มนู Effect > 3D > Extrude & Bevel
42 3. จะปรากฏหนา้ ต่างออกมา ใหป้ รบั ตั้งคา่ ดงั ภาพขา้ งล่างน้ี แล้วกด OK
Search
