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.

    • Themostunclean

      These dimensions are needed because iOS zooms in greatly on the image when using it as a parallax wallpaper. If you have a lower resolution then your image will not be as sharp. Some people don’t care about image fidelity though, guess you’re one of them.

  • 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.

  • sana

    I first turned out the parallax effect on my iphone 5, but I want it back, so I turned it back on, but the parallax effect seems to not work anymore. Is this possible???

  • Jason Adamski

    The resolution for the i 4S is incorrect. I think you added 200 pixels to someone else’s number that already had the 200 pixels added. I’d check the other numbers as well and update. THE resolution of the 4S screen is 640 x 960. Add 200 pixels each. Your image for the best pixel to pixel match will need to be 840 x 1160.

  • Darrell Paul Burnett

    If it’s any further help in designing wallpapers (I’ve found it is for me, for the iPhone 4s in my case), the actual resolution of the part of the full picture (1,360 x 1,040) which is displayed is 1,100 x 734 pixels. I’ve made a 1360 x 1040 Photoshop template with the 1100 x 734 inner frame (centralised) so I can adjust the picture to exactly how I want it to appear on the iPhone. Although once selected on the iPhone you still have to slide it over to the left to fit the same portion as in the Photoshop frame.

  • mpm

    these are not “resolutions” these are aspect ratios or dimensions!!! “resolution” should be looked at as well. pp/in (pixels per inch), vs height and width number of pixels. what should the “resolution” be for this dimension?