3 Graphics + 1 XML Edit: Skin Your Twittercamp

Okay, tonight’s blog parade is back to back twitter-a-thon. Among the tweets, Darren mentioned getting Twittercamp to run on his laptop. I chimed in a smart remark about stepping it up a notch and modifying the app with a custom skin.

Oops, I may have jumped ahead. Twittercamp is a nifty desktop application created with Adobe’s new Apollo technology (allows web interaction in slick desktop apps) originally created by Daniel Dura as a way of having on ongoing dynamic display of twitter activity for use during a conference. If you happen to have a nice plasma screen laying around, it makes for a nifty backdrop for people to look at during breaks, etc. (Keep in mind you can only see it running on a computer, not in the browser, you have the real twitter for that??).

I had downloaded it and ran it when it cam out, filing it away for future use (or purged with the next memory dump)

When I visited University of Mary Washington for Faculty Academy this past May, those inventive DLTL kids had not only found a plasma screen, and not only put up a Twittercamp display, they had managed to customize the interface with their logo!

TwitterCamp at Faculty Academy

So when I was scheming up some twittery things for the 2007 NMC Summer Conference in June, I said, “I gotta figure out how to do dat!” The TwitterCamp site suggests that the application’s interface can be modified:

The second way to customize the application is to replace the image files in your installation directory. These files can be located in “˜{install directory}/skins/’ folder.

I failed to find this in the application files on my Mac, looked for them in the downloaded source files, and was stumped. I went down the wrong path and thought I had to mod the source, got a copy of Adobe Flex and really got lost. So I backed up and asked Andy at UMW how he did it– and he referred to just replacing the PNG files in the skins directory.


Then it was the sound of DOH, hand slapping head… On a Mac, an application icon actually masks a package of files and folders beneath the icon. If you control-click the application, and select Show Package Contents from the contextual menu, you pry open the goodies:


And from there, you can dig down the file structure Contents –> Resources –> skins and voila! There are 4 graphic files that are used in the interface:


So it is a matter of creating your own versions of graphics to replace these (it is left as an exercise to the student to figure out where they fit in, but one is the background for the tweet area, one is a logo that goes in the center, and another logo that goes in the bottom right. I suggest making the new images the exact same size, and be sure ti use PNG transparency where needed for elegance.

There’s one more nit- the text/oinstructions that appear in the lower left is NOT done by a graphic, but you can change ti simply by editing the config.xml file inside the package directory. You could also get fancy and replace the TwitterCamp-icon.png file for the full custom effect. To go cross platform, you can get the Windows version of the app, where you see the full file structure, and dump the same files in there. That’s a real sweet beuaty of these Apollo apps, they are full cross-platform.

Anyhow, when done, you can fire up your twittercamps and revel in your cleverness of customization, impress your colleagues, and even make your Mom say “wow”. I meant to write this up a while ago, but it got lost in the June wash. To refresh my mind, i whipped up my own custom CDBCamp, and did some different things with the files to see the effect:



Easy Peasy, again! I know with the NECC crowd and folks like Darren chipping away at it, we’ll see even more nifty versions.

If this kind of stuff has value, please support me by tossing a one time PayPal kibble or monthly on Patreon
Become a patron at Patreon!
Profile Picture for cogdog
An early 90s builder of the web and blogging Alan Levine barks at CogDogBlog.com on web storytelling (#ds106 #4life), photography, bending WordPress, and serendipity in the infinite internet river. He thinks it's weird to write about himself in the third person.

Leave a Reply

Your email address will not be published. Required fields are marked *