Discussion Forums  >  Plugins, Customizing, Source Code

Replies: 12    Views: 61

Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
02/26/13 10:10 AM (12 years ago)

Making Artwork work with iPhone 4 and 5?

Okay so normally I wouldn't do it this way, but it bugs me that this doesn't work. So I've made a Simple Menu and made the menu background clear the cell background clear, i've deleted the text in the menu cells. So this basically leaves a blank page, i've then loaded my artwork in originally designed for the iPhone 5 screen i've created the artwork to make parts look like buttons, these align up superbly with the simple menu (after I've adjusted cell height etc.) But as soon as change the sim to iPhone 4 obviously the artwork changes and so does the simple menu placement. Does anyone else find this frustrating? Obv I've had to resorted to just programming through xcode using the storyboard feature which allows snapping etc. Just wondering weather anyone else had had any issues with this? Or even better has a work around? This will be my 6th App on the Store and I already have 3 B2B Apps. (I still really love working with Buzztouch)
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
02/26/13 10:27 AM (12 years ago)
Hi Nick. I find the iPhone 5 screen a little annoying for artwork as well. I think you'll need to make the background image go to the top-middle of the page (you just need to have the right size of image) and then it should work on iPhone 3.5 inch, and extra content will load for iPhone 4inch (iPhone 5). Did you manage to get down to Oxford in the end? If you did, sorry you couldn't find us. Maybe next time.
 
Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
like
02/26/13 10:38 AM (12 years ago)
Sorry bud i didn't make it down! Had a bit of a crazy weekend with family. so what resolution do you set your artwork at? I run it through photoshop and even on 72 PPI if you use centre or Top Middle it totally blows the artwork out of proportion.
 
Dragon007
Lost but trying
Profile
Posts: 1509
Reg: Dec 17, 2011
London
20,590
like
02/26/13 10:47 AM (12 years ago)
For sharper graphics, do you are artwork at 3 times the size, the use 'Save to Web' and resize the graphic to the dimensions you wanted. This preserves the quality. If you create your artwork at the actual size then save for web afterwards it reduces the quality way to much in my view. As for your other problem, can't really help, useless at code.
 
Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
like
02/26/13 10:48 AM (12 years ago)
Sorry bud i didn't make it down! Had a bit of a crazy weekend with family. so what resolution do you set your artwork at? I run it through photoshop and even on 72 PPI if you use centre or Top Middle it totally blows the artwork out of proportion.
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
02/26/13 10:51 AM (12 years ago)
You will need to make the background to fit the exact size of the screen, so distortion doesn't happen. You should also have another image of the iPhone without retina (3.5 inches). Here are the dimensions you need to have: iPhone 5: 1136-by-640-pixel resolution at 326 ppi iPhone 3GS/3G/2G: 480-by-320-pixel resolution at 163 ppi The iPhone 4/4s will just use the iPhone 5 display, because it already has the retina quality.
 
Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
like
02/26/13 10:51 AM (12 years ago)
Cheers @Dragon007 Great advice! I'll give it a go now, never even thought to use 'Save to Web'.
 
Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
like
02/26/13 10:54 AM (12 years ago)
Yeah I have all the resolutions blue tacked to my wall just next to my mac lol. Just tried the save to web function... works perfecto. Gracias.
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
02/26/13 01:24 PM (12 years ago)
Completely off topic, but Nick, if I ever write a novel, I want to use your name as the main characters name. It sounds so cool! "Nick Langley, Private Eye" :) Cheers! -- Smug
 
Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
like
02/27/13 02:14 AM (12 years ago)
Do you think? There was a kid at Uni called 'Max Hunt' I always thought that was a good name. Anyways I've come back on this topic this morning, its playing up again... @Dragon007 when you set up the canvas what settings do you use, dimensions, PPI etc. Im using Save to web and its not working now!? lol -Nick
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
02/27/13 04:42 AM (12 years ago)
With respect to Android, it's all over the map, although I typically follow these guys... http://coding.smashingmagazine.com/2011/06/30/designing-for-android/ But since you've said iPhone, the images you'll want will be jpg or png (I use png, but there are arguments for/against either one) iPhone 3GS should be 320 x 640 72dpi iPhone 4 should be 640 x 980 72dpi iPhone 5 should be 640 x 1136 72dpi I'd swear I saw a document outlining those sizes, and those of the iPad too, but for the life of me I can't recall where... Cheers! -- Smug
 
Nick Langley
Apple Fan
Profile
Posts: 288
Reg: May 08, 2012
Birmingham, Uni...
11,580
like
02/27/13 05:03 AM (12 years ago)
Hum perhaps it's a problem with my photoshop. I make a document with the correct size and correct dpi or ppi depending which way round you go. Typically I'll design for the iPhone 5, then just do something with the last 156 pixels that you lose on the 4. For some reason when I save as a png or for the Web as Dragon007 suggested and then run it through Buzztouch it blows the artwork up on the device until I use 'full screen' or 'full screen preserve ratio' Not sure whats happening -Nick
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
02/27/13 02:44 PM (12 years ago)
You will want to preserve the ratio, but you don't want the "Full Screen" options. This is because the middle of the screen is the middle of the background, which changes from each device. You'll want "Top Middle" and make the screen images exactly to the size of the screen Did Apple have to do this to us (sigh)?
 

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.