resumé | portfolio | blog

Wall Magnets

Portfolio Preview - Wall Magnets

Facebook Application, 2008

A year prior to this project, I was just starting something I called "btraut’s Magnets" (see below). Sometime inbetween 2006 and Christmas break 2007 I had began using Facebook a bit more, and was ever-increasingly becoming interested in Facebook applications. One day a friend and fan of btraut’s Magnets approached me and told me I should make a Facebook application allowing users to put fridge magnets on their Facebook profiles. I loved the idea!

Portfolio Preview - Wall Magnets

Initial development for Wall Magnets took no more than a week. A lot of the code had been laid out by its predecessor, but I was still a novice to Facebook application design. The backend of the application was modified to allow users to make their own walls rather than modifying one central wall. Code was also added to allow for complete customization of the look of the wall as well as which words are available. A lot of attention was also paid to user permissions, only allowing friends to modify walls, for instance.

Portfolio Preview - Wall Magnets

A week after I had finished Wall Magnets 1.0, the userbase was doubling daily. When I reached 300 users, I placed the application for sale on the Facebook Marketplace. I immediately had bidders, and eventually sold it for a very reasonable sum of money. Today, I still remain the lone developer of Wall Magnets, and I'm being paid for my contributions to the application. At the time of this writing, Wall Magnets has a user population of nearly 7000.

Wall Magnets uses PHP and MySQL as a backend. The frontend is written in FBML, the Facebook derivation of HTML, FBJS, a sandboxed version of Javascript with a few provided libraries, and standards-complient CSS. Despite heavy AJAX use, Wall Magnets works perfectly and uniformly across all major browsers.

Demon Realm v3

AJAX-based Web Site / Game, 2005 - 2008

Portfolio Preview - Demon Ream

This one is the biggie, folks. I’ve spent more time on this project than any other over the last few years. I actually started design on the map engine approximately five years ago, but didn’t decide to turn it into a game until a few years after.

So what is Demon Realm, you ask? It is a fully browser-based RPG (role playing game) aimed at an audience of ages 5 to 55. Gameplay is simple - you control a team of combatants that seek freedom from an oppressive monarchy, peace with hostile demons lurking the lands, and wealth that is hidden along the way. At all times, players may viewPortfolio Preview - Demon Ream a map comprised of tiles. Clicking on a tile will move that player to its location. But beware! As players move, they will encounter battles with all sorts of less than friendly creatures. To defeat such creatures, players participate in turn-based battle that promotes strategy and planning. Finally, when a group of monsters is defeated and the player collects his loot, he may spend it on armor, weapons, and other items that will help him finish his quests.

Despite working on this site for the better part of my college career, it is still in early development stages. I’ve given it the “version 3” status simply because it is the third time I’ve decided to re-write the entire game. With each re-write, it becomes more efficient, feature-rich, and fun. I’d like to release the final version sometime before 2008, but a lot of work needs to be done before this point.

Due to the stage this site is in, I offer no link currently. I do plan to post more screen-shots as the user interface becomes more complete.

MacWorld Keynote Bingo 2007

Portfolio Preview - Bingo

AJAX-based Web Site, 2007

Every January, Steve Jobs gives his annual MacWorld Keynote speech. While he is always an amazing public speaker, he has his own quirks such as saying “BOOM!” when he unveils a new feature. MacWorld is also frequently speculated as to which new products will be announced during the keynote.

In 2006, a clever Mac fan proposed that we write lots of these such quirks and speculations on a bingo board so we can play along to the speech. For 2007’s keynote, I jumped on the bandwagon and decided to write my own random bingo card generator that people can use. [Humorous tid-bit]: half-way through the 2007 Keynote, an audience member shouted out “Bingo!” undoubtedly in reference to this game.

Although it won’t be useful until next year’s Keynote (for which I intend to update it), you can still check out the bingo card.

PHP Serial Box

Portfolio Preview - PHP Serial Box

AJAX-based Web Site, 2006

During my time at the Center for Heath Communications Research at University of Michigan, I was asked to help with the general integrity of the lab in addition to the research studies being conducted.Portfolio Preview - PHP Serial Box At one point, I was asked to upgrade the center’s large database of serial numbers. It had formerly been wrapped around a FileMaker Pro document and placed on a network drive, but with more and more people needing access to the software registration information, I decided to create a web interface / control panel to administer it.

The PHP Serial Box is written using PHP 5 and MySQL for the backend, with heavy usage AJAX on the frontend to make for an "application-like" feel. It was also one of the first sites in which I put a great deal of focus to standards complience, ultimately leading to a fully-verifiable XHTML4 site.

Link of the Day Widget

Portfolio Preview - Link of the Day

Apple Widget, 2006

One current feature of my blog is a near-daily post called “Link of the Day.” Each of these posts presents a new link to essentially any interesting web site on the internet. Most of them are flash games designed to waste time. Others are humorous videos, pictures, or stories.

Basically to see if I could, I designed this widget to reflect the most current Link of the Day post. When Dashboard is opened, it automatically connects to the server and asks for the most recent link, and displays it in turn. It is a very simple widget with no preferences available, but definitely helped me learn the basics of widget design, and also how to query the Wordpress database for information.

You may view a larger image of the widget in action or download the widget for your own use.

btraut’s magnets

AJAX-based Web Site, 2006

Portfolio Preview - MagnetsThis project just shows what fun can come out of proof-of-concept designs. It is an AJAX-based application that allows the user to drag and drop magnets to form sentences such as “btraut is so sexy.” Each time someone moves a magnet, the browser communicates with the database on the server and updates its position. When another user then goes to the page, they see that magnets new position.

Despite being a fairly complicated application under the hood, it still holds compatibility on all major browsers without so much as a CSS hack. btraut’s magnets has since been ported over to Facebook, allowing users to create their own sets of magnets (see above).

To view the magnets and move a few around yourself, head to the magnet page.

Portfolio Preview - T-Shirt

West Quad T-Shirt Contest

Photoshop Image, 2006

My sophomore year at University of Michigan had just begun. I had moved into West Quadrangle (aka West Quad) and noticed a flier for a T-Shirt contest. If I designed the best T-Shirt as determined by the dorm staff,Portfolio Preview - T-Shirt I could win a $50 gift certificate to Best Buy. So I did. Now a few hundred West Quad residents are wearing my art.

The T-Shirt front features a picture of West Quad as viewed from across the street. Because the T-Shirts could only be printed with two colors, I decided to go with an extremely rough style of contours. It also has the text “West Quad 2006-07” written down the side as was recommended by a friend. The quote on the back reads “flood free since 1939 April”, poking fun at the sprinkler-flood the dorm had experienced the previous April.

For a larger version, take a look at the final splash I submitted with the high-res versions.

Copyright 2005-08 © Brent Traut