ฉันกำลังพยายามสร้างไอคอนสำหรับแอพ iPhone ของฉัน แต่ไม่ทราบวิธีการรับรัศมีที่แน่นอนที่ไอคอนของ iPhone ใช้ ฉันค้นหาและค้นหาบทช่วยสอนหรือแม่แบบ แต่ไม่พบ

ฉันแน่ใจว่าฉันเป็นคนปัญญาอ่อน แต่คุณจะได้มุมที่โค้งมนตรงกับไอคอนของคุณจาก Illustrator หรือ Photoshop ได้อย่างไร

แก้ไข:

รัศมีของ Retina iPad คืออะไร

คุณสามารถสร้างไอคอนสี่ไอคอน (ณ วันนี้) สำหรับแอปของคุณและพวกเขาทั้งหมดสามารถมีรูปลักษณ์ที่แตกต่าง - ไม่จำเป็นต้องขึ้นอยู่กับภาพ 512x512

• รัศมีมุมสำหรับไอคอน 512x512 = 80 (iTunesArtwork)
• รัศมีมุมสำหรับไอคอน 1024x1024 = 180 (iTunesArtwork Retina )
• รัศมีมุมสำหรับไอคอน 57x57 = 9 (iPhone / iPod Touch)
• รัศมีมุมสำหรับไอคอน 114x114 = 18 (iPhone / iPod Touch Retina )
• รัศมีมุมสำหรับไอคอน 72x72 = 11 (iPad)
• รัศมีมุมสำหรับไอคอน 144x144 = 23 (iPad Retina )

หากคุณสร้างชุดไอคอนที่กำหนดเองคุณสามารถตั้งค่า UIPrerenderedIconตัวเลือกให้เป็นจริงในไฟล์ info.plist ของคุณและจะไม่เพิ่มเอฟเฟกต์เงา แต่จะวางพื้นหลังสีดำไว้ข้างใต้และยังคงรอบมุมภาพด้วยรัศมีมุมเหล่านี้ ดังนั้นหากรัศมีมุมของไอคอนใด ๆ สูงกว่าก็จะแสดงเป็นสีดำรอบ ๆ ขอบ / มุม

แก้ไข:ดูความคิดเห็นจาก @ devin-g-rhode และคุณสามารถเห็นว่าขนาดไอคอนในอนาคตใด ๆ ควรมี1:6.4อัตราส่วนของรัศมีมุมต่อขนาดไอคอน นอกจากนี้ยังมีคำตอบที่ดีมากจากhttps://stackoverflow.com/a/29550364/396005ซึ่งมีตำแหน่งของไฟล์มาสก์ภาพที่ใช้ใน SDK สำหรับมุมไอคอนการปัดเศษ

ในการเพิ่มไฟล์ที่รองรับเรตินาให้ใช้ชื่อไฟล์เดียวกันและเพิ่ม '@ 2x' ดังนั้นหากฉันมีไฟล์สำหรับไอคอน 72x72 ของฉันที่ชื่อว่า icon.png ฉันจะเพิ่มไฟล์ PNG ขนาด 114x114 ชื่อ icon@2x.png ให้กับโครงการ / เป้าหมายและ Xcode จะใช้มันเป็นไอคอนบนจอแสดงผลเรตินา คุณสามารถเห็นสิ่งนี้ได้ในหน้าสรุปของเป้าหมายแอปพลิเคชันหากคุณทำถูกต้อง การทำงานเช่นเดียวกันกับภาพเริ่มต้นของคุณ ใช้ launch.png ที่ 320x480 และ launch@2x.png ที่ 640x960

