Archives

My most recent Pathfinder project calls for a pretty typical Ruby on Rails web application with two interesting additional components: a Facebook application and an iGoogle gadget. Though a Rails Facebook plugin was easy to find, Rails development tools for iGoogle weren’t as thick on the ground.

First, a bit of background: iGoogle, Google’s personalized-homepage service, offers developers two methods of application development:

• build a native gadget by wrapping custom HTML, CSS and JavaScript in an XML wrapper.
• build a sandboxed gadget by wrapping an externally hosted web application in an iframe.

Because of cross-domain security issues, gadgets that require authentication must be built using the iframe sandbox method. As it turns out, this method’s a lot easier. Instead of building a whole new interface, you can just tart up your existing app with an iGoogle-optimized user interface. Why replicate your existing view logic with a bunch of iGoogle-specific JavaScript when you can just reskin and call it a day?

As it turns out, though, reskinning a Rails app for iGoogle isn’t as simple as it might seem at first glance. I can think of three options. All have drawbacks:

Share/Bookmark

Here’s a quick rundown of how I was able to generate a gem from scratch and release it using github. There are 2 gems that are most commonly used for writing new gems: newgem and hoe. The pros/cons of these 2 gems could be another blog post, I recommend newgem for starters.

Share/Bookmark

I’ll be doing a talk on Getting Started With Rails Testing and/or related testing topics this Saturday, January 17th at the monthly meeting of ChicagoRuby.org.

It’s at 3pm, location and other information is available at their meetup.com site.

Looking forward to it — see you there!

Share/Bookmark

Just as we moved from cvs to subversion to git, our ignore files changed from .cvsignore to .svnignore to .gitignore. However, git offers more flexibility in managing our ignore files depending on situation you are in. Here are a few options, I’ve found:

Share/Bookmark

Image of Thomas The Tank Engine is from the
New York Times, I think, but I can’t find the exact page.

I love ActiveRecord. I don’t really much like working with relational databases (like Tolkein wizards, databases tend to be good at getting you out of the kind of trouble that databases get you into…).

Sometimes, though, you get a requirement that seems explicitly designed to drive both ActiveRecord and your database of choice stark raving mad. Here’s an example based on an actual client requirement (details changed to protect the innocent):

Share/Bookmark

Drupal, the popular open source Web Content Management System, has got a massive and passionate community of developers, designers and webmasters.   Drupal.org, their official website was faltering under the weight of this growing community of diverse users, so this past summer the powers that be at Drupal  decided to hire an outside agency to do a complete redesign of the site.  The firm they hired decided to take a “design by community” approach to the project.  They wanted to get as many Drupal users as they could to participate in the redesign.  So, through a number of collaboration mechanisms–setting up a Twitter account to follow mentions of Drupal, opening a Flickr account where the community could post pictures, and actively engaging the existing Drupal forums–they opened the design process up so that anyone in the Drupal community could share in the process.

Conventional wisdom says that design doesn’t work as a democracy.  It takes the genius and inspiration of a small team or one person to understand what the customer needs, and design the right solution.  As Henry Ford said it best, “If I’d asked my customers what they wanted, they’d have said a faster horse.”  So I’m not surprised that according to Mark Boulton, the lead Designer on the project, many people though that this type of open process would fall flat on it’s face.  I’m not convinced that it won’t, but from what I’ve seen, the site is looking good.

It’s still in prototype phase, so it remains to be seen if the redesign, once implemented, will be a success.  but you can get a look at the evolution of the design here, and of course follow the links to the discussions.  It’s a fascinating look at one designers experiment in design by community.

Share/Bookmark

By this time, I am very happy and impressed with PureMVC. In combination with Flex Code Generator, plumbing downtime is minimal and the more you work on a project, the more you see the benefits.

Out of all visualization frameworks for Flash Platform that I came in contact with, Flare is looking like the most customizable. I also like it’s structure. At first I didn’t, but now I love the fact that Visualizations are based on Sprites. I find that good for performance and transitions. You have to do a little extra work, but you will be happy with the result. All in all, I’m sold on it for now.

Share/Bookmark

Have you often run into a situation where you have a hash full of properties and you want to either create a new ActiveRecord object (if it doesn’t exist) or update one (if it exists)?

For example,

class User
  # has properties: ssn, first_name, :last_name, :age, :email, :password
  def create_or_update_by_ssn(params)
    user = Disease.find_by_ssn(params[:ssn])
    if user.nil?
      user = User.create(params)
    else
      user.update_attributes!(params)
    end
  end
