สกบเวบไซต

สในโหมดเวบไซต

สในโหมดเวบไซต คอ โหมด RGB มแนวคดมาจากการผสมแสงสหลก 3 สเขาดวยกน

คอ แดง (RED) เขยว (GREEN) และนาเงน (BLUE)

ซงเมอผสมกนจะทาใหเกดสจานวนมาก สวนใหญการใช

สลกษณะนจะใชในอปกรณทเกยวกบแสง เชน จอภาพ

กลองดจตอล เปนตน

ความสาคญของสตอเวบไซต

สสนในหนาเวบเพจเปนสงสาคญมากในการดงดด

ความสนใจของผใช เนองจากเปนสงแรกทมองเหนได

จากเวบเพจ

ส สามารถใชไดกบทกองคประกอบของเวบเพจ เชน

ตวอกษร รปภาพ ลงค และพนหลง

ความสาคญของสตอเวบไซต

การตดสนใจเลอกใชสใหเหมาะสมกบบคลกและ

เปาหมายของเวบไซตเพอแสดงผลทตรงกบวตถประสงค

มากทสด จงเปนสงทสาคญอกอยางหนงในการสราง

เวบไซต

ความสาคญของสตอเวบไซต

ส ม คว า มสาคญ มา ก ใน กา ร ออ ก แบบเ วบไ ซ ต

เนองจากสสามารถสอถงความรสก อารมณ

ดง น น ส เ ป น ป จ จย สา คญ อ ย า ง ห น ง ท จ ะ ช ว ย

เสรมสรางความหมายขององคประกอบใหกบเวบเพจได

อยางด

ประโยชนของส

1. สสามารถชกนาสายตาผใช

สชวยนาสายตาใหไปยงทกบรเวณในหนาเวบเพจ

ผอานจะมการเชอมโยงความรสกกบบรเวณของสใน

รปแบบทคาดหวงได

การเลอกเฉดสและตาแหนงของสอยางรอบคอบ

สามารถนาทางใหผใ ชตดตามเนอหาตางๆ ตามท

กาหนดได วธนจะใชเมอตองการใหผใชเวบไซตเกด

ความสนใจ

1. สสามารถชกนาสายตาผใช

2. สชวยเชอมโยงบรเวณทไดรบการออกแบบเขาดวยกน

ผใ ชจะมความร สกวาบรเวณทมสเดยวกนจะม

ความสาคญเทากน

วธการเชอมโยงแบบนจะชวยจดกลมของขอมลทม

ความสมพนธอยางไมเดนชดเขาดวยกนได

2. สชวยเชอมโยงบรเวณทไดรบการออกแบบเขาดวยกน

3. สสามารถแบงบรเวณตางๆ ออกจากกน

สสามารถแบงบรเวณตางๆ ภายในเวบเพจออก

จากกน

3. สสามารถแบงบรเวณตางๆ ออกจากกน

4. สสามารถสรางอารมณของเวบเพจ

ส ส า ม า ร ถ ส ร า ง อ า ร ม ณ โ ด ย ร ว ม ข อ งเ วบ เ พ จ

และกระตนความรสก

นอกเหนอจากความร สกทไดร บจากสตามหลก

จตวทยาแลว ผใชยงอาจมอารมณและความรสกสมพนธ

กบสบางส หรอบางกลมเปนพเศษ

4. สสามารถสรางอารมณของเวบเพจ

4. สสามารถสรางอารมณของเวบเพจ

5. สชวยสรางระเบยบ

สชวยสรางระเบยบใหกบขอความตางๆ เชน การใช

สแยกสวนระหวางหวเรองกบตวเรอง หรอการสราง

ความแตกตางใหกบขอความบางสวน

6. สชวยสงเสรมเอกลกษณ

สสามารถสงเสรมเอกลกษณขององคกร ดวยการใช

สทเปนเอกลกษณขององคกรมาเปนโทนสหลก

6. สชวยสงเสรมเอกลกษณ

6. สชวยสงเสรมเอกลกษณ

ความรเบองตนเกยวกบส

