ครั้งนี้เป็นทิปง่ายๆ แต่ผมคิดว่าน่าจะนำมาลงใน Go Pro ด้วย เพราะการทำงานใน Photoshop เราจำเป็นต้องมีการซูมผลงานเข้าออกอยู่เสมอ ท้ายที่สุดแล้ว เราก็อยากดูผลงานในซูมที่ระดับ 100% เพื่อตรวจสอบความถูกต้องและความคมชัดของผลงาน ผมสรุปวิธีการซูมผลงานเพื่อกลับมาที่มุมมอง 100% มา 5 วิธีด้วยกันครับ 1. ใช้ Shortkey วิธีแรกเป็นเบสิคการซูมเข้าออกผลงานด้วยการใช้ shortkey คือ ...

Luke Wroblewski นักวิเคราะห์และนักวิจัยงานออกแบบ UI ชาวรัสเซีย ได้นำเสนอผลการศึกษาว่า การที่เราทำการตรวจสอบรูปแบบข้อมูลอีเมลที่ยูสเซอร์ใส่เข้ามาทันที (email inline validation) จะทำให้สามารถลดจำนวนที่อีเมลส่งไปไม่ถึงผู้รับถึง 50% พูดในอีกแง่หนึ่ง ก็คือเราได้อีเมลลูกค้าเพิ่มขึ้นกว่า 50 % นั่นเองครับ ผมขออธิบายคำว่า Inline Validation เบื้องต้นให้เข้าใจมากขึ้นนะครับ ในการกรอกฟอร์มตามปกติ เราจะรู้ว่าเรากรอกข้อมูลช่องไหนถูกหรือผิดก็ต่อเมื่อเราต้องกดปุ่ม ...

สมัยยังเป็นผู้ใช้งาน Photoshop ระดับเบๆ ผมต้องสูญเสียเวลาซะส่วนใหญ่กับการต้องมาก๊อปปี้ layer effects ที่ใส่ให้กับเลเยอร์หนึ่ง ไปใช้กับอีกเลเยอร์หนึ่ง มาดูตัวอย่างปัญหากันครับ สถานการณ์ตัวอย่างในการใช้งาน layer effects สมมติผมสร้างเลเยอร์มา 2 เลเยอร์ดังภาพ หากผมต้องการใส่ layer effects ให้กับสี่เหลี่ยมสีเหลือง ผมจะ double click ที่พื้นที่ว่างๆ ...

นอกเหนือจากการฝึกปรือวิชาเพื่อขัดเกลาเทคนิคแล้ว อีกหนึ่งสิ่งที่ดีไซเนอร์ควรต้องทำเป็นประจำแต่ไม่ต้องบ่อยครั้งนักก็คือ การติดตามศึกษาเทรนด์การออกแบบโลก (Global Design Trend) แต่เราจะรู้ได้อย่างไงว่าเทรนด์โลกกราฟิคมันกำลังไปในหนทางไหน สิ่งหนึ่งง่ายๆ ที่ผมทราบจากที่ทำงานก็คือ การดูข้อมูลสถิติการดาวน์โหลดหรือคำค้นจากเว็บขายภาพอันดับต้นๆ ของโลก อย่างเช่น ShutterStock สถิติคำค้น Top 5 ของเว็บ ShutterStock เมื่อเทียบกับปี 2014 โดยข้อมูลทางสถิตินี้จะถูกนำเสนอผ่านทางลิงค์ http://www.shutterstock.com/trends และในปี 2015 จำนวนยอดคำค้นสูงสุด 5 ...

หลังจาก Apple เปิดตัว Interface ใหม่สำหรับ iOS 7 รูปแบบสไตล์ของการออกแบบไอคอนก็หันมาใช้ Line icon  หรือไอคอนแบบเส้นกันมากขึ้น เหตุผลที่ง่ายๆ คือไอคอนแบบเส้น มันดูสะอาดตากว่าแบบ Full Icon (ไอคอนแบบเต็ม) ซึ่งเข้ากับคอนเซ็ปต์การออกแบบของ Apple อยู่แล้วที่ต้องการตัดทุกสิ่งที่ไม่จำเป็นออกไป และพยายามใช้ white space ...

