Skip to main content
vasanthakumar L
vasanthakumar L
Known Participant
July 6, 2017
Question

UI Design For Ipad Dimension

  • July 6, 2017
  • 6 replies
  • 5159 views

Hi Guys,

I want to create UI Design/Mock-up for Ipad (7 inches). How do I measure the actual pixel for Ipad dimension and what is the difference between resolution and dimension (Width-Height).

Thanks,

Vasanth

    This topic has been closed for replies.

    6 replies

    Derek Cross
    Community Expert
    Derek CrossCommunity Expert
    Community Expert
    July 10, 2017

    There you have the answer Vasanthakumar, from one of the world's leading experts on the subject!

    Keith_Gilbert
    Keith_Gilbert
    Inspiring
    July 10, 2017

    As others have said, the physical dimensions and resolution of any device (iPad, phone, etc.) are irrelevant. Only the total dimensions in pixels are important. Specifically, both the latest iPad and iPad Mini models have a resolution of 2048 x 1536 pixels. The resolution of the iPad Pro models are different, but at least the 4:3 aspect ratio of ALL iPad models is the same, so content scales nicely from one iPad to the next.

    I assume that you are mocking up UI elements in Photoshop, and then handing the designs off to a developer. If the developer is going to carve the design up into final bitmap icons and other elements from your source files, creating your file at 2732 x 2048 would be safest, as the developer would be able to generate high-quality icons from that file for ALL iPads. But if you are only concerned about the iPad Mini, then 2048 x 1536 will be just fine.

    T
    Test Screen Name
    Legend
    July 7, 2017

    Here is a tutorial on zooming in Photoshop Zooming And Panning In Photoshop

    T
    Test Screen Name
    Legend
    July 6, 2017

    If it's a UI a good developer will have the content adapt. A UI is not a picture...

      Derek Cross
      Community Expert
      Derek CrossCommunity Expert
      Community Expert
      July 6, 2017

      Don't produce content for a specific device as there are many and they are all different. Produce it for the best and let the content scale and/or letterbox for the rest.

      Derek Cross
      Community Expert
      Derek CrossCommunity Expert
      Community Expert
      July 6, 2017

      I suggest you create your page for an iPad at 2048 x 1536 px this will work well on a retina screen. Resolution is irrelevant in this context.

        vasanthakumar L
        vasanthakumar LAuthor
        Known Participant
        July 6, 2017

        Thank you Derek Crose.

        But I still confusing what is the actual dimension (width & height) for 7 inch Ipad tablet because i can't understand difference between the Resolution and Dimension.

        Finally this UI design/mock-up will given to the tech team. They will need measurement of the each and every object sizes in pixels (Buttons,icons,...) like style guide. Are you sure I follow this pixel 2048 x 1536 for 7 Inch Ipad tablet?

        Thanks,

        Vasanth

        T
        Test Screen Name
        Legend
        July 6, 2017

        Forget the size in inches. This is of no importance. Only the size in pixels is important. If you want to see it at a different size in screen use ZOOM, please ask if you do not know how to do this.

        Each iPad model has different size in pixels. Make sure you are using the right size. Many web site have this unformation eg iOS Quick Reference for iPhone, iPad, and Apple Watch

          Terms & ConditionsAccessibility statement
          Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices