I've spent the last 3 or 4 weeks creating assets for iPhone (with Retina display) and Android. Here's how I approach it.
1) Don't create your original files in Photoshop if at all possible. Use Illustrator or a similar vector too. Fireworks would be acceptable if you don't have Illustrator. 2) Create the files at the appropriate pixel dimension, 480x800, at the correct dpi, then copy them into Photoshop as a smart object (this keeps it vector, and therefore resizeable). 3) Working with the iPhone3GS- and iPhone 4 is tough, keeping all those different sizes in mind, but working with Android would be a pain in the a$$. andy -----Original Message----- From: Rick Faircloth [mailto:r...@whitestonemedia.com] Sent: Sunday, January 23, 2011 1:19 PM To: cf-talk Subject: (ot) Creating Smartphone Graphics Sorry for the OT, but I have searched everywhere trying to find a definitive answer that actually works in practice. I'm getting into mobile development and one of my first goals has been to figure out how to create site graphics. I use Photoshop, and I'm asking, "What's the best way to set up my blank files to work on? 72ppi with the appropriate pixel dimensions?" (I have a Samsung Fascinate, so the screen size is 480x800 pixels, 233 ppi) Most of what I've read states it doesn't matter what ppi your work in. That doesn't hold up in practice, however. Here's a test case: http://www.wsm-dev.com/wsmDev/mobileDevelopment/graphicsTesting/index.cfm You can see from the display the various ppi's that I used for the graphics. The only one that looks like what I'm trying to create on the smart phone screen is the bottom graphic of the word "Hurricane." That was created on a canvas size of 2.5 inches x 4.18 inches, the size of the Fascinate Screen (according to reviews), with a screen resolution of *300 ppi* !!! Since the Fascinate's ppi actually works out to 233 ppi, I thought the top graphic would be the most accurate in the display. But even it was too small. These graphics are not given a size in the HTML. I upped the ppi to 300 for the bottom example and it turns out to be the most accurate! I just don't get this. I've worked with graphics for over a decade, for the web and print, but trying to figure out smartphone screens is beyond my comprehension to this point. I'd like to set up my blank file in Photoshop at whatever screen size is appropriate (in this case 480x800) and create graphics on that at whatever ppi gives the correct size and quality. But so far, nothing makes sense. Would someone who has experience with creating graphics for smartphone screens *please* explain to me what is going on with this???? Thanks for any feedback! Rick ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~| Order the Adobe Coldfusion Anthology now! http://www.amazon.com/Adobe-Coldfusion-Anthology/dp/1430272155/?tag=houseoffusion Archive: http://www.houseoffusion.com/groups/cf-talk/message.cfm/messageid:341114 Subscription: http://www.houseoffusion.com/groups/cf-talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/groups/cf-talk/unsubscribe.cfm