รปแบบชดสพนฐาน

1. ชดสรอนประกอบดวยสมวงแกมแดง

, แดงแกมมวง , แดง , สม , เหลอง

, เขยวอมเหลอง ใหความร สก

อบอน สบาย ตอนรบแกผชม ชวย

ดงดดความสนใจ

ทางจตวทยาสรอนมความ

สม พน ธ กบ ค ว า ม ส ข ส ะ ด ว ก

สบาย สตางๆในชดสรอนมความ

กลมกลนอยในตวเอง

อาจดไมนาสนใจบาง เพราะ

ขาดสทตดกนอยางชดเจน

2. ชดสเยน ชดสเยนประกอบดวยสมวง ,

น า เ ง น , น า เ ง น อ อ น , ฟ า

, นาเงนแกมเขยว และสเขยว

ตรงกนขามกบชดสรอน

ใ ห ค ว า ม ร ส ก เ ยน ส บ า ย

องคประกอบทใชสเยนเหลานจะด

ส ภ า พ เ ร ย บ ร อ ย แ ล ะ ม ค ว า ม

ชานาญ

แตในทางจตวทยา สเยน

เหลานกลบมความสมพนธกบ

ความซมเศราหดหและเสยใจ

2. ชดสเยน ช ด ส เ ย น ม ค ว า มกลมกลนกนโดยธรรมชาต แตอาจจะดไมนาสนใจเพราะขาดความแตกตางของส ทเดนชด

จะเหนวา มอก 2 ส ทไมอาจจาแนกออกเปนสรอนหรอสเยนไดอยางแนนอน คอ สเหลองและสเขยว เพราะสทงสองสามารถใหความรสกไดท ง รอนและเยนตามแตสถานการณและสรอบขาง

3. ชดสแบบสเดยวชดสแบบสเดยวทมคาของส

บ ร ส ท ธ เ พ ย ง ส เ ด ย ว ค ว า ม

หลากหลายของสชดนเกดจาก

การเพมความเขมหรอความออน

ในระดบตางๆ ใหกบสตงตน

เชน สแดงอาจประกอบดวย

- สแดงลวน

- สแดงอฐ (สเขมของสแดง)

- สสตรอเบอร (สออนปาน

กลางของสแดง)

- สชมพ(ส ออนมากของส

ชมพ)

4. ชดสแบบสามเสาการเลอกชดสดงกลาว คอ

การนกถงสามเหลยมดานเทาลอยอยเหนอวงลอส เพยงเทาน สทอยทมมของสามเหลยมทงสามกจะเปนสทเขาชดกน

ซงอาจประกอบดวยสสามสทมระยะหางกนเทากนในวงลอส จงมความเขากนอยางลงตว

ช ด ส แ บ บ ส า ม เ ส า ท มประสทธภาพมากทสดคอ ชดทประ กอ บ ด วย ส ขน ต น ท ง ส า ม ดวยการตดกนอยางรนแรงของสจะสรางความสะดดตาอยางมาก

4. ชดสแบบสามเสา ช ด ส แ บ บ ส า ม เ ส า ม ข อ ไ ด

เปรบยตรงทมเสถยรภาพสง เพราะ

แตละสมความสมดลอยางสมบรณ

แตละสมการชกนาไปสกนและ

กน ตามกระบวนการธรรมชาต

ทาใหมลกษณะเดนในดาน

ความมชวตชวา

แ ต บ า ง ค ร ง ค ว า ม ส ด ใ ส

ดงกลาวอาจมลกษณะทฉดฉาด

เกนไปจนไปรบกวนการ สอสาร

ความหมายทแทจรงได

5. ชดสทคลายคลงกนประกอบดวยส 2 หรอ 3 สทอย

ตดกนในวงลอส

เชนสแดงแกมมวง สแดง และสสม เนองจากชดสทอยในรปแบบนมจานวนมากมายทาใหเราสามารถเลอกชดสแบบนมาใชงานไดอยางงายสะดวก

