Dan Rubin's SuperfluousBanter

Customize your iPhone: SummerBoard

Update: Sum­mer­Board 2.1+ makes much of this tuto­r­ial inac­cu­rate, but the theme instruc­tions still work. I’ll be writ­ing an updated tuto­r­ial shortly to reflect the changes and additions.

Note: Before fol­low­ing this tuto­r­ial, make sure you have every­thing you need »

The first tuto­r­ial in this series cov­ered using Dock­Swap to change your iPhone’s Dock back­ground, specif­i­cally replac­ing it with one that matches the Dock on the iPod Touch:

This was fine and dandy until yes­ter­day, when a new ver­sion of Sum­mer­Board (an app which allows cus­tomiza­tion of the iPhone’s Spring­Board, or home screen) was released. This new ver­sion sup­ports themes and var­i­ous other set­tings, but most impor­tantly it appears to pre­vent Dock­Swap from doing its job. Thank­fully, we can now take advan­tage of SummerBoard’s new theme sup­port to set a cus­tom Dock back­ground, home screen wall­pa­per, or both.

Sum­mer lovin’

First thing’s first: fire up Installer.app on your iPhone and install Sum­mer­Board (the cur­rent ver­sion as of this writ­ing is 2.0). If you already have Dock­Swap installed, there’s no rea­son to unin­stall it; it just doesn’t affect any change when you use it. How­ever, if you’d like to save some space, you can go ahead and remove it.

Sum­mer­Board 2.0 offers the fol­low­ing home screen (aka Spring­Board) cus­tomiza­tion goodness:

• Scrolling appli­ca­tion icons
• Scroll Snap (for each row of icons)
• Wall­pa­per under home screen icons
• Themes (Dock and wall­pa­per images)
• Mini Dock (which does exactly what it says)

In addi­tion to those main fea­tures, there are extra set­tings which give you addi­tional con­trol over your home screen:

There isn’t much need to describe in detail what each of these set­tings does, plus it’s much more fun if you just play around with them and see for yourself.

Sim­ple themes

Sum­mer­Board 2.0 includes four themes by default:

• Default (aka how your iPhone shipped)
• Leop­ard
• Pan­ther
• Sum­mer­Board

Each theme is com­prised of three images (pixel dimen­sions fol­low each file name):

• Dock.png (320x91)
• MiniDock.png (320x37)
• Wallpaper.png (320x480)

Cre­at­ing your own cus­tom theme is sim­ply a mat­ter of cre­at­ing each of those images, plac­ing them in a folder and then copy­ing that folder to the proper loca­tion on your iPhone.

Adding a cus­tom theme

There’s really no end to the num­ber of cus­tom themes you can cre­ate using an image edi­tor and some free time, so I’ll leave that process to you (after all, this isn’t an image edit­ing tuto­r­ial). We will, how­ever, walk through the sim­ple process of trans­fer­ring a cus­tom theme to your iPhone.

First, we need a cus­tom theme—for this exam­ple, I’ve cre­ated a theme based on the iPod Touch home screen, com­plete with plain black wall­pa­per (in case don’t want your “lock screen” image show­ing up behind your icons). For those of you who already fol­lowed my ear­lier tuto­r­ial on replac­ing your Dock back­ground (see the Dock screen­shot at the begin­ning of this tuto­r­ial), this will allow you to have the same look with Sum­mer­Board 2.0 installed:

• Down­load the “Touch” theme » (ZIP, 48KB)

After decom­press­ing the archive, you will have a folder named “Touch” that con­tains the required image files.

Next, con­nect to your iPhone via SFTP (read the instruc­tions if needed), and nav­i­gate into Library/SummerBoard/Themes (the full path is /private/var/root/Library/SummerBoard/Themes), where you’ll see the direc­to­ries of the four pre-installed themes men­tioned ear­lier. Once there, upload the entire “Touch” folder (its path should be /private/var/root/Library/SummerBoard/Themes/Touch).

Now return to your iPhone’s home screen (press the “Home” but­ton) and launch SMBPrefs, then press “Theme” and select “Touch” (the theme we just uploaded). Press the “Home” but­ton once more to return to your home screen and see the new theme in place, look­ing some­thing like this:

Share your customizations

If you feel inspired and cre­ate a cool theme, upload an archive to your site or other file repos­i­tory and link to it in the com­ments of this entry. At some point in the near future, iPhone cus­tomiza­tion sites will begin to sup­port themes, but until then it’ll be fun to pass them around.

Even if you pre­fer to not share your cus­tom images, be a good sport and share any cool cus­tomiza­tions with the entire class by post­ing screen­shots of your cus­tomiza­tions to Flickr and adding them to the iPhone Cus­tomiza­tion group.

This item was posted by Dan Rubin on Friday, September 14th, 2007.

Categories:

• Uncategorized

You can follow comments on this item via the RSS 2.0 feed.

Comments are closed.