Discussion Forums  >  Uncategorized

Replies: 3    Views: 755

birwin
Lost but trying
Profile
Posts: 93
Reg: Dec 29, 2010
location unknow...
3,080
03/13/11 06:17 PM (14 years ago)

iPhone Retina Display button menu tips? v1.5

Hello, I am starting to create a button-based menu in v1.5. I would like to use images for the buttons and add them to the images folder in the xcode project. Are there specific considerations for creating these button images for the iPhone 4's Retina Display? Do I need to create the button twice the intended size so it doesn't look pixelated in the Retina display? Thanks in advance for any insight. Best Regards
 
David @ buzztouch
buzztouch Evangelist
Profile
Posts: 6866
Reg: Jan 01, 2010
Monterey, CA
78,840
like
03/13/11 09:46 PM (14 years ago)
You should be OK with one set of buttons for all the 'small' iOS devices. Most folks create an iPhone set and an iPad set. Experiement a bit by using URL's for the button background images, with no 'icon' on top of the background. Apply some rounded corners if you want. Generally, 72 X 72 wors well for buttons but we've seen HUGE and tiny buttons too, kinda depends on the effect your after. Also, the right buttons on top of a good background image makes a huge difference (professional). If you're creating the buttons yourself in say Photoshop or something, then you have the luxury of using the original files. This is the biggest different between high-quality apps and amatuer looking apps - stunning artwork makes a huge different. Make some high-density 72 x 72 buttons and they will look really nice.
 
birwin
Lost but trying
Profile
Posts: 93
Reg: Dec 29, 2010
location unknow...
3,080
like
03/14/11 09:18 AM (14 years ago)
Hello David, Thanks for the tips!! Photoshop has some great tools for creating buttons. Lots of templates and actions can be downloaded as well. According to Google searches, the optimum dpi for iPhone 3g/gs in-app buttons is 163 dpi, and 4g retina is 326 dpi. I have just tried this out and it made a big difference in the quality and scaling of the graphics. 163 dpi actually works fine for 4g retina in many cases. I had been creating 72 dpi graphics (PNG) for buttons and was running into some quality issues. For those Mac Users that don't have Photoshop, Art-Text is a good/cheaper alternative for creating custom buttons. Thanks again!
 
icedbreeze
I hate code!
Profile
Posts: 123
Reg: Nov 09, 2010
London
1,230
like
03/14/11 09:34 AM (14 years ago)
Just in reference to the difference between the 4G and 3GS phones, I am developing my app on a 3GS however it will obviously need to look beautiful on a 4G too! I have the correct dimensions of backgrounds/icons etc... Im just having a problem scaling the background image down. I want both phones to have the same background but the 4G will have a cripser image. So in hind sight I am building a 4G App on a 3GS phone. Any idea how I could change the scaling of the image? Thanks.
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.