end

Here, the business rule states that a user’s SSN is unique, so called natural-key.

If we can identify what constitutes a natural-key for each model object in our domain-model, when we could DRY out this functionality.

Share/Bookmark

As I’m sure most of you do, I am spending more and more time online watching video.  So I thought I would take some time and rate the various video players I use on a frequent basis.
I’m using a 10 point scale, and I’m rating based on a both functionality and visual look and feel.

ESPN.com 7 out of 10
Fairly simple, two color, semi transparent control bar, appears only when moused over–a design pattern I’m seeing more and more lately.  It’s there when you need it, it shows you what you want and it gets out of the way quickly.  It’s got a single play/pause button, a timer, a playback countdown, a volume control which displays only on mouseover, reducing clutter, and a menu which when clicked brings up some additional options for embedding sharing and the like.  A nice touch: Mouse over any point on the timer and you get a little tooltip that displays the time at that point.  Another nice touch: the small (no morethan 10 pixels vertical) bar at the bottom which displays how much has already played as a portion of the total.

Youtube 7 out of 10
Gets the job done.  Period.  Simple consistent interface.  Youtube also allows publishers to add annotations and captions to their videos, and naturally allows viewers to turn either on or off, with a simple hover menu at the very right side of the control bar.  Youtube is actually doing some really cool stuff to allow publishers to make their videos more interactive, including adding hyperlinks within a movie.  The evolution of online video will be interesting to watch (and maybe take part in) but that discussion is beyond the scope of this post.

NYtimes.com 6 out of 10
Elegant interface, but could be better.  The control bar stays present throughout the video playback, and occupies a significant portion of the total video player.  However its muted style–3 shades of grey–makes it easily ignored when not needed.  The playback control is done superbly.  When moused over, a small draggable button smoothly and elegantly appears, it’s affordance as a scroll mechanism to move to any point in the video is crystal clear.  The volume control is nice and large, with the same measure of affordance, however it looks like it was designed separately, as it doesn’t conform to the rest
of the control bar’s aesthetic.  Also, I may be nit-picky, and I’m sure this won’t bother 99% of nytimes.com viewers, but there’s a large empty space in between the play button on the left, and the full screen button
on the right, creating an odd asymmetry which, the more I look at it, the more it bothers me.

MTV.com 6 out of 10
Nice minimalist design.  Allows you to change the video quality during playback.  Also nice, allows you to choose from 3 sizes; standard, large and full screen.

Viddler.com 6 out of 10
Lets the video publisher skin the player interface.  This great tools allows users to comment on and tag the video in the timeline.  The interface is ugly, though, and some of the buttons aren’t self explanatory, nor do any of the buttons have tooltips.  At the end of the current video it automatically plays the next video, whereas most other players present a menu of videos to choose from.

MSNBC.com 5 out of 10
Slick looking.  I like the fact that the playback bar is given the entire width of the video, allowing the viewer to be more precise in navigating to a specific point in the video.  The other controls are slightly confusing.  It looks like the interface was over designed.

Virb.com 5 out of 10

Beautifully minimalist design.  No full screen mode, but it does have a cool feature that “turns off the lights” on the rest of the page.
Facebook 5 out of 10
Fairly simple interface.  Standard controls, done adequately.  Its got none of the useful social media features of Youtube. No ability to tag or comment in the timeline.  Pretty basic for such an important part of such an important website.

Metacafe 3 out of 10
Poorly designed.  It’s distracting when trying to watch video, and ugly to look at when interacting with.  The big blue shiny play and stop buttons look unprofessional, and why is there even a stop button.  The draggable playback scroll mechanism moves from left to right as the video plays, but it could have been made much more subtle.   There’s no need to see it unless you want to move navigate the video.  And why does the entire playback bar glow when I mouse over it?  Also not cool is the visually loud menu underneath the control bar.

As with any list, much o this is subjective.  I’m looking forward to hearing your opinions.  Also, there are so many web video players out there, this is just the tip of the iceberg.  Let me know which ones you find especially appealing, or truly horrible.

Share/Bookmark

If you’re using prototype (or rails, which uses prototype by default), you’ve probably seen this javascript error before:

handler is undefined

While not particularly threatening (no ill side effects seem to occur), the error causes a lot of noise and, quite frankly, is pretty annoying. Fortunately, there is a quick and painless patch to keep your error log free from this bane.

Share/Bookmark