การพฒั นาสภาพแวดลอ้ มการเรียนรู้ดจิ ิทัลดว้ ยเทคโนโลยีความจริงเสริมแบบปฏสิ มั พันธ์เพอ่ื สง่ เสริม ทักษะการใช้โปรแกรมอะโดบีอิลลสั เตรเตอร์สาหรบั ประกาศนียบตั รชน้ั ปที ี่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 คานา โครงการการโปรแกรม Adobe illustrator CS6 น้ีได้จัดทาข้ึนเพ่ือให้มีทักษะในการคิดการตกแต่งโปรแกรมAdobeillustrator CS6 เพื่อใช้ในงานการเรียนการสอนในรายวิชาที่เก่ียวข้องกับสาขาวิชาคอมพิวเตอร์ธุรกิจ และอยากให้นักศึกษารุ่นต่อไปนาแนวคิดการ สรา้ งโปรแกรม Adobe illustrator CS6 ใหม่ๆ เพื่อพฒั นาและมีประโยชนเ์ พมิ่ ข้ึน เพราะทกุ วันน้กี ารสร้างโปรแกรม Adobe illustrator CS6 ได้ เข้ามามีบทบาทใชีวติ ประจาวัน ของเรามากขึ้น และโครงการน้ียังสามารถนาไปพัฒนาและประยุกต์ใช้ในชีวิตประจาวันได้เป็นอย่างดีในโอกาสต่างๆ ขอขอบคุณอาจารย์ ทุกท่านที่ช่วยให้คาแนะนาให้คาปรึกษามาโดยตลอดจนโครงการนี้ประสบความสาเร็จลุล่วงด้วยดีถ้ามีความบกพร่องประการใดคณะ ผู้จดั ทาขออภยั ไว้ ณ ทีน่ ดี้ ้วย คณะผ้จู ัดทา
D สารบัญ หน้า โปรแกรม Adobe Illustrator…………………………………………………………………………………….....…. 2 เครื่องมือหลกั ๆ ของ Illustrator…………………………………………………………………..………………….. 4 หลักการทางานของ Layer………………………………………………………………………………………….…...... 10 การปรบั เปลีย่ นรปู รา่ ง Transform Object……………………………………………………………………..... 16 การกาหนด Artboards Layout……………………………………………………………………………………….. 24 การสรา้ ง Swatch Color and Global Swatch Color…………………………………………….……… 28 การสร้างตวั หนังสอื ............................................................................................................................. 34 การสร้างตวั อักษร 3 มติ ิ.................................................................................................................... 38 การ Save ชนิ้ งาน............................................................................................................................... 46 ตัวอย่างตา่ งๆ....................................................................................................................................... 57
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 ที่ถูกนามาใส่ จะเป็น Sub Layer ของ 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