Under the Bridge

Icon template

[UPDATE: Now points to the iPhone 4 savvy version!]

Here’s a handy template for your iPhone and iPad icon design needs:

ists
iPhone-4-icon-PSD.png

- 512 pixels, iTunes Store style (Caution: very ugly. Talk to Apple about that, not me.)


- 512 pixels, iPad style (either have different overlays. Who’d have thought?)


- 512 pixels, iPhone style.


- 72 pixels for iPad home screen.


- 57 pixels for iPhone home screen.


[UPDATE: -114 pixels for iPhone 4 home screen!]

- 48 pixels for iPad Spotlight (with Spotlight background).


- 29 pixels for iPad / iPhone Settings and iPhone Spotlight (with both backgrounds).

Yes, it is getting complicated these days, isn’t it?

h/t: MacFanatic!

UPDATE:

And here is a post about another icon template for Illustrator CS 5; and if you’re wondering about appropriate sizes for icons for Android, Linux, Windows, Safari, or anything else, check out their

Icon Reference Chart

And here is a script, iPhone-Photoshop-JSX-Icon-Exporter, to create all the needed sizes from one 512×512 icon.

And here is iOS Icon Template for Perfectionists, reputedly correcting a corner issue with the above template.

And finally, QA1686 App Icons on iPad and iPhone is where you should go for the current Final Word™!

Continue Reading →
1

Data Entry Screens

Here’s a worth reading post on how to make data entry screens that center the current entry field above the keyboard by simply using a UIScrollView, instead of the mess of hardcoded animation blocks that we’ve been using up ’til now:

How To Create A Data Entry Screen

Couple problems with the code as presented, but read to the end of the comments and apply the keyboard notification responses there and you’re just about good!

Continue Reading →
1

Tip: UINavigationBar Background

So you’ve got this design from the artists for your new navigation-based app, and they want the navigation bar to look exactly like the artwork, a close gradient just doesn’t cut it. What to do? What to do? And if you look around, there are a number of suggestions on how to accomplish this, which are mostly overly complicated and in some places just plain wrong.

But, assuming that all the bars in the app are supposed to look the same which is most likely a safe assumption, why indeed there is an extremely simple way — just make a category to override UINavigationBar’s -drawRect! Easy once you think of it, indeed. And set the bar’s tint color appropriately for your image there too and buttons will respect that; so in our case here, the simple category

