Shocker: Facebook Does What’s Best For Facebook

There’s a debate in progress over Facebook’s new “like” buttons and “Open Graph API”, with open web advocates questioning the true “openness” of the new platform, and Facebook arguing that the move is good for the web.

Read more at Mashable ?.

Thesis development

I recently acquired a Thesis developer's license and have spent a great deal of time learning the nuances of this distinct theme. Below are several samples based on sites I designed. Click on the image to view it in full size.

Illumination Foundation

Pencilbox Studios was asked to create the materials for the Illumination Foundation's newest, soon to be annual, fundraising event. We were happy to create a look for the pieces that will be used in the coming years.

The Illumination Foundation (IF) is a grassroots organization that addresses the crisis of homelessness in Orange County through integrated services that provide appropriate solutions.

CSS rounded corners for all browsers

Every now and then something new comes along that makes you wonder how you ever survived without it.

The ability to create rounded corners using CSS is just such a thing. There are clever javascript tricks for repositioning a circle image in the background, or there's the old school method of creating an image for each corner, but, thank god, both methods can soon be relegated to the back of the css cupboard thanks to the introduction of the border-radius property.

The, still to be finalised, CSS3 method is as follows:
To round the lot: border-radius
To be specific:
border-top-right-radius
border-bottom-right-radius
border-bottom-left-radius
border-top-left-radius

As this method isn't finalised yet, Firefox, Safari and Chrome are making use of their own methods for the time being

Mozilla:
To round the lot: -moz-border-radius
To be specific:
-moz-border-radius-topright
-moz-border-radius-bottomright
-moz-border-radius-bottomleft
-moz-border-radius-topleft

Safari / Chrome:
To round the lot: -webkit-border-radius
To be specific:
-webkit-border-top-right-radius
-webkit-border-bottom-right-radius
-webkit-border-bottom-left-radius
-webkit-border-top-left-radius

So if you want to set a border-radius of 10 pixels to a div with the class 'rounded':

div.rounded {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
}

Nb: border-radius: won't have any effect for now, but we put it in there in anticipation of the glorious day when it will work across all browsers!

But what about the excellent Opera browser, and the many Internet Explorer browsers (complete with all their charming eccentricities that web developers love!) I hear you cry?

Well, nothing in CSS is THAT easy and so there is an inevitable hack.

First download this .htc solution: Curved Corner and add it to your site.

For example SITEURL/js/border-radius.htc

Then update the css as follows:

div.rounded {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(css/border-radius.htc);
border-radius: 10px;
}


For further tips take a look at Jon Raasch's excellent post on CSS rounded corners (particularly the note on the path to the htc file and the section entitled "Hoops you have to jump through for IE:").

Bear in mind that there are a lot of limitations with IE, so you may decide to ignore the hack and leave the site with square corners for browsers that don't support the property as well as putting the champagne on ice (for now).

Edit: 31 March 2010: Opera 10.5 has now been released, including full border-radius support!

Red Deer Now Developing For iPhone

That’s right! i wont give away too much information but stay tuned! Red Deer creative is currently in the process of developing a group of iPhone apps that will be handy in day to day life.

Breast Cancer Awareness Ad

The client, Allergan, came to LehmanMillet and said they needed an ad for Breast Cancer Awareness week, completed in 2 days (yes - concepted, shot and laid out in 2 days). The creative team, Pencilbox Studios' Joseph Banuelos and Lindsay Coluccio concepted the ad in one day. The sketch was client approved and a photographer was called to do the shot. Originally, the model was to be dressed in a pink leotard but that was abandoned in favor of a nude shot. The model was placed in at the exact position of the Breast Cancer pink ribbon, the shot was taken (and slightly manipulated). The ad was composed and sent out on time!

Postscript: The ad won a Print Magazine Award.

See What Happens When You Give Readers a Gift.

Pencilbox Studios’ Roxann Pope, working with Kia Motors, developed a publication survey program to track Kia associates’ reading habits and informational needs for Momentum magazine. To entice survey entries PBX commissioned a custom painted toolbox by hot rod artist Manuel Reyes as an incentive. A lucky survey entrant won the one-of-a-kind toolbox. The survey results? 96.7% of readers responded to the survey (not sure who that .7 person was) and overall responses were favorable. The ability to prove that good design works is always rewarding.

Survey Results: 89.5% responded that the design, imagery and layout of Momentum magazine is attractive; 94.2% agree the articles are written and presented clearly; 98.4% believe the information provided in Momentum is timely and relevant; 97.7% say Momentum is effective in fostering a sense of pride in being a member of the Kia family; 96.6% agree the publication inspired them to perform at a higher level of customer service and/or parts sales. All good.