29

รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

Embed Size (px)

DESCRIPTION

ARTD2304 การออกแบบตัวอักษรเพื่อการพิมพ์

Citation preview

Page 1: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak
Page 2: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

รายงาน รไอง การออกบบฟอนตลายมอเทย – องกฤษ ( CRU-Saowalak )

จากปรกรม FontCreator

รายวชา ARTD2304 การออกบบตวอกษรพไอการพมพ

กลมรยน 102

สนอ

ผชวยศาสตราจารย ประชด ทณบตร

จดท าดย

นางสาว สาวลกษณ สงหวงษา รหส 5411306599

สาขาวชาศลปกรรม ( ออกบบนทศศลป )

ภาครยนทไ 2 ปการศกษา 2556

มหาวทยาลยราชภฏจนทรกษม

Page 3: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ค าน า

รายงานลมนๅปนสวนหนไงของวชา ARTD2304 การออกบบตวอกษรพไอการพมพ ซไงขาพจาเดจดท าขๅนมา พไอรวบรวมวธการสรางฟอนตลายมอของตวอง ดวยปรกรม FontCreator ซไงมขๅนตอนการท าพรอมภาพประกอบอธบายอยางละอยด พไอ฿หผทไเดมาศกษารายงานลมนๅเดมความขา฿จ฿นการสรางฟอนต฿หเดมากทไสด ละสามารถน าเปตอยอด฿นการท าดวยตวองหรอผยพรความรนๅตอเปเด

หากผดพลาดประการ฿ด ขาพจาขออภยเว ณ ทไนๅ

ผจดท า

นางสาว สาวลกษณ สงหวงษา

Page 4: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

สารบญ

รไอง หนา

วตถประสงค 1

กระบวนการท างาน

- Goal ( ปาหมาย ) 2

- Tools ( ครไองมอหลก ) 2 - 4

Do Did Done

- Do : มขๅนตอนละหลกฐานสดง 5 - 11

- Did : ผลทไเดรบ 12 - 13

- ตารางรหสรปอกขระตามมาตรฐานยนคดประจ าตวอกษรภาษาเทย – องกฤษ 14 - 20

- Done : เดน าเปทดสอบ - สราง - ประยกต - ฿ชประยชน 21 - 24

อางอง 25

Page 5: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

วตถประสงค 1. พไอสรางสรรคฟอนต฿หมโดวยลายมอของตวองเด 2. พไอสรางทกษะ฿นการออกบบละดดปลงฟอนตลายมอ฿หสวยงามละปลก฿หม 3. มฟอนตหลากหลาย฿นตระกล CRU-FONT-FAMILY 4. พไอรวธการสรางฟอนตอยางละอยดละท าเดจรง 5. ฟอนตทไเดสามารถน าเปสการคาขายเด

Page 6: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

กระบวนการท างาน Goal ( ปาหมาย )

ปาหมายของรายงานฉบบนๅคอ ฟอนตลายมอ ภาษาเทย - องกฤษ

Tools ( ครไองมอหลก )

- ทมพลตทไปน Grid ส าหรบขยนฟอนต - ปากกาด า

Page 7: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

- คอมพวตอร - ครไองสกนนอร

Page 8: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

- ปรกรม FontCreator

- ปรกรม Adobe Photoshop

Page 9: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

Do Did Done Do : มขๅนตอนละหลกฐานสดง

ขๅนตอนการออกบบฟอนตลายมอ ทๅงภาษาเทย - องกฤษ จากปรกรม FontCreator ขๅนตอนทไ 1 ดาวนหลดทมพลตทไปน Grid ส าหรบขยนฟอนตลายมอ

ขๅนตอนทไ 2 สกนภาพทไขยนลง฿นคอมพวตอรท าการปรบตกตงภาพ฿หกดความคมชด ลวลอก Save ทมพลต฿หปนเฟล JPG

ภาพทไ 1 ภาพสดงหนาทมพลตฟอนตลายมอ

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 10: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขๅนตอนทไ 3 ปดเฟลทมพลตทไราสกน฿นปรกรม Photoshop ลอกครไองมอ Crop Tool ลวครอบตวอกษรทไตองการ จากนๅนกใดบบๅลคลก หรอกด Enter