@implementation UINavigationBar (TWXUINavigationBar)
- (void)drawRect:(CGRect)rect
{
UIImage *img  = [UIImage imageNamed: @"customnavigationbar.png"];
[img drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
UIColor *topColor = [UIColor colorFromHexValue:0x910011];
self.tintColor = topColor;
}
@end

where the tint color was taken from the top pixel of the .png file, results in

tintedbar.png

Very nice looking, yes? Now that’s a seriously easy way to satisfy those picky artistic types!

Continue Reading →
2

UITableViewCell from nib warning

If you’ve been reading for a while you might recall this post about loading your UITableViewCell layout from a nib. Or perhaps you stumbled across that somewhere else, or even came up with it on your own; well, if you have been doing that, turns out there’s an additional wrinkle you need to be aware of:

… The key here is that the CellIdentifier value must also be entered into Interface Builder, like this:

UITableViewCell-Identifier.png

If you don’t do this, then UITableViewCells will not be reused. (A telltale sign of this is that you’ll see lots of “creating a new cell” log messages.) There is no compiler or runtime warning if you fail to enter this critical piece of information into Interface Builder. So that log statement can be a useful warning…

Yes. Yes, indeed, if you have several thousand items in your list, and you’re loading directly from the nib each time, that could be very very bad. Be careful out there!

Continue Reading →
2

Compleat UI Design

OK, we’ve mentioned various UI design helpers here and there before: but this, this is veritably canonical.

iPhone and iPad Development GUI Kits, Stencils and Icons

Within this post you will find complete GUI kits and stencils, iPhone GUI elements and PSDs and finally a collection of the best icon-sets perfectly suited for the iPhone…

Right up to date with the iPad GUI PSD we mentioned a little while ago, so looks like that’s the best current reference to point your Photoshop-using artist friends at.

h/t: @mattgemmell!

UPDATES:

How about Apps-on: Post-It notes for your iPhone design? (h/t: iPhoneFlow!)

Or MobileSketchbook.com’s iPad Stencil, to go with their iPhone version?

Or just download some iPad & iPhone Sketch Paper PDFs.

Or try iPhone Wireframe Kit – Google Docs online.

Like to do your prototyping on the actual phone? Check out Dapp.app.

And here’s a newer roundup: 11 UI Kits for iPhone and iPad Development!

And one to start out 2011: 50 Free iPad, Iphone Icons, Tutorials and PSDs

These Keynote/Powerpoint templates look interestlng: Keynotopia

This presentation/prototyping tool could be good for client work: Realizer

20 Free UI Kits For iPad Development

iOS 5 GUI PSD (iPhone 4S)

Useful Collection of iOS Tools and Resources for Designers

30+ tips to improve your iOS design workflow (in Photoshop)

Rounded Rectangle Radius Resizer

Continue Reading →
1

Libraries & Frameworks

So if you’ve tried to create static libraries and/or frameworks to share between your iPhone and desktop app versions, no doubt you have noticed that the process is fraught with peril, to put it mildly. Here are a couple of fine tutorials to help you out with that:

Universal Static Libraries

Making Your Own iPhone Frameworks

We’d manage to puzzle out non-universal static libraries on our own, but the frameworks, ah now that is the really tricky bit. We do rather like the closing comment

… I find this whole thing really fascinating and once you understood the parts to the whole process it does not feel that difficult any more …

Well, we’ll agree that following the provided instructions isn’t that difficult, yes. Compared to how difficult it should be to do this, that’s another story!

Continue Reading →
1

Google Analytics

So chances are that you have some vague awareness of Google Analytics, even if only at our level of click, click, and there’s Google Analyticator plugged in and doing its magic of letting us know that you, you average person you, view 1.30 pages/visit during your 00:01:43 average time on site, and other such utterly not fascinating trivia which presumably there might be some reason we might care about someday.

But whatever, it’s more interesting to get some feedback on how people are using your app, and if you want to use Google Analytics for that too, here is a very nicely detailed walkthrough for you:

How To Integrate Google Analytics Tracking Into Your Apps In 7 Minutes

Of course, we would be remiss to not promptly point out that you may not want to do that at all, as the other big change in the latest Developer Agreement that most Flash-fixated fellows have forborne to comment upon so you might have missed, is

… Device Data may not be provided or disclosed to a third party without Apple’s prior written consent. Accordingly, the use of third party software in Your Application to collect and send Device Data to a third party for processing or analysis is expressly prohibited…

It’s not 100% clear what exactly qualifies as “Device Data” … but we’ll be sure to keep you as top on it as we are!

h/t: iPhone OS Development Blog!

Continue Reading →
5

Fake iPad Photos

Here’s a handy trick for putting together your iPad app promos:

Maybe you’ve wondered how it’s possible that some people (like Panelfly or even us) have photos of iPads with their apps in them weeks before the devices arrive to the market.

Well, the trick is to take the official photos by Apple and replace the screen content. It’s not difficult but a little tedious, especially getting the perspective transforms right. To save time and effort you can use this Photoshop template that does all the work you. Replace the placeholder images with your screenshots and you’re done!

Continue Reading →
0

Flash on iPhone

Okay, all you Flash-lovers, this one is for you.

Flash on iPhone is now a possibility. Sort of.

The Gordon JS library aims to provide a javascript interpreter to replace the Adobe Flash runtime. The advantage is existing Adobe Flash documents will bypass the Flash runtime itself (which is what is banned from the AppStore) and instead directly execute through Javascript, which is allowed…

All our best with that!

Continue Reading →
0

100 iPhone App Websites

Here’s a great collection of iPhone application sites to look at for design inspiration, or just to check out some nifty apps you probably haven’t heard of:

100 Wonderfully Designed iPhone App Websites

h/t: Queness!

UPDATE: OK … apparently this is more of a thing than we realized, collecting pretty iPhone websites. More for you:

40 of the Most Stunning iPhone Developer Websites

異常なほどカッコいい27のiPhone iPod touchアプリ “Website”

UPDATE 2: … and here’s another collection:

43 Amazing Iphone Application Websites

UPDATE 3: … and a couple more:

A Showcase Of Sites For iPhone Apps

iPhone App Sites #2

UPDATEST:

49 CREATIVE IPAD APPLICATION WEBSITES

30 Creative iPhone Application Websites Collection

40 Awesome iPhone Application Websites

60 Astonishing iPhone Application Websites For Design Inspiration

40+ Amazing Iphone Application Websites

Best Designed iPhone Application Websites for Inspiration

50 Classy iPhone Application Websites

Top 10 Amazing iPhone Application Websites

20+ Amazing iPhone App Websites

Design Trends: 25 Of The Coolest iPhone APP Website Designs

BEST DESIGNED IPHONE APPLICATION WEBSITES

30 Effective and Way Cool iPhone App Websites

80 Best iPhone Application Websites

iPhone App Sites #3

25 iPhone app website designs

12 Eye-Catching iPhone App Websites: Plus Resources to Start your own

63 Great examples of app site design

60 Amazing iPhone Application Websites For Design Inspiration

Continue Reading →
2
Page 70 of 118 «...4050606869707172...»