Spotlight on Augmented Reality

March 24, 2010 - Russell Barnes

Work at Play loves anything that’s fun, innovative and pretty darn smart.

Augmented Reality (AR) ticks those off pretty well, so we've put together this snack-sized piece on one of the buzzy acronyms that’s been grabbing the attention of consumers and marketers alike.

How to Convince Your Boss that Drupal is Better than Proprietary CMS?

September 24, 2009 - Jordan Willms

In large organizations, convincing your boss or department or project to use Drupal can sometimes be met with resistance. This following table has been instrumental in convincing decision makers regarding why Drupal (and by extension open source) is leaps and bounds better than proprietary content management systems (CMSs).

WorkAtPlay.com How It Was Made: The Slide Effect

July 17, 2009 - James Andres

The second installment in our "how it was made" series for WorkAtPlay.com. In the first part we covered flip and scale effect used on the home page. This post will dive into the slide effect used to navigate between site sections. Before we jump into the code, I was asked a few times why we didn't just use the jQuery ScrollTo to make the sliding effect.

What You Should Know About Drupal Contrib Modules

June 19, 2009 - Ronn Abueg

You should know....

Views, Panels, and CCK are the foundation of all modern Drupal sites -- They do all most of the work for you

• tip: Reality check -- build as much of a site as you can using JUST contrib and core. Make sure your first question is "How can I implement this with existing modules like views, CCK and panels? Then, and only then, once you establish a gap, produce custom code. Custom code should only be used if you can prove that you were not able to use Views and CCK to create the equivalent functionality.
• tip: Learn how views export module works. It's bundled with views and allows you to literally turn your views into "versionable code".
• tip: Panels and blocks are a powerful combination. Learn it.
• see: Listing of "Essential Drupal Modules"
• see: Panels Video Tutorial from Oregon state Univ.
• see: Views + CCK Tutorial

Static nodes can be exported using the node_export module

• see: Install Profile API for importing node exports

CCK types can be exported and imported with content_copy module, ships with CCK

• tip: Again, the Install Profile API module makes importing CCK types easy.

i18n + views is the easiest way to build a multilingual site

• tip: Use the views language filters to build language aware views

Image module is one of the longest running, and best supported modules ever

• tip: If you're not using image module to handle your uploaded images, think again.

imagecache module is the long-run simplest way to handle multiple image sizes

• tip: Sure, there's a little configuration pain up front but your site will be extremely flexible

That pathauto is almost always the easiest SEO win

• see: Pathauto tutorial, a fairly good one

logintoboggan module solves 80% of the registration related requests from the client

• see: LoginToboggan Project on Drupal.org

admin_menu module makes administering and building Drupal sites easier and faster It is more attractive that simplemenu (and more logical and Acquia supported!)

• see: Admin Menu on Drupal.org

Managing Taxonomy Exports with Drupal

June 18, 2009 - James Andres

Hi Drupalites, A recurring pain point in my Drupal development has been managing the vocabularies and terms in Drupal. I tried using the Taxonomy XML module, but found it much too complicated for everyday tasks. Without further hesitation I am proud to unveil Taxonomy Export!

OpenWeb Vancouver 2009

June 16, 2009 - Daniel Quinn

I attended my first ever OpenWeb conference yesterday and as per company policy, I have to report on and share what I learnt, so what better way to do so then to make a blog post for all to read? ;)

WorkAtPlay.com How It Was Made: The Flip and Scale Effect

May 29, 2009 - James Andres

There has been great reception to the Work at Play website design and effects. We have received several emails from intrepid geeks wondering how we pulled off all that cool jQuery eye-candy. After writing a few of these "how it was made" emails I think a blog post is in order. Without further delay, here is the behind the scenes story on WorkAtPlay.com!

The Flip and Scale Effect

On the WorkAtPlay.com homepage we use the jQuery Flip! plug-in in combination with some custom animations to give the "Flip & Scale" effect. This is a little more complicated than one might think, and deserves some explanation:

• User clicks on a work sample tile image.
• The click is caught using a standard jQuery $(elem).click() handler.
• Due to how the Flip! plug-in works it isn't possible to just flip the work sample tile directly. Instead we replace the tile with an empty div of the same colour and perform the flip on that new div. We call the new empty div the "flip_side" because it will actually become the flip-side of the work sample tile.
• The flip_side div is placed using absolute positioning directly on top of the work sample tile. The work sample tile is then hidden with CSS to keep it out of the way.
• Now, finally, the Flip! plug-in is triggered on the flip_side div.
• When the flip_side div is finished flipping the Flip! onEnd call-back is triggered. We use the onEnd call-back to insert the content for the work sample's "flipped side". This content is cleverly ready and waiting inside a hidden part of the original work sample tile (view source on the WorkAtPlay.com home-page to see for yourself). Oh, we insert the content with a basic $(flip_side).html(flip_content.html())
• Ok, so far we've got a div called flip_side that contains the right content. But it's still really small and the content is all scrunched up. How do we make it bigger? The scale effect is solved by the jQuery $(elem).animate() method plus some handy CSS positioning
• The tricky part of the scale effect is figuring out how big it should scale and to what X and Y pixel co-ordinates it should move to. This is accomplished by the following formulas:
  • flipped_side.top = $('#work-page .wrapper').offset().top
  • flipped_side.left = $('#work-page .wrapper').offset().left
  • flipped_side.width = $('#work-page .wrapper').width() + 1
  • flipped_side.height = Math.ceil($('.work-sample').length / NUM_WORK_SAMPLE_COLS) * $('.work-sample:first').height()
  jQuery handles the actual animation for us, awesome!

Estimated Hours Module for ActiveCollab 2.x (UPDATED)

May 13, 2009 - Jordan Willms

When you are a digital agency, you have alot of choice when selecting software to keep your teams productive. There are a wealth of software choices out there, including Basecamp, Unfuddle, etc. But, we needed a solution that we could host ourselves. ActiveCollab was a perfect match for our teams. However, not everything can be perfect. ActiveCollab was missing a few features which we've been adding through its extensible architecture. Our talented developers vowed to fill that gap. One gap ActiveCollab has is a lack of estimated hours on tickets.