วันหนึ่ง ผมได้รับการติดต่อจากเพื่อนสมัยเรียนมหาวิทยาลัยว่า เค้ามี app อยู่ตัวหนึ่งที่ชื่อว่า Call Zen ต้องการให้ผมช่วยเรื่อง UI หน่อยว่า สามารถปรับปรุงตรงส่วนไหนได้บ้าง พวกเราจึงได้ทำการนัดแนะหารือกันหลังเลิกงาน หลังจากผมได้ทดลองเล่น app แล้ว ผมรู้สึกเลยว่า app Call Zen เป็น app ที่ดีมากเลยครับ เพราะ ...

การใช้งานเลเยอร์บน Photoshop เป็นอะไรที่เข้าใจได้ไม่ยากนัก คือแนวความคิดที่เหมือนกับแผ่นกระดาษทับซ้อนๆ กันไปเรื่อยๆ และเมื่อมีกระดาษกองเป็นชั้นๆ มากขึ้นจนทำให้เราสับสนตอนค้นหา ก็ถึงเวลาที่เราควรจัดระเบียบเลเยอร์บ้างแล้ว ขั้นที่ 1 จัดกลุ่ม ปุ่มที่ใช้สร้างกลุ่มเลเยอร์บน panel เลเยอร์  พื้นฐานที่ง่ายทีสุดในการจัดระเบียบเลเยอร์ ก็คือการสร้างกลุ่ม (Group) ของวัตถุที่อยู่กลุ่มประเภทเดียวกัน ตัวอย่างการจัดกลุ่มเลเยอร์สำหรับงานออกแบบเว็บไซต์ ถ้าหากผม design เว็บ ผมชอบที่จะสร้างกลุ่มเตรียมไว้ดังรูปด้านบน ...

ในที่สุดเราก็มาถึงตอนจบของการรีวิว app Rush Bike แล้วนะครับ มาเก็บตกปัญหาและมาสรุปกัน ปัญหา #3: แผนที่หมุน วิธีแก้ไข ข้อนี้แก้ไม่ยาก แม้แผนที่ default API ของ Google Map จะอนุญาตให้ผู้ใช้หมุนแผนที่ (Rotation) หรือแม้แต่การเอียง (Tilt) แน่นอนสิ่งนี้สามารถปิดการใช้งานได้ครับ ลองอ่านวิธีการใน ...

ผมคนหนึ่งที่ไม่ค่อยเห็นประโยชน์ของ Solid Color Layer เท่าไรนัก จนมาทำงานออกแบบ UI สำหรับมือถือ (หรืออีกหลายๆ งาน) ที่เราไม่รู้ว่าข้อมูลจะมีความยาวสุดขนาดไหน ทำให้ต้องคอยเพิ่ม/ลด ความสูงของหน้าอยู่บ่อยครั้ง ปัญหาที่เจอก็คือ สีพื้นหลังที่ต้องคอยมาเทให้เต็มหน้าทุกครั้งที่เพิ่มขนาดความสูงของหน้า อาจยังไม่เห็นภาพปัญหา งั้นเรามาดูกรณีตัวอย่างกันครับ พื้นงานที่มีการเติมสีพื้นหลังด้วยเลเยอร์ธรรมดา สมมุติผมต้องการสร้างงานขนาด 500×500 px และต้องการพื้นหลังเป็นสีอ่อนๆ ผมจึงสร้างเลเยอร์เพิ่มและเทสีให้เต็มพื้นที่ ...

ตอนแรกกับซีรีย์สอนเทคนิคการใช้งาน Photoshop ระดับโปรเพื่องาน UI  ที่ผมคัดกลั่นจากประสบการณ์การทำงานและการอยู่กินกับ Photoshop มานานกว่า 10 ปี เลยอยากจะแบ่งปันและอยากให้มาดูมาเผือกกันเยอะๆ (สอดรู้สอดเห็นในสิ่งที่ควรเป็นสิ่งที่ดีนะ)  หลังจบตอนแรกนี้และตอนต่อๆ ไป ผมคิดว่าคงจะทำให้เราปฏิวัติการใช้งาน Photoshop ให้มีประสิทธิภาพมากยิ่งขึ้น ซึ่งก็คือช่วยประหยัดเวลาในการสร้างสรรค์ผลงาน และเอาเวลานี้ไปคิดให้มากๆ ดีกว่า ว่าม่ะ ถ้างั้น จัดทิปแรกเลยน้า ทิปที่ ...