[Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja
16
Photoshop Web design คอร์สสอนการออกแบบเว็บไซต์ด้วย Photoshop CC 2014 for Novice to Ninja
-
Upload
thapwaris-chinsirirathkul -
Category
Design
-
view
1.776 -
download
0
Transcript of [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja
![Page 1: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/1.jpg)
Photoshop Web designคอรสสอนการออกแบบเวบไซตดวย Photoshop CC 2014 for Novice to Ninja
![Page 2: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/2.jpg)
![Page 3: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/3.jpg)
เตรยมเครองมอ
สดยอดโปรแกรมส าหรบรทชรปภาพ ทมคนใชมากทสดในโลก และยงเปนสดยอดเครองมอทใชในการออกแบบเวบไซตอกเชนกน
Code Editor ฟรททาง Adobe ไดรวมพฒนาโดยเหมาะส าหรบงาน Frontend เปนอยางยง
เครองมอส าหรบใชจ าลองเซรฟเวอร และท าเซรฟเวอรเสมอนบน local ได
![Page 4: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/4.jpg)
หลกการออกแบบ
ความสวยงามเปนเพยงสวนหนงของการออกแบบ
ทชวยเสรมความนาสนใจของเวบไซตคณใหกบผใชงานเทานน
แตมนจะไมมความหมายเลย ถามนไม “ตอบโจทย” หรอ มนไมใช สงทผใชงานตองการจรงๆ
![Page 5: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/5.jpg)
แรงบลดาลใจ และ ไอเดยอยรอบตว
ทกๆชวงเวลาของชวต เปนแรงบลดาลใจ ใหคณได
ไมวาจะเปนปญหาตางๆทอยรอบตวคณ หรออยรอบตวคนอนๆทคณพบเจอ
หากคณตระหนกคด หรอ มองไปรอบๆ คณจะเจอแรงบลดาล หรอ ไอเดยดๆไดแนนอน
![Page 6: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/6.jpg)
ทกๆชวงเวลาของชวต เปนแรงบลดาลใจ ใหคณได
สงทอยรอบๆตว “ลกแมวทเลยงไว” “ลกชายทก าลงยกมอขนมาจบห” “ลกบอลของเลนของลกชาย”
แคนเรากสามารถน าสงทอยรอบตวมาสรางเปนผลงานงายๆไดแลวครบ
![Page 7: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/7.jpg)
แลวถาหาจากสงรอบขางไมไดละ ?
ในบางครงงานดไซน อาจจะตองใชแรงบลดาลใจ จากผลงานของผอนดวยเชนกน
dribbble.com
![Page 8: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/8.jpg)
แลวถาหาจากสงรอบขางไมไดละ ?
ในบางครงงานดไซน อาจจะตองใชแรงบลดาลใจ จากผลงานของผอนดวยเชนกน
www.behance.net
![Page 9: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/9.jpg)
แลวถาหาจากสงรอบขางไมไดละ ?
ในบางครงงานดไซน อาจจะตองใชแรงบลดาลใจ จากผลงานของผอนดวยเชนกน
www.awwwards.com
![Page 10: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/10.jpg)
การฝกทดคอการเลยนแบบ
ใชแลวครบ ถาเกดวาเราเปนมอใหมการทจะคดสรางสรร ผลงานออกมาเองแลวมนยาก บางทอาจถงขนมด 8 ดาน
แลวเราจะแกปญหานยงไง ? ตามทผมขนหวไวนนแหละครบ ฝกฝมอดวยการ เลยนแบบเราสามารถฝกการดไซนของเราดวยการเลยนแบบผลงานคนอนไดครบ การเลยนแบบไมใชการ copy and paste
แตมนเปนการศาสตรๆนง ทชวยใหเราเกดการเรยนรไดอยางรวดเรว
ยงเราเลยนแบบเยอะเทาไหร เรายงเหนแนวทางมากขนเทานน
![Page 11: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/11.jpg)
อยากลวการใช White Space
W H I T E S P A C E คอการเลอกใชพนทวางใหเหมาะสมกบชนงาน
ถ า ช น ง า นท ค ณมอ งด แ ล ว ร ส ก “อ ด อ ด” ลอ ง เพ ม พ น ท ว า ง เ ข า ไ ป ส ก 2 เทา
และถาอยากท า UI ทดแลวใหความรสกวาผานการดไซนมาแลว ตองมพนทโลงเยอะ ๆ
Erik D. Kennedy
![Page 12: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/12.jpg)
เพมความหรหราดวยการใชงาน
WHITE SPACE
![Page 13: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/13.jpg)
เรองของ ส
![Page 14: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/14.jpg)
![Page 15: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/15.jpg)
แบรนด ส และ ความรสก
แตละแบรนดมการเลอก สทสงผลตอความรสก ของผชม
![Page 16: [Ex Docs]Cloud-tutorial.com Course WordPress Baby to Ninja](https://reader030.fdocuments.net/reader030/viewer/2022032513/55d24b65bb61ebe4088b45a3/html5/page/16.jpg)
Adobe Color CC
เ ค ร อ ง ม อ ส า ห ร บ ก า ร ส ร า ง Swa t ch ส า ห ร บน า ไ ป ใ ช ใ น Pho to s hop CC 2 014
