Customize your iPhone: DockSwap

Update: “DockSwap” is now known as “Customize”. Also, for more theme-like options, you may want to use Summerboard instead »

Note: Before following this tutorial, make sure you have everything you need »

With the introduction of the iPod Touch, many iPhone owners (myself included) let slip a few quiet “ooohs” and “ahhs” at the more Leopard-esque Dock background behind the 4 main application icons:

iPod Touch Dock

Initially, I just resigned myself to the hope that Apple would update the look of the Dock in the next major iPhone Software Update. But then a few days ago, a new application appeared in the Installer.app list: DockSwap, along with some custom Dock background images. Bleeding-edge developers be praised! Of course, I had to install it and make my own custom background, and this tutorial is a result.

Before and after

By following the steps below, we’re going to take our iPhone Dock from its default style:

the default iPhone Dock

to a shiny new “iPhone Touch” version:

customized iPhone Dock

We won’t be replacing the default applications or icons in this tutorial, though I plan to cover launchers and SpringBoard customization in the future.

Get DockSwap

Before we dig into the graphics, launch Installer.app on your iPhone, and install DockSwap. There are also some custom background images for DockSwap, so go ahead and install them if you want to play around with some alternate options.

Do not touch?

When I started writing this tutorial, the default package of custom Dock backgrounds did not include any iPod Touch versions, however this has since been remedied. For those of you who don’t want to create a custom version (e.g. changing the background color to something other than black) or haven’t customized the four default iPhone application icons (Phone, Mail, Safari, iPod), you can just install the custom images and use one of the included iPod Touch background images—however, as of this writing, I still prefer my version since it is closer to the real iPod Touch background.

The template

To make it as easy as possible to customize the dock image, I’ve created a simple, layered Photoshop file that includes the default set of icons, a customizable background color layer, and the other elements in separate layers in case you want to play around on your own:

If you don’t have Photoshop, I’ve also created two PNGs, one with reflections and one without:

You can just use these as-is, or edit them using your non-Photoshop image editor of choice.

Your custom background

If you don’t plan to make any customizations, and just want the iPod Touch look, you can just download one of the PNGs above and skip to the next section. Otherwise, read on.

The PSD includes a text layer with reminder instructions, so make sure you hide that before exporting your image.

You can easily change the background color of the dock by double-clicking the bottom layer in the layer group (named “bg color“). Some colors will work better than others, so play around until you get the desired result. Darker colors will work better:

alternate Dock background colors

Of course, there’s no limit to what you can do visually, but I’ll leave further explorations to you.

Once you have your background image the way you want it, just save it as a PNG (via Save As… or as a 24-bit PNG using the web export option).

Upload and apply

Now that you have your custom background image(s), it’s time to get them on your iPhone, and the easiest way is via SFTP. If you followed the instructions, you will be able to connect directly to your iPhone via its IP address (your iPhone must be connected to a WiFi network for this to work). To find your iPhone’s IP address, tap Settings→Wi-Fi, then the blue arrow next to the name of the network to which you are connected.

Connect to that IP address using your SFTP client, with “root” as the username and “dottie” as the password (to keep the connection alive, you may need to temporarily change your iPhone’s Auto-Lock setting to “Never”, under Settings→General→Auto-Lock, to prevent the iPhone from entering sleep mode).

Once logged in, navigate into the “Library” directory that appears (the full path to this directory is /private/var/root/Library). Once there, navigate into the “DockSwap” directory (if it doesn’t exist, create it), and then create a new directory named “Custom“.

Upload your background images into the newly created “Custom” directory, then launch DockSwap on the iPhone and select your new background image. Press your “Home” button to return to the SpringBoard (which automatically restarts), slide the unlock switch, and your Dock should now be graced by your custom background image!

Share your customizations

In the grand spirit of sharing, if you create some snazzy new custom Dock background, post it online and link to it in the comments of this entry, and I’ll start creating a collection that can be posted as a package. I may also see about getting such a package added to the Installer.app sources so it can be regularly updated and easily installed on iPhones everywhere.

Even if you prefer to not share your custom images, go ahead and post screenshots of your customizations to Flickr and add them to the iPhone Customization group.

Comments

8 responses to “Customize your iPhone: DockSwap”

  1. diana Avatar
    diana

    sorry i’m a bit new to all this and i’m pretty excited about getting started. i’m having a hard time connecting to my iphone via sftp.. am i doing something wrong? i got the ip address, but what do i do with it? i’m using ws_ftp pro.. will that work?

  2. Wheng Avatar
    Wheng

    I was trying to connect using sftp “WS_FTP pro” to my iphone to upload summerboard themes I made but I keep getting connection failure.. Am I missing something? :( even tried to install mobilefinder and ishare on my iphone but when I was trying to even login on ishare my IPHONE FROZE! I was about to break down since my iphone is only 2 days old. but I got it rebooted pressing and holding “home and power at the same time” Thank Goodness.

    Pls help?

  3. DrDiesel Avatar

    My understanding is that WS_FTP Pro is not SFTP. I may be wrong since I don’t like the pro version myself. However, WinSCP does have SFTP abilities and that’s what I have always use for SFTP connections. With that said, I to am getting a connection error when I try to connect. Does DockSwap need to be installed in order to use that username and password? Or, if not, what else might it be? I ask this because I can’t even find DockSwap in the installer.app anymore, did it get removed or am I maybe looking at it from the wrong Service (is that even possible)?

  4. Dan Rubin Avatar

    @Diana/Wheng: As DrDiesel noted, WS_FTP Pro doesn’t seem to support SFTP. CuteFTP (as linked in the original instructions) does, as does WinSCP, and a few others, but since I’m not on Windows I don’t have an extensive list.

    If you are still having connection problems, make sure you have installed Community Sources from within Installer.app. You should do that before installing SSH on the iPhone. Also, you may have to restart your iPhone after installing SSH, and your iPhone *must* be connected to the same wi-fi network as your laptop/desktop that you are using to connect. If you aren’t on the same subnet, you won’t be able to reach the IP address (unless it’s a publicly-accessible IP, which is very unlikely).

    Finally, DockSwap is now “Customize”, and has a bunch of extra features. Chances are, you’ll want to swap your dock image using Summerboard now (along with all its theme options), but if you don’t want all that, Customize is the way to go.

  5. gaurav Avatar
    gaurav

    ok i bought a iphone in belize it was working fine until i uploded ssh with i brickr and no matter how i reset iphone wont work keeps freezzing and aslo keeps soft reseting by itself some one please help me

  6. Justin Avatar
    Justin

    hi, i cant seem find Dockswap in the installer.. Someone got a source?

  7. sam Avatar
    sam

    i need iphone Dock background for ipod touch 1.1.2, coz i dont need 1.1.3 rite now ,,,, can some1 gimme the link 2 download the iphone Dock background???

  8. […] Gadget Reviews and Tech Updates | The latest Gadget Reviews, Updates, Technology Pictures and more wrote an interesting post today onHere’s a quick excerpt…bookmark this on del.icio.us – posted by mebice to iphone development themes and saved by people… […]