หลังจากลองคำตอบบางส่วนในโพสต์นี้ฉันได้ปรึกษากับ Louie Mantia (อดีตผู้ออกแบบ Apple, Square และ Iconfactory) และคำตอบทั้งหมดที่โพสต์ไว้ในโพสต์นี้ผิด Apple เริ่มต้นด้วยไอคอน 57px และรัศมี 10 จากนั้นปรับขนาดขึ้นหรือลงจากที่นั่น ดังนั้นคุณสามารถคำนวณรัศมีสำหรับขนาดไอคอนใด ๆ ที่ใช้10/57 x new size(ตัวอย่างเช่น10/57 x 114ให้ 20 ซึ่งเป็นรัศมีที่เหมาะสมสำหรับไอคอน 114px) นี่คือรายการของไอคอนที่ใช้บ่อยที่สุดแบบแผนการตั้งชื่อที่เหมาะสมขนาดพิกเซลและรัศมีมุม

1. Icon1024.png - 1024px - 179.649
2. Icon512.png - 512px - 89.825
3. Icon.png - 57px - 10
4. Icon@2x.png - 114px - 20
5. Icon-72.png - 72px - 12.632
6. Icon-72@2x.png - 144px - 25.263
7. Icon-Small.png - 29px - 5.088
8. Icon-Small@2x.png - 58px - 10.175

นอกจากนี้ตามที่กล่าวไว้ในคำตอบอื่น ๆ คุณไม่ต้องการครอบตัดรูปภาพใด ๆ ที่คุณใช้ในไบนารีหรือส่งไปยัง Apple สิ่งเหล่านั้นควรเป็นรูปสี่เหลี่ยมจัตุรัสและไม่มีความโปร่งใสใด ๆ Apple จะปิดบังไอคอนแต่ละอันโดยอัตโนมัติในบริบทที่เหมาะสม

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

อ่านเพิ่มเติม:

Neven Mrgan เกี่ยวกับขนาดไอคอนเพิ่มเติมและข้อควรพิจารณาในการออกแบบอื่น ๆ : ขนาดไอคอนของแอป ios

Bjango มาร์คเอ็ดเวิร์ดกับตัวเลือกที่แตกต่างกันสำหรับการสร้าง roundrects ใน Photoshop และทำไมมันเป็นเรื่องสำคัญ: RoundRect

เอกสารอย่างเป็นทางการของ Apple เกี่ยวกับขนาดไอคอนและข้อควรพิจารณาในการออกแบบ: ไอคอนและรูปภาพ

ปรับปรุง:

ฉันทำการทดสอบใน Photoshop CS6 และดูเหมือนว่า 3 หลักหลังจากจุดทศนิยมนั้นมีความแม่นยำเพียงพอที่จะจบลงด้วยเวกเตอร์เดียวกัน (อย่างน้อยก็แสดงโดย Photoshop ที่ซูม 3200%) เครื่องมือ Round Rect บางครั้งปัดอินพุตเป็นจำนวนเต็มที่ใกล้ที่สุด แต่คุณสามารถเห็นความแตกต่างที่สำคัญระหว่าง 90 และ 89.825 และหลายครั้งที่เครื่องมือ Round Rectangle ไม่ปัดขึ้นและแสดงตัวเลขหลายหลักหลังจุดทศนิยม ไม่แน่ใจว่าเกิดอะไรขึ้น แต่ใช้และเก็บหมายเลขที่แม่นยำยิ่งขึ้นที่ป้อน

อย่างไรก็ตามฉันได้อัปเดตรายการด้านบนเพื่อรวมตัวเลขเพียง 3 หลักหลังจุดทศนิยม (ก่อนที่จะมี 13!) ในสถานการณ์ส่วนใหญ่มันอาจเป็นการยากที่จะบอกความแตกต่างระหว่างไอคอนโปร่งใส 512px ที่ถูกปกคลุมด้วยรัศมี 90px และอีกหนึ่งหน้ากากที่ 89.825 แต่การลดรอยหยักของมุมโค้งมนจะสิ้นสุดที่แตกต่างกันเล็กน้อยและน่าจะปรากฏในบางสถานการณ์โดยเฉพาะ หากแอพพลิเคชั่นที่สองมีความแม่นยำมากกว่านี้ถูกใช้โดย Apple ในรหัสหรืออื่น ๆ

