This blog is no longer updated, and is here as an archive. To find out more about my work, visit jordanh.net →

January 5, 2011

RapidHackr Reloaded

Well, it’s been about three weeks since the Rewired State DotGovLabs Weekender event and I’ve had some spare time over Christmas and New Year to make quite a lot of changes and to take it into a direction in which it is much more usable. It’s almost unrecognisable from the RapidHackr I posted back in December. I’ll step through the big changes we’ve made, starting with the biggest one – a new user interface.

Ignore the sample data, this screenshot was taken very quickly! :)

I spent quite a while trying to decide on the best layout for the project view. I decided quite early on that I didn’t want to try and fit everything onto one page (as was in the prototype), as it looked pretty cluttered which made it difficult to digest the information. On the other hand, I didn’t want to split a project into lots of pages – this would just make it difficult to digest the information quickly, which is often the problem with traditional project management systems. Obviously it felt logical to use tabs to combine pages of a project together, but that had to be combined with a higher application-wide navigation (ie ‘Projects’ and ‘Ideas’), and having one tab strip almost on top of the other wasn’t going to cut it either. Finally, I decided on using tabs at the side of the project pages, which keeps the project view combined and giving me the chance to put a beautiful blue gradient behind the project title :)

The main view for a project is the Dashboard. This shows the update stream alongside the project description, the list of members who have joined the project, and any upcoming milestones. Milestones which have less than an hour to their deadline get a nice red background to reinforce the urgency ;) The update stream combines any project activity with updates from users. Through AJAX and JSON, further updates can be loaded at the bottom of the list. Once I’ve figured out a good way to do it, I want to pull the version control commits directly into this stream too. All the user avatars here are Gravatars from the email address stored in the user profile. I figured that doing this would make it quicker to develop, less of a resource strain on people who deploy RapidHackr, and quicker for users to sign up and get started immediately.

This is the EtherPad we used back at the DotGovLabs event, but it’ll do for now :)

The other main feature we talked about in our presentation at Rewired State was the EtherPad integration, which made it a little bit easier to keep tabs on the project – such as not having to remember a long garbled URL to get to your EtherPad. Here, the EtherPad nicely fills up the width of the page and can be interacted with and edited as if it was a normal page in your web browser.

The final feature I’d like to show is still a little buggy, but I think it’s worth it. We mentioned the possibility of integrating some sort of voice chat VoIP directly into the application so that developers on more remote hack events can keep in contact with each other. Obviously with any sort of streaming media system there would be hurdles. If we decided to throw the weight of a voice chat server onto the host of the application, then bandwidth costs and server load would increase significantly, but on the other hand, until recently, any other sort of third-party VoIP service would lack the integration we wanted with the application. Enter Phono, a jQuery plugin which integrates with the Voxeo Cloud. You can create ‘phones’ with JavaScript and call other ‘phones’ through a web browser. Unfortunately, it doesn’t support conference calling out-of-the-box, and you’d need to sign up for a Tropo account (which is only free for development use), so I worked on building an alternative solution.

The chat feature works seamlessly – all you do is click the “Join Chat” button and you can instantly start talking with anyone else in the project’s chat room. Behind the scenes, multiple “phone calls” are created with Phono to transparently create a peer-to-peer conference call between everyone in the chat room. Whenever someone joins, their client creates the new calls to all the existing members of the chat room, which avoids the problem of multiple calls being sent to each user at once. However, there are some problems with echoing and a slight delay, but these appear to be problems on Voxeo’s side which they say they plan to try and fix in the future.

I’m really pleased with how the project is developing, and Josh and I hope to continue this project further, to a point where RapidHackr can be the major rapid development tool for hack days. We have had significant interest from DotGovLabs and hope to be working alongside them on this project in the near future. Of course, the app is open source and you can clone a copy of the GitHub repository if you want to give it a try.

:)