หากเพมจานวนสในชดใหมากขนเปน 4 หรอ 5 สได จะสงผลใหขอบเขตของสทมความกวางเกนไป ทาใหสอยตรงปลายทงสองของชดไมมความสมพนธกน เปนสาเหตใหลกษณะการทมสคลายคลงกนลดลง

5. ชดสทคลายคลงกน ความคลายคลงกนของส

ยงกอใหเกดความกลมกลนกนอก

ดวย

แตการขาดความแตกตาง

อยางชดเจน อาจทาใหไมมความ

เดนเพยงพอทจะดงดดความสนใจ

ของผอานได

6. ชดสตรงขามสทอยตรงกนขามกนในวง

ลอส เชน สแดงกบฟา หรอสนา

เงนออนกบสม

ขอไดเปรยบของสในรปแบบ

นคอ ความสดใส สะดดตา

อยางไรกดจานวนสทจากด

ในรปแบบน ทาใหผใชใหความ

สนใจไดงาย หลงจากนนกอาจละ

ท ง ค ว า ม ร ส ก ส น ใ จ ไ ป ไ ด ง า ย

เชนกน

7. ชดสตรงขามขางเคยง ชดสตรงขามขาง เคยงม

รปแบบทเปลยนแปลงมาจากชดส

ตรงขาม แตละความแตกตางกน

ทสใดสหนงทอยตรงขามกนถก

แทนทดวยสทอยดานขางทงสอง

เชน สฟาซงมสดานขางเปนสนา

เงนออนกบส นาเงนแกมเขยว

ฉะนนชดสตรงขามขางเคยงทได

จงประกอบดวย สแดง สนาเงน

ออน และสนาเงนแกมเขยว

7. ชดสตรงขามขางเคยง ขอไดเปรยบของชดสแบบน

คอ ความหลากหลายทมากขน

เมอเทยบกบชดสตรงขาม

อ ย า ง ไ ร ก ต า ม ค ว า ม

หลากหลายทเพมขนมาน มผลให

ความสดใสและความสะดดตา

ลดลง รวมถงความเขากนของสก

ลดลงดวย

8. ชดสตรงขามขางเคยงทง 2 ดาน ส ต รง กน ข า ม ท ง ส อ ง ถก

แบงแยกเปนสดานขางทง 2 ดาน

จงไดเปนชดส 4 ส เชน สแดงแกม

มวงกบนาเงนแกมเขยว และนา

เงนออนกบสม

ขอไดเปรยบทเหนไดชด คอ

ความหลากหลายทเพมขนจากชด

สตรงขามแบบแบงแยก

ขอ เสยเป รยบ คอ ความ

สดใสและความกลมกลนของส

ลดลง

สและความรสก

แดง

เปนสทมความหมายไดหลากหลาย เชน ความรก

กาลงใจ สงคราม อนตราย

ไมควรใชสแดงจดมากเพราะอาจทาใหผใชเมอยลา

สายตา

แดง

เหลอง

เปนสทใหอารมณสดใส ปลอดโปรง

และสามารถดงดดความสนใจไดมาก บางครงอาจ

มากกวาสแดง

สเหลองไมสามารถสรางแรงจงใจไดดวยตวมนเอง

จงมกใชรวมกบสอน เชน สดา

มกนามาเปนสพนเพอชวยเพมความสามารถในการ

อานเมอใชสอกษรทตดกน

เหลอง

นาเงน

เปนสทใหความหมายของความสงบเงยบ ความ

สขม ความมราคา ใหอารมณหรหรามระดบ ความ

สภาพ ความหนกแนน เทคโนโลย ความรอบร

เปนสทไมสะดดตาเทาทควรถาไมมความสดใสของส

จรงๆ

สนาเงนจะเขากนไดกบชดสเยน เชน สเขยว สเทา

สนาตาลออน

นาเงน

สนาเงนเหมาะทจะเปนสพนหลงของเวบไซตทให

ความสนก ราเรง มชวตชวา

หลกเลยงการใชสนาเงนในเวบไซตอาหาร

นาเงน

สม

สสมใหความรสกทนสมย สดใส กระฉบกระเฉง

มพลง