ฉันเห็นการอภิปรายจำนวนมาก "px" แต่ไม่มีใครพูดถึงเปอร์เซ็นต์ซึ่งเป็นจำนวนคงที่ที่คุณต้องการคำนวณ

22.37%เป็นเปอร์เซ็นต์สำคัญที่นี่ คูณขนาดภาพใด ๆ ที่กล่าวถึงข้างต้นด้วย 0.2237 และคุณจะได้รัศมีพิกเซลที่ถูกต้องสำหรับขนาดนั้น

ก่อน iOS 8 Apple ใช้การปัดเศษน้อยกว่าใช้ 15.625%

แก้ไข : ขอบคุณ @Chris Prince สำหรับการแสดงความคิดเห็นกับ iOS รัศมี 8/9/10 เปอร์เซ็นต์: 22.37%

สำคัญ: สมการไอคอน iOS 7

ด้วยการเปิดตัว iOS 7 ที่กำลังจะมาถึงคุณจะสังเกตเห็นว่ารัศมีไอคอน "มาตรฐาน" เพิ่มขึ้น ดังนั้นลองทำในสิ่งที่ Apple และฉันแนะนำด้วยคำตอบนี้

ปรากฏว่าสำหรับไอคอน 120px สูตรที่แสดงรูปร่างของมันได้ดีที่สุดใน iOS 7 คือ superellipse ต่อไปนี้:

|x/120|^5 + |y/120|^5 = 1

เห็นได้ชัดว่าคุณสามารถเปลี่ยน120จำนวนด้วยขนาดไอคอนที่ต้องการเพื่อรับฟังก์ชั่นที่เกี่ยวข้อง

เป็นต้นฉบับ

คุณควรให้ภาพที่มีมุม 90 ° (สิ่งสำคัญคือต้องหลีกเลี่ยงการครอบตัดมุมไอคอนของคุณ - iOS ทำเพื่อคุณเมื่อใช้รูปแบบการปัดเศษมุม) ( Apple Documentation )

วิธีที่ดีที่สุดคือไม่ปัดเศษมุมไอคอนของคุณเลย หากคุณตั้งค่าไอคอนเป็นไอคอนรูปสี่เหลี่ยม iOS จะวางซ้อนไอคอนโดยอัตโนมัติด้วยมาสก์ที่กำหนดไว้ล่วงหน้าซึ่งจะตั้งค่ามุมมนที่เหมาะสม

หากคุณตั้งค่ามุมโค้งมนด้วยตนเองสำหรับไอคอนของคุณพวกเขาอาจจะดูแตกในอุปกรณ์นี้หรือว่าอุปกรณ์เนื่องจากรูปแบบการปัดเศษมีการเปลี่ยนแปลงเล็กน้อยจากเวอร์ชัน iOS เป็นรูปแบบอื่น บางครั้งไอคอนของคุณจะใหญ่ขึ้นเล็กน้อยบางครั้ง (ถอนหายใจ) เล็กกว่าเล็กน้อย การใช้ไอคอนรูปสี่เหลี่ยมจะทำให้คุณเป็นอิสระจากภาระนี้และคุณจะต้องแน่ใจว่ามีไอคอนที่ทันสมัยและดูดีเสมอสำหรับแอปของคุณ

วิธีนี้ใช้ได้สำหรับขนาดไอคอนแต่ละขนาด (iPhone / iPod / iPad / retina) และสำหรับงานศิลปะ iTunes ฉันทำตามวิธีนี้สองสามครั้งและหากคุณต้องการฉันสามารถโพสต์ลิงก์ไปยังแอปที่ใช้ไอคอนรูปสี่เหลี่ยมดั้งเดิม

แก้ไข