ภาพทไ 2 (ก) ภาพสดงการครอปตวอกษรจากทมพลต฿นปรกรม Photoshop

ทไมา : สาวลกษณ สงหวงษา , 2556

เปทไครไองมอ Magic Wand Tool ลวกดทไพๅนทไสขาว จากนๅนกด Ctrl + Shift + I ละ กด Ctrl + x

ภาพทไ 2 (ข) ภาพสดงการครอปตวอกษรจากทมพลต฿นปรกรม Photoshop

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 11: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขๅนตอนทไ 4 ปดปรกรม FontCreator ลอก File > Open > Font File

ภาพทไ 3 ภาพสดงการปดเฟลฟอนต AAA-Watin-new ฿นปรกรม FontCreator

ทไมา : สาวลกษณ สงหวงษา , 2556

ลอก Font ตนฉบบคอ AAA-Watin-new ลว Save As ฿หปนชไอของรากอนคอ CRU-Saowalak

ภาพทไ 4 ภาพสดงการ Save As เฟลฟอนต฿หมปน CRU-Saowalak

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 12: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขๅนตอนทไ 5 ปดเฟลทไปนชไอราขๅนมา ลวลอกตวอกษรทไราท าเว฿นปรกรม Photoshop

ภาพทไ 5 (ก) ภาพสดงการน าอกษรทไครอปจากปรกรม Photoshop มา฿ส฿นปรกรม FontCreator

ทไมา : สาวลกษณ สงหวงษา , 2556

จากนๅนกด Ctrl + v หรอ คลกขวา Paste จะปรากฏภาพของตวอกษรทไราเดลอกมา ฿หราปรบขนาด ฿หพอดกบสดสวนตามมาตรฐานของอกษรตละตว฿หครบทกตว฿นทมพลต

ภาพทไ 5 (ข) ภาพสดงการน าอกษรทไครอปจากปรกรม Photoshop มา฿ส฿นปรกรม FontCreator

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 13: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขๅนตอนทไ 6 ดดตวอกษรทไราเดครอปมา฿หสวยงามตามความหมาะสม อาจคลกขวาตรงจด ลวลอก Off Curve พไอท าสน฿หคงมน หรอถามจดมากกนเปกใลบออก

ภาพทไ 6 ภาพสดงการดดตกตงฟอนต

ทไมา : สาวลกษณ สงหวงษา , 2556

ขๅนตอนทไ 7 การจดวางชองเฟ ต าหนงระยะหาง หนา - หลง ความสง ละก าหนดสนครงสราง Guidelines ของตวอกษร - Cap height คอ ความสงของตวอกษรพมพ฿หญ - Median คอ ความสงของตวอกษรพมพลใก - X-height คอ ระยะหางระหวางสนฐานจนถงสน Median ซไงปนชวงของตวพมพลใก - Baseline คอ สนฐาน

ภาพทไ 7 ภาพสดงการดดตกตงฟอนตสรใจสๅน

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 14: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขๅนตอนทไ8 จดระยะชองเฟของอกษร เดดย คลกขวา Properties

ภาพทไ 8 (ก) ภาพสดงการจดระยะชองเฟของอกษร

ทไมา : สาวลกษณ สงหวงษา , 2556

จากนๅนปรบระยะหาง ตรง Glyph Metrics ฿หมคาตรงตามความหมาะสมของตละอกษร ควรกด Test หรอ F8 พไอท าการตรวจระยะหาง ชองเฟ ความสง ดยราควรตรวจ฿หครบถวนอยางละอยด ดยฉพาะ สระละพยญชนะ฿นภาษาเทย

ภาพทไ 8 (ข) ภาพสดงการจดระยะชองเฟของอกษร

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 15: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขๅนตอนทไ9 มไอราจดวางชองเฟ ต าหนงระยะหาง หนา - หลง ความสง ของตวอกษรครบทกตวลว฿หคลกเปทไ Font > Test พไอทดสอบการพมพ ตรวจสอบระยะชองเฟของตละอกษร หากยงเมสมบรณ ฿หกเขตามขๅนตอนทไ 8

