At BrainBakery we specialise in PHP, MySQL, AJAX and other web technologies, but occasionally we do a bit of design for our clients and our own web apps; for example, the sumo.tv facebook app was one we had full design reign over. However, for the most part we partner with design expert friends of ours like Caffeine Hit and Display Digital. But we’re a big fan of tinkering with designs, so specialising in code sometimes leaves us with a vacuum of design lust.. which is invariably sated by re-designing the BrainBakery site a few times a year.

What follows is a gallery of some of our old and more well-loved designs for BrainBakery.com:

BrainBakery The First

Ah, the nostalgia of a hastily-sketched holding page! BrainBakery was founded in 2006 as a business vehicle for some advanced web development projects we were working on at the time. As we weren’t thinking so much about digital agencies at the time, we knocked up the little beauty as a temporary measure.

BrainBakery Ajax Mode

One of first projects involved the now-classic “web operating system”, with moveable, draggable, resizeable windows within a web page. This inspired us to make the site highly customisable by the user. However, whilst modern AJAX/JavaScript web interfaces are great for some users, they are poor for users with visual disabilities and poor for search engines. This is why we wrote a bespoke back-end that would automatically generate static versions of the pages which would be displayed to browsers (and search engines) without JavaScript.

BrainBakery Widescreen

The previous site looked great, but there wasn’t a great deal of useful information to catch the eye. We decided to re-configure the site to include a little bit more information. The code was essentially the same, as were my icons I’d designed from the previous version. We don’t tend to make a song and dance about our icon design skills, but we think they still look great after nearly two years!

BrainBakery iPhone 2.0 (Unfinished)

Inspired by an iPhone we played with at Future of Web Apps, we tested out some highly minimalist glassy, glossy iPhone-like web designs. Great fun, but we couldn’t get the design to be minimalist and yet have lots of information - as we need in a site like this. That one went the way of the dodo.

BrainBakery Blog (what you are looking at now)

Imagine the scene - you’ve been procrastinating about updating your site with all your latest and most exciting projects, never quite finding the time, and then all-of-a-sudden you are featured on Techcrunch.com (the world’s leading web tech blog!). It was a golden opportunity we couldn’t miss, so we put together all our wordpress design fu to produce the blog you see now in approx 6 hours! It’s a bit rough around the edges, but if nothing else it proves how fast we can be.

In fact, we’ve done some very interesting things with Wordpress lately. Watch this space for some developments!

ShareThis

ShareThis

Following the success of Blog Friends V1, we again joined Luke and i-together to create a new app - Buzzspotr. Buzzspotr combines instant messaging and locations to enable you to quickly and easy see where the buzz is. The project was inspired by Lloyd Davis and Mike Butcher during the early days of starting the Social Media Cafe. As they are both avid users of twitter (like many of the Social Meda community in London), and they needed a way to organize gatherings of social media types, it was natural to combine twitter with Google Maps.

As the project progressed, it became clear it has a lot lot of potential, so Luke enlisted the input of Ofer Deshe from Flow Interactive to guide us in usability testing for a large group of bloggers. Whilst the interface is simple, the code is reasonably complex: on the front-end, we’ve almost entirely re-written Google’s map api from scratch; on the server-side we’ve deployed our in-house highly-scalable memcached “Kitteh” framework so the app can easily stand up to tens of thousands of users all from a single low-spec server.

ShareThis

We’ve been working with Luke Razzell from i-together for a few months now, supporting the Blog Friends facebook app with ongoing updates. With the app having been live for about 5 months now, we thought it’d be great to spruce things up a bit and take advantage of the latest features of facebook’s API.

Blog Friends V1 amounts to a significant re-write of the entire front-end along with major portions of the back-end. The app is now effectively a full-blown feed-reader, entirely within facebook, and is currently the most advanced facebook app we know of (or so our users tell us).

ShareThis

… of course, being Christmas the obvious thing was to make an advent calendar application, giving us just a couple of days to design, test and release the app! Thanks to Adam from Sumo, we had a pretty open brief so Jof was able to design and illustrate the app in a day, with Gavin coding and testing it.

ShareThis

When Channel4 approached us, their goal was clear; their current blog system was causing them issues, and they needed to launch a new blog to coincide with their recent mission to reach out to their audience and get their thoughts about the future of Channel4. The blog solution had to share aesthetics with the existing C4 properties, and the hardware had to withstand tens of thousands of hits per hour during the peak periods. However - and here was the catch - it had to be launched from scratch in a week!

On Friday, Jof went into C4 and setup his laptop in their cafeteria. By the end of the day, he’d liaised with their design department and the other stakeholders, setup a server, installed wordpress, written the php templates and got the blog to the point the customer was happy with it. Over the weekend he tweaked the CSS/PHP and, after their approval, launched it the following Monday!

ShareThis

Even with the aid of the mootools JavaScript library, this was a fairly hefty bit of work. Peter wanted an AJAX search; songs that could be added with double-click, drag and a button; re-ordering; animations… you name it. Oh, and it had to work in pretty much every known browser! Feel free to check out the live version at LuckyVoice Playlist.

ShareThis

Having happily worked with us before on their SingStatus and KaraokeDNA facebook apps, karaoke startup LuckyVoice had no hesitation hiring us again to help build their new website. This time, the design duties we passed to the highly capable hands of our friends Mark and Stephen from DisplayDigital, whilst we worked on a completely bespoke interface and CMS.

Normally, we’d recommend our customers a solution like Wordpress, Joomla or Drupal. However, on this occasion they needed something unique, that not only allowed the content to be edited, but also:

• Bulk-sending of custom-formatted emails, selectable and stylable from the CMS
• Connection with, and consolidation of, all their various different sources of email data via various API
• Sending of the emails via an API interface with Pure360 bulk email system

Ultimately, we wrote a complete CMS from the ground up!

ShareThis

As part of karaoke startup LuckyVoice’s latest marketing campaign, we were approached to produce another facebook app. This time, the brief was to produce an app that’d allow users to build identikit characters based on the karaoke songs they like to sing.

The app itself was fairly straightforward, but the real trick was making the identikit images… with about a billion different combinations, we decided to leave the task to our XCalibre servers via awesome open-source command-line image-editor ImageMagick. To get the images, we wrote scripts to subtract the various face components and add them together on the fly, creating truly horrifying hybrids ; )

ShareThis

A quick bit of facebook fun for karaoke startup LuckyVoice. Using LuckyVoice’s extensive song database, the app allows you to set your mood by choosing song lyrics. The app was designed and built in a couple of days.

ShareThis