เพื่อทำความเข้าใจคำตอบนี้โปรดดูที่อย่างเป็นทางการเอกสารเกี่ยวกับไอคอนแอปเปิ้ล iOS ในหน้านี้มีการระบุไว้อย่างชัดเจนว่าไอคอนรูปสี่เหลี่ยมจะได้รับสิ่งเหล่านี้โดยอัตโนมัติเมื่อแสดงบนอุปกรณ์ iOS:

1. มุมโค้งมน
2. เงา
3. เงาสะท้อน (ยกเว้นคุณป้องกันผลกระทบเงา)

ดังนั้นคุณสามารถทำเอฟเฟกต์อะไรก็ได้ที่คุณต้องการเพียงแค่วาดไอคอนสี่เหลี่ยมจัตุรัสและเติมเนื้อหาลงไป รัศมีมุมสุดท้ายจะเป็นสิ่งที่คล้ายกับคำตอบอื่น ๆ ที่นี่ แต่จะไม่รับประกันเนื่องจากตัวเลขเหล่านั้นไม่ได้เป็นส่วนหนึ่งของเอกสาร Apple อย่างเป็นทางการบน iOS พวกเขาขอให้คุณวาดไอคอนรูปสี่เหลี่ยมดังนั้น ... ทำไมไม่

ผู้คนโต้เถียงกันเกี่ยวกับรัศมีมุมที่เพิ่มขึ้นเล็กน้อย แต่จริงๆแล้วไม่ใช่ในกรณีนี้

จากบล็อกนี้ :

A 'ความลับ' ของผลิตภัณฑ์ทางกายภาพของ Apple ก็คือว่าพวกเขาหลีกเลี่ยงวง (ที่รัศมีตรงกับสายที่จุดเดียว) และงานฝีมือพื้นผิวของพวกเขาด้วยสิ่งที่เรียกว่าความต่อเนื่องทางโค้ง

คุณไม่จำเป็นต้องใช้รัศมีมุมกับไอคอนสำหรับ iOS เพียงแค่ให้ไอคอนสแควร์ แต่ถ้าคุณยังต้องการทราบวิธีรูปร่างที่แท้จริงเรียกว่าSquircleและด้านล่างเป็นสูตร:

คำตอบจาก dbarnard มีสูตรในการคำนวณรัศมีที่ถูกต้อง แต่เนื่องจากคุณกำลังมองหาแม่แบบมาสก์และภาพซ้อนทับทั้งหมดจึงสามารถพบได้ในไดเรกทอรีนี้:

/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator5.1.sdk/System/Library/PrivateFrameworks/MobileIcons.framework

(พา ธ สำหรับรุ่นล่าสุดของ XCode สำหรับรุ่นเก่ามันอาจจะอยู่ใน / Developer /)

ดังที่คนอื่น ๆ สังเกตไว้คุณไม่ควรปิดบังด้วยตนเอง แต่คุณสามารถใช้สิ่งเหล่านี้เพื่อตรวจสอบว่าไอคอนของคุณจะมีลักษณะอย่างไรเมื่อถูกหลอกลวง

(เครดิตสำหรับการค้นพบนี้ไปที่ Neven Mrgan IIRC)

รัศมีมุมของไอคอน 57 x 57 พิกเซลคือ 9 พิกเซล

อย่างที่คนอื่นพูดคุณไม่ต้องการปัดเศษ คุณต้องการจัดส่งกราฟิกสี่เหลี่ยมแบบแบน (ไม่มีเลเยอร์หรืออัลฟ่า) Apple เปลี่ยนหน้ากากที่ใช้ในการปัดเศษมุมของคุณใน iOS7 และจากนั้นอีกครั้งใน iOS8 คุณสามารถค้นหามาสก์เหล่านี้ได้ในชุดแอปพลิเคชัน Xcode ของคุณ เส้นทางจะเปลี่ยนไปด้วย SDK ใหม่ทุกเวอร์ชันที่วางจำหน่าย ดังนั้นฉันจะแสดงให้คุณเห็นว่าคุณจะพบมันได้อย่างไร