นยมใชสสมไปใชในสวนทตองการเนนหรอกระตน

ใหผใชเกดความสนใจมากกวาการนาไปเปนสพน

นยมใชกบเวบไซตทเกยวของกบอาหารเนองจาก

การศกษาพบวาสสมจะทาใ หเกดความร สกอยาก

รบประทานอาหาร

สม

สม

สม

เขยว

สเขยวเปนสทมผลตออารมณและความรสกของ

มนษยเนองจากสเขยวสามารถสรางความรสกรอนหรอ

เยนกได

สเขยวแกใหความรสกสงบ เยอกเยน แตสเขยว

ออนใหความรสกอบอน แขงขน สะดดตา

โดยสวนใหญจะนาสเขยวไปใชกบเวบไซตทาง

การเงนหรอสงแวดลอมเพอแสดงถงความสมบรณ การ

เจรญเตบโต

เขยว

เทา

เ ป น ส ท เ ป น ก ล า ง แ ส ด ง ถ ง ค ว า ม สภ า พ แ ล ะ

สรางสรรค หรอทาใหร สกอารมณเศรา หมนหมอง

ไรชวตชวา

สเทามกจะใชกบสโทนเยน เชน สนาเงน มวง ซงจะ

ใหความรสกสงางาม ชานาญ มนคง

เทา

เทา

นาตาล

เปนสทใหความรสกเกาแก โบราณ มนคง เรยบงาย

สะดวกสบาย

แตบางครงอาจใหความรสกนาเบอถาใชไมเหมาะสม

โดยสนาตาลมกใชเปนสวนประกอบในการสราง

เวบไซตเกยวกบบานและครอบครว

นาตาล

นาตาล

ขาว

เปนสทไดรบความนยมใชเปนสพนของเวบไซตมาก

ทสด เพราะสามารถเขาไดกบทกส

ชวยเพมความสามารถในการอานขอความบน

หนาจอไดด

บางครงสขาวอาจหมายถงความตายและความ

โศกเศราไดดวย

ขาว

ดา

โดยปกตเปนสทสอถงความโศกเศรา ความรนแรง ความ

หดห

ตามทฤษฎสดาจะมความหมายตรงขามกบสขาวเสมอ

แตหากนาทงสองสมาใชรวมกนกจะเกดความหมายทด

เชน ความฉลาด ความมนคง

และเมอนาไปใชกบสอนกสามารถสรางความซบซอนได

สดามกถกนาไปใชเปนสพนหลงของเวบไซตนาเสนอ

ผลงานทางศลปะ

ดา

ดา

ดา

ทมา : http://grappik.com/how-to-use-color-color-wheel/

1. Capture inspiration

แคคณเลอกภาพทตองการมาสกหนงภาพ เปนภาพทมโทน

สและค สตามทคณตองการ กนามนมาดดคาสจากโปรแกรม

ตางๆ

2. ใช color wheel

3. ออกแบบโดยมพนทวาง

เทคนคการออกแบบโดยมพนทวาง ใชสดสวน 60% เปนส

ทโดดเดน 30% เปนสรอง 10% เปนสทถกเนน อยางในตวอยางส

เดนคอสดา สรองคอเขยว และสทเนนคอแดงนนเอง

4. บนทกสทชอบ

save as ภาพทคณชอบเกบเอาไวใชงานในภายหลง จะทา

ใหการทางานเปนเ รอง งายขน หากคณมส ทชอบเอาไ ว

เปน colour guide

5. หา Pantone ไวใชงาน

6. หาสจากธรรมชาตรอบตว

7. เลอกใชสแค 2 – 3 ส

8. เลอกสหลก แลวหาสทเขาค

งานทคณกาลงออกแบบเปนงานอะไร เปนกฬา, แฟชน,

ความงาม, หรอธรกจ เพราะอารมณของแตละงานกเลอกใชสท

ไมเหมอนกน อยากจะใหอารมณงานออกมาออนนมหรอรนแรง

9. https://www.pinterest.com/

แหลงรวบรวมงานออกแบบมากมาย