Ok, don’t get me wrong: everyone knows that you can take a screenshot of what’s happening on your iPhone by simply holding Power + Home. I wanted to talk about something different: what if you’re a developer / designer or even a blogger, and you want to insert some great iPhone screenshots on your webpage? Yeah, those screens with a standing iPhone showing the application in context, like this one. Ever wondered how you can actually achieve a similar result? I did. And I’ve come up with two easy and nice solutions I wanted to share with you, hoping to help you out with your next project or blog post.
This is one of the most popular ways of making pro iPhone screenshots. It requires you to have a jailbroken iPhone with Cydia installed and two utilities (one for the Mac, one for iPhone) running at the same time in order to take the screengrab. Also, both the iPhone and your Mac computer should be on the same wi-fi network. Let’s see how you can do this anyway.
First, install ScreenSplitr from Cydia: this app allows you to mirror your iPhone screen on a TV with an AV cable or on a computer. In this case, we’ll see how you can mirror the iPhone on your Mac. Once you’ve installed ScreenSplitr head over this webpage and download Demogod: from the same developer of ScreenSplitr, Demogod lets your Mac communicate with the jailbroken phone and mirror it on the screen. It works like this: start ScreenSplitr on your iPhone and be sure that both the computer and the phone are on the same network. Start Demogod, it will tell you that it has detected an iPhone on its same network: click on the iPhone name. Accept the connection from your iPhone, and here you go: your iPhone is “running” on your Mac.
Now, just take screenshots like you do for any other Mac app.
This is a pretty much unknown Mac app that allows you to “create” cool iPhone artworks starting from screenshots you previously took on your iPhone. Just drag and drop a screenshot into the “Capture Screenhot” pane, choose between Portrait and Landscape mode and then hit Generate. It basically places the screenshot into an iPhone template like this:
…and it really works perfectly. Do you know any other ways of achieving similar results?
#1
That's what Ned Falconer said 7 months ago:
What theme is installed in the screenshot with the purple wallpaper? I love the dock!
Thanks!
[Reply]
#2
That's what Daniel said 7 months ago:
iPhone GUI PSD kit: http://www.teehanlax.com/blog/2009/06/18/iphone-gui-psd-30/
[Reply]
#3
That's what Kostas said 7 months ago:
I just use the native screen capture app on the iPhone and overlay it on a picture of the device. It produces a much more original look..
[Reply]
#4
That's what Ellen said 7 months ago:
Thanks so much for showing me a great way to showcase screenshots for my blog. I’m going to have some fun!
[Reply]
storiesofmac Reply:
January 8th, 2010
@Ellen, Hehe, thank you
[Reply]
#5
That's what Turbolag said 7 months ago:
Im not on my Mac right now, but Im sure that if you use the Grab app, and use Capture Window, you can click on the iPhone in the iPhone simulator for the same effect.
Also, what app is being showcased in this post? It looks very slick!
[Reply]
#6
That's what Jonah Grant said 7 months ago:
I just use the plain in-app Xcode screenshot taker. Takes them at full-res.
[Reply]
#7
That's what Mladen said 7 months ago:
I would like to use this theme because I love this icon next to Pastebot! But I can’t jailbreak my iPod Touch
[Reply]
#8
That's what redwall_hp said 7 months ago:
Just find a nice photo or high-res icon graphic of an iPhone, and paste your screenshot over it in Photoshop. That’s what I would do.
[Reply]
#9
That's what Flash Cards said 7 months ago:
Excellent post! These will surely come in handy.
[Reply]
#10
That's what iphone developer said 7 months ago:
AWESOME tutorial! Thanks a bunch I was searching for how to do this for quite some time.
[Reply]
#11
That's what Klondike said 7 months ago:
What dock is that??
[Reply]
#12
That's what Andree Blixt said 7 months ago:
Where can I find the theme? I looks awesome!
[Reply]
#13
That's what Joe said 7 months ago:
More for screencasts rather than screenshots, and not exactly the easiest thing in the world to work with, is SimFinger by Atebits. A free, little, open-source gadget that overlays on the iPhone simulator. It’s pretty neat. Check it out: http://blog.atebits.com/2009/03/not-your-average-iphone-screencast/
[Reply]
#15
That's what James Wragg said 4 months ago:
I use the iPhone Simulator Cropper – it’ll take pictures directly from the iPhone simulator and wrap in the chrome.
http://www.curioustimes.de/iphonesimulatorcropper/
[Reply]