find /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs -name 'MobileIcons.framework'

ในขณะนี้เส้นทางที่พบโดยคำสั่งนั้น/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator.sdk/System/Library/PrivateFrameworks/MobileIcons.frameworkแต่ไม่ไว้ใจ ใช้คำสั่งเพื่อค้นหาด้วยตัวคุณเอง

พา ธ ดังกล่าวชี้ไปยังไดเรกทอรีพร้อมไฟล์เหล่านี้ (อีกครั้งในขณะที่โพสต์นี้)

./AppFolderBadgeIconMask-128_1only_.png
./AppFolderBadgeIconMask-16_1only_.png
./AppFolderBadgeIconMask-256_1only_.png
./AppFolderBadgeIconMask-32_1only_.png
./AppFolderBadgeIconMask-512_1only_.png
./AppFolderBadgeIconOverlay-128_1only_.png
./AppFolderBadgeIconOverlay-16_1only_.png
./AppFolderBadgeIconOverlay-256_1only_.png
./AppFolderBadgeIconOverlay-32_1only_.png
./AppFolderBadgeIconOverlay-512_1only_.png
./AppFolderBadgeIconShadow-128_1only_.png
./AppFolderBadgeIconShadow-16_1only_.png
./AppFolderBadgeIconShadow-256_1only_.png
./AppFolderBadgeIconShadow-32_1only_.png
./AppFolderBadgeIconShadow-512_1only_.png
./AppIconMask@2x~ipad.png
./AppIconMask@2x~iphone.png
./AppIconMask@3x~iphone.png
./AppIconMask~ipad.png
./AppIconMask~iphone.png
./CarAppIconMask.png
./CarNotificationAppIconMask.png
./DefaultIcon-20.png
./DefaultIcon-20@2x.png
./DefaultIcon-20@3x.png
./DefaultIcon-29.png
./DefaultIcon-29@2x.png
./DefaultIcon-29@3x.png
./DefaultIcon-40.png
./DefaultIcon-40@2x.png
./DefaultIcon-40@3x.png
./DefaultIcon-60@2x~iphone.png
./DefaultIcon-60@3x~iphone.png
./DefaultIcon-76@2x~ipad.png
./DefaultIcon-76~ipad.png
./DocumentBadgeMask-145.png
./DocumentBadgeMask-145@2x.png
./DocumentBadgeMask-20.png
./DocumentBadgeMask-20@2x.png
./DocumentBadgeMask-20@3x.png
./DocumentBase-320@2x~ipad.png
./DocumentBase-320~ipad.png
./DocumentBase-48.png
./DocumentBase-48@2x.png
./DocumentBase-48@3x.png
./DocumentMask-320@2x~ipad.png
./DocumentMask-320~ipad.png
./DocumentMask-48.png
./DocumentMask-48@2x.png
./DocumentMask-48@3x.png
./NanoDefaultIcon-24.0@2x.png
./NanoDefaultIcon-27.5@2x.png
./NanoDefaultIcon-40.0@2x.png
./NanoDefaultIcon-44.0@2x.png
./NanoDefaultIcon-86.0@2x.png
./NanoDefaultIcon-98.0@2x.png
./NanoIconMaskChiclet-24.0@2x.png
./NanoIconMaskChiclet-27.5@2x.png
./NanoIconMaskChiclet-40.0@2x.png
./NanoIconMaskChiclet-44.0@2x.png
./NanoIconMaskChiclet-86.0@2x.png
./NanoIconMaskChiclet-98.0@2x.png
./NewsstandDefaultMagazine_1only_.png
./NewsstandDefaultNewspaper_1only_.png
./NewsstandMagazineGradientLeft@2x~ipad.png
./NewsstandMagazineGradientLeft@2x~iphone.png
./NewsstandMagazineGradientLeft~ipad.png
./NewsstandMagazineGradientLeft~iphone.png
./NewsstandMagazineGradientRight@2x~ipad.png
./NewsstandMagazineGradientRight@2x~iphone.png
./NewsstandMagazineGradientRight~ipad.png
./NewsstandMagazineGradientRight~iphone.png
./NewsstandMagazineSwitcherGradientLeft.png
./NewsstandMagazineSwitcherGradientLeft@2x.png
./NewsstandNewspaperGradientBottom@2x~ipad.png
./NewsstandNewspaperGradientBottom@2x~iphone.png
./NewsstandNewspaperGradientBottom~ipad.png
./NewsstandNewspaperGradientBottom~iphone.png
./NewsstandNewspaperGradientLeft@2x~ipad.png
./NewsstandNewspaperGradientLeft@2x~iphone.png
./NewsstandNewspaperGradientLeft~ipad.png
./NewsstandNewspaperGradientLeft~iphone.png
./NewsstandNewspaperGradientRight@2x~ipad.png
./NewsstandNewspaperGradientRight@2x~iphone.png
./NewsstandNewspaperGradientRight~ipad.png
./NewsstandNewspaperGradientRight~iphone.png
./NewsstandNewspaperSwitcherGradientBottom.png
./NewsstandNewspaperSwitcherGradientBottom@2x.png
./NewsstandNewspaperSwitcherGradientLeft.png
./NewsstandNewspaperSwitcherGradientLeft@2x.png
./NewsstandNewspaperSwitcherGradientRight.png
./NewsstandNewspaperSwitcherGradientRight@2x.png
./NewsstandThumbnailShadow@2x~ipad.png
./NewsstandThumbnailShadow@2x~iphone.png
./NewsstandThumbnailShadow~ipad.png
./NewsstandThumbnailShadow~iphone.png
./NotificationAppIconMask.png
./NotificationAppIconMask@2x.png
./NotificationAppIconMask@3x.png
./SpotlightAppIconMask.png
./SpotlightAppIconMask@2x.png
./SpotlightAppIconMask@3x.png
./TableIconMask.png
./TableIconMask@2x.png
./TableIconMask@3x.png
./TableIconOutline.png
./TableIconOutline@2x.png
./TableIconOutline@3x.png

อย่างที่คุณเห็นมีหน้ากากแตกต่างกันมากมาย แต่มีชื่อค่อนข้างชัดเจน นี่คือAppIconMask@3x~iphone.pngภาพ:

คุณสามารถใช้มันเพื่อทดสอบไอคอนของคุณเพื่อดูว่ามันจะดูโอเคหลังจากที่ถูกหลอกลวง แต่ไม่ได้รอบมุมของคุณ หากคุณทำเช่นนั้นเมื่อ Apple เปลี่ยนมาสก์เหล่านั้นอีกครั้งคุณจะมีสิ่งประดิษฐ์

คำตอบก่อนหน้านี้สำหรับคำถามนี้ทั้งหมดล้าสมัยแล้ว ตั้งแต่อย่างน้อยพฤษภาคม 2015 Apple ต้องการให้คุณแสดงไอคอนรูปสี่เหลี่ยมโดยไม่มีการปัดเศษ:

เก็บมุมของไอคอนสี่เหลี่ยม ระบบใช้รูปแบบที่ปัดมุมไอคอนโดยอัตโนมัติ

https://developer.apple.com/ios/human-interface-guidelines/graphics/app-icon/

หากไม่พิจารณาจังหวะนั้นรัศมีที่แน่นอนคือ 10px สำหรับไอคอน 57x57

ผมได้รับข้อมูลนี้จากiconreference

เมื่อมีการออกแบบไอคอน app ของฉันกับ Photoshop, ฉันได้พบว่าไม่มีรัศมีมุมจำนวนเต็มเหมาะกับหน้ากากของอุปกรณ์ว่าว่า

