iOS 7 Tip: How to make your own Parallax Wallpaper [Video Walkthrough]

parallax-100043713-large

Apple added a very cool 3D parallax effect to the iOS 7 Home screen and Lock screen, which lets you look at what’s “behind” your home screen icons when you tilt your iOS device. Details of how the effect work are laid out in this post, but its basically iOS magnifying your wallpaper to give it space to move around when you tilt your device.

To make the 3D parallax effect look even better, you can use a slightly higher-res image so that when iOS zooms into the image to create the extra margins to move around, the image pixels end up being mapped 1:1 on the screen.

Here’s the demo of the parallax wallpaper in action:

The folks at Trusted Reviews did the math, and it turns out that for wallpapers to look perfect with the parallax effect, you need to add 200px extra on each side of the image. Here are the sizes you require as per your device:

  • iPad 2 and iPad mini: 1,424 x 1,424
  • iPad 3 and iPad 4: 2,448 x 2,448
  • iPhone 4S: 1,360 x 1,040
  • iPhone 5: 1,536 x 1,040

Note that the iPhone 4 doesn’t support 3D parallax wallpapers.

  • To create these wallpapers you’d ideally want to start with an image size larger than the ones mentioned above.
  • If they’re in the same aspect ratio as the final resolution, just resize the image to the appropriate dimensions based on your device, else you’d need to crop your image to get it to the desired aspect ratio, and then resize.
  • Once you’re done, save the image and set it as your wallpaper.

Here’s a video walkthrough of how to make your own parallax wallpaper in iOS 7:

As always, let us know how it goes in the comments below.

Like this post? Share it!

  • http://nurudin.jauhari.net/ Jauhari

    It’s works

    • Matt Bartz

      I don’t understand how to add 200px to a photo and what is px? I’m really confused.

      • Macmaniman

        add 200 pixels on each sides of the photo

        • I dont know how to do it

          yeah but how do i do it?

          • Then this is obvious

            Then you shouldn’t be trying to.

  • http://ashish.bogawat.com Ashish Bogawat

    That video is mis-leading. The actual parallax effect is much more subtle on the device and hardly noticeable.

    • egrep

      because you’re not following directions. Give following directions a try.

  • Ahmad Abdullatif

    any which can explaining how does Precise, that use both male and adobe Fotoshop.

    What can that make Precise What can that change

  • Bo Guss

    How do you turn on the parallax effect? I have the 4S, and from what I’m told it should work on my phone. But I don’t see any type of “3D” effect whatsoever. Not even a hint of it.

    • lorna

      I have the same issue – do you have to do something to turn the 3d on with a 4s…? Does anyone know?

      • Mustafa Aminalhaq

        It is available for iPhone 4S so what you want to do is go into Settings, General, Accessibility, Reduce Motion and make sure the toggle is switched off. Hope this helped.

  • Mike Wish

    I found that these dimensions caused my photos to be much wider than they needed to be for the iPhone 5 Screen. I think you need to re-measure because even with the parallax enabled I dont see a good portion of the photo that was cropped into the photo.

  • Carnino

    I could be wrong but 200px does not seem right. In my case, an iPad 3 Retina, the 2448 x 2448 did not sit right and after a screen shot of the iPad after applying a grid image, I was able to confirm it.
    The best results I got with a +-1px tolerance was with the use of 238px instead of 200px.
    In other words, for the iPad 3 Retina, the best results, using a grid to confirm, was 2524px by 2524px (2524 = 2048 + 238 x 2).
    However please note that you must have “Reduce motion” set to OFF when applying the backdrop. If you have it ON and then disable it, it will not be the same as if you apply the backdrop when it is first OFF. It looks like Apple is not consistent with its calculations. Maybe they will fix it in their next update.

  • Ian

    these resolutions are wrong- i know for a fact that the “correct” parallax resolution apple uses for the iphone 5 is 744×1392, NOT 1040×1536 as claimed by this article.

  • lornak

    I can’t see any 3d effect on my 4s – do you have to do something to turn the 3d parallax effect on??

    • Mustafa Aminalhaq

      Settings, General, Accessibility, Reduce Motion. MAke sure the Reduce Motion switch is off.

  • ruboc

    Don’t Work.