บทความนี้เกิดจากผมต้องการหาข้อมูลเพิ่มเติมเกี่ยวกับการออกแบบ App Icon ขึ้นมา สำหรับการส่ง App ขึ้นไปยัง Apple Store นั้นจะต้องเตรียมรูปเบื้องต้น 5 รูป* ก็ถือว่าใช้ได้แล้ว คือ
1. รูปขนาด 1,024 x 1,024 pixel สำหรับ App Store
2. รูปสำหรับ iPhone
- iPhone 2G, 3G , 3GS ขนาด 57 x 57 pixel
- iPhone 4, 4S, 5 ขนาด 114 x 114 pixel (2 เท่าจากแบบเดิม)
3. รูปสำหรับ iPad
- iPad 1, 2 , mini ขนาด 72 x 72 pixel
- iPad 3, 4 ขนาด 144 x 144 pixel (2 เท่าจากแบบเดิม)
เท่านี้ก็ครบละ แต่สิ่งที่ผมต้องการรู้เพิ่มเติมก็คือ มุมขอบของ Icon หรือที่เรียก Corner Radius นั้นแต่ละแบบมีขนาดเท่าใด เพราะในการออกแบบ Icon ให้สวย จะต้องตัดรูปให้พอดีกับมุมที่จะถูกย่อลงโดยอัตโนมัติ จึงได้ข้อสรุปว่าให้คำนวณแบบนี้
เนื่องจาก Apple ใช้ Icon เร่ิมแรกตอนเปิดตัว iPhone เป็นขนาด 57 x 57 pixel และมี Radius เป็น 10
ดังนั้นหากต้องการหาค่า Radius ขนาดอื่นๆ ก็จะใช้วิธีคำนวณแบบนี้
Radius = (10/57) x New Size
เช่น หาค่า Radius ของ Icon ขนาด 114 x 114 pixel
Radius = (10/57) x 114 = 20
ดังนั้น ค่า Radius ของ Icon ขนาด 114 x 114 ก็คือ 20 ครับ ผมขอทำสรุปค่า Radius สำหรับ Icon ขนาดต่างๆ อีกครั้งก็จะได้
1. 1,024 x 1,024 = 179.64
2. 57 x 57 = 10
3. 114 x 114 = 20
4. 72 x 72 = 12.63
5. 144 x 144 = 25.26
* ยังมี Icon อื่นๆ อีกนอกเหนือจากนี้ เช่น Icon Spotlight , Setting เป็นต้น ที่ผู้เขียนยังไม่ได้กล่าวถึง แต่สามารถใช้แค่รูปเบื้องต้น 5 รูปนี้ก็ถือว่าเพียงพอแล้ว
ที่มา Hicks Design