สิ่งที่ฉันทำตอนนี้คือการสร้างโครงการว่างเปล่าด้วย Xcode ตั้งไฟล์ PNG สีขาวอย่างสมบูรณ์เป็นไอคอนและปิดมุมเอียงและเงาที่ตั้งไว้ล่วงหน้า จากนั้นฉันเรียกใช้แอพและจับภาพหน้าจอของหน้าจอหลัก ตอนนี้คุณสามารถสร้างหน้ากากจากรูปภาพนั้นซึ่งคุณสามารถใช้ใน Photoshop ได้อย่างง่ายดาย นี่จะทำให้คุณได้มุมที่โค้งมนอย่างสมบูรณ์แบบ

iphone อยู่ที่มุมสำหรับคุณสิ่งที่คุณต้องมีคือไอคอนรูปสี่เหลี่ยมจัตุรัสขนาด 57x57 และคุณน่าจะดี

มีคำตอบที่ขัดแย้งกันทั้งหมดสองคำโดยมีคะแนนเสียงเป็นจำนวนมาก 160px @ 1024 อีกคำตอบคือ 180px @ 1024 ดังนั้นแม่มด?

ฉันทำการทดลองบางอย่างและฉันคิดว่ามันเป็น 180px @ 1024 ดังนั้น drbarnard นั้นถูกต้อง

ฉันดาวน์โหลดไอคอน iTunes U จาก App Store มันเป็น 175x175px ฉันยกระดับสัญญาณลงใน photoshop เป็น 1024px และวางรูปทรงสองรูปไว้หนึ่งอันมีรัศมี 160px และอีกอันหนึ่งมี 180px

ดังที่คุณเห็นด้านล่างรูปร่าง (เส้นสีเทาบาง) ที่มี 160px (อันที่ 1) ปิดเล็กน้อยในขณะที่อันที่ 180px นั้นดูดี

นี่คือสิ่งที่ฉันทำตอนนี้ใน PhotoShop:

1. ฉันจะสร้างผืนผ้าใบขนาด1026x1026px กับ 180pxหน้ากากสำหรับการออกแบบหลักของสมาร์ทวัตถุ
2. ฉันทำซ้ำ Smart Object หลัก 5 ครั้งและปรับขนาดเป็น 1024px, 144px, 114px, 72px และ 57px
3. ฉันวาง "New Layered Based Slice" ใน Smart Objects แต่ละรายการและฉันเปลี่ยนชื่อชิ้นตามขนาด (เช่นไอคอน -72px)
4. เมื่อฉันบันทึกงานศิลปะฉันเลือก "All User Slice" และ BANG! ฉันมีไอคอนทั้งหมดที่จำเป็นสำหรับแอพของฉัน

ฉันลองรัศมี 228px สำหรับ 1024x1024 และใช้งานได้ :)

อัปเดต (ณ วันที่ 2018 มกราคม) สำหรับความต้องการของไอคอนแอป:

https://developer.apple.com/ios/human-interface-guidelines/icons-and-images/app-icon/

เก็บมุมของไอคอนสี่เหลี่ยมให้มุมไอคอนตารางระบบใช้รูปแบบที่ปัดมุมไอคอนโดยอัตโนมัติ

เก็บง่ายพื้นหลังและหลีกเลี่ยงความโปร่งใส ตรวจสอบให้แน่ใจว่าไอคอนของคุณทึบแสงและไม่เกะกะพื้นหลัง ให้ภาพพื้นหลังที่เรียบง่ายดังนั้นจึงไม่สามารถเอาชนะไอคอนแอปอื่น ๆ ที่อยู่ใกล้เคียง คุณไม่จำเป็นต้องเติมเนื้อหาลงในไอคอนทั้งหมด

คุณไม่จำเป็นต้องใช้รัศมีมุมกับไอคอนแอปของคุณคุณสามารถใช้ไอคอนสี่เหลี่ยมได้ อุปกรณ์ใช้รัศมีมุมโดยอัตโนมัติ