App Designs (not looking for a designer, just a simple question)

Discussion in 'iOS Programming' started by lasash, Oct 8, 2012.

  1. lasash macrumors member

    Joined:
    Sep 15, 2012
    #1
    s3 vHello dear forum,

    You have helped me a lot (dejo, chown33 and of course the incredible CodeBreaker) with my struggle to program my first iPhone app, and I am very grateful for that.

    I have successfully finished my first app, but one things remains:
    it all looks black and white, because I have no idea in designing.

    I also don't want to have any idea in designing, I prefer to pay a professional.

    But, I am wondering, when I come to a web designer for example, what are the specs I should tell him?

    1. 320 x 460 iPhone screen? But now we have the iPhone 5 with a different height. iPad 2 has 1024x768 dimensions.
    2. How can you make a button change it's width, without making a different size for each button (that would be insane)? I am talking about buttons like in WhatsApp app (i.e. Call, Edit, Info, Load Earlier Messages)
    3. What about Universal apps? How can one design a fluid design?

    In short, do all the custom objects in apps are images (jpg / png)?

    I know that in web programming we use CSS and images, but the CSS allows us to modify and stretch things. How can this be done with Xcode?

    Thanks all for your help and support,
    I appreciate that A LOT!
     
  2. Duncan C macrumors 6502a

    Duncan C

    Joined:
    Jan 21, 2008
    Location:
    Northern Virginia
    #2

    Have your designer think in points, not pixels. A point is 1/72 of an inch. Your designer should create 2 versions of all your app art: regular resolution, where 1 point is 1 pixel, and retina resolution, where 1 point = 2 pixels.

    If you have a button background called aButton.png, that's 100x70 points in size, the designer should also give you another image aButton@2x.jpg, that has twice as many pixels (200x140 pixels.) The two images will display at the same screen size, but the one with the @2x version will look crisper and cleaner on Retina devices.

    As for screen layout, the Retina 4 inch devices (iPhone 5 and newest touch) are somewhat taller than the standard iPhone screen. Tell your designer to plan designs that work for both screen sizes, and describe how things are mapped for resizing. You can make views pin to the left/right/top/bottom of the screen while staying fixed size, resizing proportionally to the change in screen size, or resizing to completely occupy all the extra screen size. This is the "struts and springs" that you get in Interface builder.

    You also nee to think through auto-rotation carefully. Some screen layouts rotate between portrait and landscape well, and others don't. Decide which orientations make sense, and how you can juggle your contents to fit the different orientations.

    iPad is a horse of a different color. It usually makes sense to re-think your UI for iPad. Things that need to be on separate screens can be combined on iPad, and iPad offers some extra controls like Popovers and split view controllers.

    However, these are things you should plan for when you are first designing your app, not at the end.
     
  3. dejo, Oct 8, 2012
    Last edited: Oct 8, 2012

    dejo Moderator

    dejo

    Staff Member

    Joined:
    Sep 2, 2004
    Location:
    The Centennial State
    #3
    Also, you can do stretchable images through the use of capInsets. Makes multi-size or dynamically-sized buttons much easier.
     

Share This Page