ภาพทไ 9 ภาพสดงการ Test ตวอกษร

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 16: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

Did : ผลทไเดรบ คอ ฟอนตลายมอ ภาษาเทย - องกฤษจากปรกรม FontCreator จะเดฟอนตชไอ CRU-Saowalak

ภาพทไ 10 (ก) ภาพสดงฟอนตลายมอ ภาษาเทย - องกฤษ

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 17: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ภาพทไ 10 (ข) ภาพสดงฟอนตลายมอ ภาษาเทย - องกฤษ

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 18: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ตารางรหสรปอกขระตามมาตรฐานยนคดประจ าตวอกษรภาษาเทย – องกฤษ

มไอราท าฟอนตลายมอสรใจสๅนลวกใจะเดฟอนตลายมอทไมยนคดประจ าตวอกษร ดงนๅ

notdef

space

# numbersigh $ dollar % pencent & ampersand ' quotesingle ( parenleft ) parenright * asterisk + plus , comma - hyphen . period / slash 0 zero 1 one 2 two 3 three 4 four 5 five 6 six 7 seven 8 eight 9 nine : colon ; semicolon < less = equal > greater ? question @ at A A B B C C D D

Page 19: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

E E F F G G H H I I J J K K L L M M N N O O P P Q Q R R S S T T U U V V W W X X Y Y Z Z [ bracketleft \ backslash ] bracketright ^ asciicircum _ underscore ` grave a a b b c c d d e e f f g g h h i i j j k k l l

Page 20: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

m m n n o o p p q q r r s s t t u u v v w w x x y y z z { braceleft } braceright ~ asciitilde ‚ quotedbl ! exclam ¿ questiondown ‘ quoteleft ’ quoteright ‚ quotedblleft ‛ quotedblright diresis

© copyright ® registered ™ trademark • bullet – endash — emdash ‚ quotesinglbase „ quotedblbase uni007F NULL nonmarkingreturn า uni0E33 ก uni0E4E.alt1 ¼ onequarter ½ oneharf

Page 21: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

¾ threequarters uni0E00 ก uni0E01 ข uni0E02 ฃ uni0E03 ค uni0E04 ฅ uni0E05 ฆ uni0E06 ง uni0E07 จ uni0E08 ฉ uni0E09 ช uni0E0A ซ uni0E0B ฌ uni0E0C ญ uni0E0D ฎ uni0E0E ฏ uni0E0F ฐ uni0E10 ฑ uni0E11 ฒ uni0E12 ณ uni0E13 ด uni0E14 ต uni0E15 ถ uni0E16 ท uni0E17 ธ uni0E18 น uni0E19 บ uni0E1A ป uni0E1B ผ uni0E1C ฝ uni0E1D พ uni0E1E ฟ uni0E1F ภ uni0E20 ม uni0E21 ย uni0E22 ร uni0E23 ฤ uni0E24 ล uni0E25 ฦ uni0E26

Page 22: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ว uni0E27 ศ uni0E28 ษ uni0E29 ส uni0E2A ห uni0E2B ฬ uni0E2C อ uni0E2D ฮ uni0E2E ฯ uni0E2F ะ uni0E30 ก uni0E31 า uni0E32 า uni0E33 ก uni0E34 ก uni0E35 ก uni0E36 ก uni0E37 ก uni0E38 ก uni0E39 ก uni0E3A uni0E3F uni0E40 uni0E41 uni0E42 ฿ uni0E43 เ uni0E44 แ uni0E45 โ uni0E46 กใ uni0E47 ก uni0E48 ก uni0E49 ก uni0E4A ก uni0E4B ก uni0E4C ก uni0E4D ก uni0E4E ๏ uni0E4F ๐ uni0E50 ๑ uni0E51 ๒ uni0E52

Page 23: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

๓ uni0E53 ๔ uni0E54 ๕ uni0E55 ๖ uni0E56 ๗ uni0E57 ๘ uni0E58 ๙ uni0E59 ๚ uni0E5A ๛ uni0E5B

zerowidthnonjoiner uni0E10.alt1

ก uni0E34.alt1 ก uni0E35.alt1 ก uni0E36.alt1 ก uni0E37.alt1 ก uni0E48.alt1 ก uni0E49.alt1 ก uni0E4A.alt1 ก uni0E4B.alt1 ก uni0E4C.alt1 ก uni0E48.alt2 ก uni0E49.alt2 ก uni0E4A.alt2 ก uni0E4B.alt2 ก uni0E4C.alt2

uni0E0D.alt1 ก uni0E31.alt1 ก uni0E4D.alt1 กใ uni0E47.alt1 ก uni0E48.alt3 ก uni0E49.alt3 ก uni0E4A.alt3 ก uni0E4B.alt3 ก uni0E4C.alt3 ก uni0E38.alt1 ก uni0E39.alt1 ก uni0E3A.alt1 ฎ uni0E0E.alt1 ฏ uni0E0F.alt1 ฬ uni0E2C.alt1

Page 24: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

uni0E4F.liga uni0E24.liga uni0E26.liga

.notdef AAA_Logo

.notdef € Euro ÷ divide X multiply

yen | bar

fi fl

Page 25: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

Done : เดน าเปทดสอบ - สราง - ประยกต - ฿ชประยชน คอ น ามาตดตๅงพไอ฿ชปนบบพมพ฿นรายงานของวชาการออกบบตวอกษรพไอการพมพ

ขอมลบบตวพมพ ( Font Information ) ชไอบบตวพมพ (Typeface/Font Name ) ชไอ CRU-Saowalak ประภทของเฟลตวพมพ OpenType Layout, TrueType Outlines ออกบบดย นางสาว สาวลกษณ สงหวงษา รหสนกศกษา 5411306599 วชาการออกบบตวอกษรพไอการพมพ ARTD2304 กลมรยน 102 สาขาวชาศลปกรรม มหาวทยาลยราชภฏจนทรกษม กรงทพมหานคร มไอวนทไ 19 ดอน กมภาพนธ พศ. 2556

ตวอยางรปบบตวอกขระภาษาลาตน ( Latin Characters ) เดก ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 abcdefghijklmnopqrstuvwxyz!@#%^&*()_+|{}[]:"<>?;'",./\*-.=;'

ตวอยางรปบบตวอกขระภาษาเทย ( Thai Characters ) เดก กขฃคฅฆงจฉชซฌญฎฏฐฒณดตถทธนบปผฝพฟภมยรฤลฦวศษสหฬอฮ๐๑๒๓๔๕๖๗๘๙ โแอะอาออออออออออออ า฿เ?

Page 26: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

ขอความส าหรบการทดสอบการพมพรบค าสไงพมพ ละพไอสดงต าหนงการพมพรปอกขระทไออกบบ - จดชองวาง ชองเฟระหวางรปอกขระละระหวางค า ทๅงชดคอภาษาองกฤษกบภาษาเทย In typography, a font is traditionally defined as a quantity of sorts composing a complete character set of a single size and style of a particular typeface. For example, the complete set of all the characters for ‚9-point Bulmer‛ is called a font, and the ‚10-point Bulmer‛ would be another separate font, but part of the same font family, whereas ‚9-point Bulmer boldface‛ would be another font in a different font family of the same typeface. One individual font character might be referred to as a ‚piece of font‛ or a ‚piece of type‛.Font nowadays is frequently used synonymously with the term typeface, although they had clearly understood different meanings before the advent of digital typography and desktop publishing. ฿นทางวงการพมพนๅนกลาวถงฟอนตดยทไวเปวา หมายถงตวอกษรทไ฿ชปนบบตวรยงพมพนๅอหา ทไมขนาดละรปบบปนชดดยวกน ยกตวอยางชนบบตวอกษรทไ฿ช฿นการรยงพมพนๅอหาทไทานก าลงอานอยนๅ มชไอบบตวอกษรชดนๅวา บางพด(Bangpood) ทไประกอบดวยรปอกขระ(Glyphs) ของตวพยญชนะ (Consonants) สระ(Vowels) วรรณยกต (Tones) ครไองหมายสญลกษณ(Signs and Symbols) วรรคตอน(Punctuation) อกษรภาษาเทย ภาษาองกฤษ

ค ากลอนเทยส าหรบ฿ชพมพทดสอบผลการออกบบ สดงครงสรางของตวอกษร การจดระดบต าหนงรปพยญชนะ สระ วรรณยกต ครไองหมายวรรคตอน การจดระยะชองเฟรอบรปอกขระหรอฟอนตสวนภาษาเทย ทไสราง บนทก ตดตๅง ละหรอทดสอบ฿นปรกรมฟอนตครอตอรละ หรอดวยปรกรมประยกตอไนโ฿นระบบ ขามก฿ชค ากลอนนๅ ฿หนกศกษาคดลอกเปวาง ปลไยนปนฟอนตทไราท า ตรวจสอบระยะชองเฟกๅนหนา-หลง การประสมค าต าหนงสระละวรรณยกต?วาตรงต าหนงตามหลกเวยกรณของเทยหรอ฿หมละบนทกปนหลกฐานสดง฿นรายงาน ภาษาองกฤษ฿หตรวจสอบดดวยตาองวาระยะปนอยางเร ลวเปกเข฿นตารางฟอนต ละทดสอบ฿หม ซ ๅาโ จนน฿จวาปนระยะละต าหนงทไถกตองลว

ค ากลอนตรวจสอบบบตวอกษร ต าหนงพมพผสมค าเทย "ปนมนษยสดประสรฐลศคณคา กวาบรรดาฝงสตวดรจฉาน จงฝาฟนพฒนาวชาการ อยาลางผลาญ ฤแขนฆาบฑา฿คร เมถอทษกรธชงซด ฮดฮดดา หดอภยหมอนกฬา อชฌาสย ปฏบตประพฤตกฎ ก าหนด฿จ พดจา฿หจะโจา นาฟงอยฯ"

ค าทไควรน ามาทดสอบคอ วชน ภปตม กตญ กลไอน กลๅอน หมรง กระปรง น ๅา฿จ

Page 27: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

การน ามาตดตๅง C:\WINDOWS\Fonts พไอ฿ชปนบบพมพ฿นรายงานของวชาการออกบบตวอกษรพไอการพมพ฿นปรกรมสรางอกสารตางโชน Microsoft Word

ภาพทไ 11 (ก) ภาพสดงการตดตๅงฟอนตลายมอลงยงครไอง

ทไมา : สาวลกษณ สงหวงษา , 2556

ลากเฟลตวอกษรทไชไอ CRU-Saowalak มา฿ส฿นฟลดอร Fonts

ภาพทไ 11 (ข) ภาพสดงการตดตๅงฟอนตลายมอลงยงครไอง

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 28: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

มไอตดตๅงฟอนตรยบรอยลว ฟอนตทไน าเป฿ส฿หมกใสามารถ฿ชงานเดทนท

ภาพทไ 12 ภาพสดงการน าฟอนตลายมอเป฿ช฿นปรกรมสรางอกสาร Microsoft Word

ทไมา : สาวลกษณ สงหวงษา , 2556

Page 29: รายงานการออกแบบตัวอักษรชุด CRU-Saowalak

อางอง

https://docs.google.com/viewer?a=v&pid=sites&srcid=ZGVmYXVsdGRvbWFpbnxhcnRpMjMwNXxneDo0OTM5MDAzZWFlNTAxMjc

http://www.paperchase.co.uk/02mm-uni-pin-fine-line-black/invt/00412048/

http://www.trueplookpanya.com/true/sarapan_detail.php?cms_id=11209

http://www.tohome.com/product_detail.aspx?product_id=20120700073

http://trascendend-world.blogspot.com/2012/03/font-creator-version-55065-100-full.html

http://www.mydigitalphotos.dk/adobe-photoshop-cs5/