Kid Cudi (feat. MGMT & Ratatat) - Pursuit Of Happiness

Thursday, March 11, 2010

Posted by Chris Barr on 03/11 at 12:20 AM
Filed under Music, Video/Motion Graphics0 Comments

Broken Bells - The High Road

Posted by Chris Barr on 03/11 at 12:12 AM
Filed under Music, Video/Motion Graphics0 Comments

New Years Resolutions

Friday, January 01, 2010

It’s a new year, and a new decade. I know 2010 will be a great year for me, and I’m going to do my best to make sure of that by setting a few new years resolutions for myself.

  • Take 1 photo a day and blog it to force myself to get more creative - I’m keeping it in a tumblr blog you can follow here: http://2010photos.tumblr.com
  • Lose 10 pounds
  • Make a short film about my trip to Togo, Africa in July
  • Try to get a photo published somewhere or in a local gallery

So most of these are photography related, but I think these all revolve around my trip to Africa later this year. This is more than likely a once in a lifetime trip, and I really want to make sure that I take some amazing photos and videos to remember it by.

Posted by Chris Barr on 01/01 at 05:01 PM
Filed under General, Photography, Projects3 Comments

So, Photoshop crashed on me.

Thursday, December 31, 2009

I hope this helps the nice people over at Adobe.

Posted by Chris Barr on 12/31 at 07:13 PM
Filed under Design, Macintosh, Comedy, Tech0 Comments

Fantastic Album Art

Friday, November 27, 2009

I wanted to show off some amazing album art from my music library, so I've picked 24 of my absolute favorites (arranged alphabetically). My rules for selecting these was to purely judge them based on the artwork, not on the actual music itself.

Some just have amazing photography, others just focus on great use of typography. All in all, I love each piece of album art (and the music.)



Ben Folds - Ben Folds Live

[iTunes] | [Amazon]


Chemical Brothers - Push The Button

[iTunes] | [Amazon]


Death Cab For Cutie - Transatlanticism

[iTunes] | [Amazon]


Derek Webb - Stockholm Syndrome

[iTunes] | [Amazon]


Feist - The Reminder

[iTunes] | [Amazon]


Frou Frou - Details

[iTunes] | [Amazon]


Iron and Wine - Our Endless Numbered Days

[iTunes] | [Amazon]


John Mayer Trio- Try!

[iTunes] | [Amazon]


John Reuben - The Boy Vs. the Cynic

[iTunes] | [Amazon]


Johnny Cash - The Legend of Johnny Cash

[Amazon]


José González - In Our Nature

[iTunes] | [Amazon]


The Mars Volta - The Bedlam in Goliath

[iTunes] | [Amazon]


Modest Mouse - Good News for People Who Love Bad News

[iTunes] | [Amazon]


Norah Jones - Not Too Late

[iTunes] | [Amazon]


Radiohead - Hail to the Theif

[iTunes] | [Amazon]


Regina Spektor - Begin to Hope

[iTunes] | [Amazon]


Sarah McLachlan - Wintersong

[iTunes] | [Amazon]


Shawn McDonald - Simply Nothing

[iTunes] | [Amazon]


Sufjan Stevens - Illinoise

[iTunes] | [Amazon]


The Flaming Lips - At War With The Mystics

[iTunes] | [Amazon]


The Shins - Chutes Too Narrow

[iTunes] | [Amazon]


UNKLE - War Stories

[iTunes] | [Amazon]


Wilco - Yankee Hotel Foxtrot

[iTunes] | [Amazon]


William Shatner - Has Been

[iTunes] | [Amazon]
Posted by Chris Barr on 11/27 at 07:15 PM
Filed under Photography, Design, Music2 Comments

Ramona Falls - I Say Fever

Saturday, November 07, 2009

Posted by Chris Barr on 11/07 at 10:56 AM
Filed under Music1 Comments

Detect browser support for CSS properties

Tuesday, September 22, 2009

Adding shadows or rounded corners to any element is way more trouble than it should be, especially if you're tried out some of the newer CSS3 properties. A simple two lines of CSS can get you these amazingly gorgeous effects, but as expected they aren't supported in every browser (I'm looking at you Internet Explorer!)

Some older versions of browsers that do support these features don't use the official W3C method and you have you use a vendor specific CSS property,like so:

#coolElement{
    box-shadow:#000 3px 3px 8px;
    -moz-box-shadow:#000 3px 3px 8px;
    -webkit-box-shadow:#000 3px 3px 8px;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
}

So, that of course won't work in IE, and if you want to have rounded corners or shadows on IE you have to make some custom PNG images and align everything properly. It's a lot of work, but it must be done if you want it to look consistent across all browsers. I realized today that ideally I want to do both, meaning that I want to use the pure CSS method when it's available in the browser, and the old clunky way otherwise.

Sure I could just see what works in each browser and only allow certain versions of browsers, but I'd always have to come back and update that list as future browsers add support for these things. Instead, why not test and see if the browser supports these features first, and then decide what to do.

function supportsBoxShadow(){
  var s=document.body.style;
  return s.WebkitBoxShadow!== undefined||s.MozBoxShadow!==undefined||s.BoxShadow!==undefined;
}
function supportsBoderRadius(){
  var s=document.body.style;
  return s.WebkitBorderRadius!== undefined||s.MozBorderRadius!==undefined||s.BorderRadius!==undefined;
}

Those functions will return true if the CSS property is supported in the browser, and not just the W3C property, but the vendor specific property as well. If there's some other property you want to test, follow the same pattern and just use CamelCase and remove the hyphens.

So putting this into practice is pretty simple, assuming we use the CSS property defined above.

if(supportsBoxShadow()){
    //Woo! We don't have to do anything! CSS does all the work!
}else{
    //Write your complex code here to position your PNG shadows.... :(
}
Posted by Chris Barr on 09/22 at 09:43 AM
Filed under Web, Code, Javascript, CSS1 Comments

Comparing jQuery objects

Tuesday, July 21, 2009

Just wanted to post a quick blog update with a cool jQuery trick I’ve been using recently. Every now and then I need to compare one jQuery object to another but a simple $(this) == someObject doesn’t do anything. As it turns out jQuery objects are actually stored internally as an array and you can’t just directly compare arrays.

So with that in mind, the easiest and quickest solution is to just access the items in the array and compare those instead. Luckily the very first item in the jQuery array is all we need here, so to access it you simply need to put in square brackets the array item number you want like so: $(this)[0]. So check out the code example below.

<div id="nav">
    <a href="#">link 1</a>
    <a href="#">link 2</a>
    <a href="#">link 3</a>
    <a href="#">link 4</a>
</div>

<script type="text'javascript">
$(
    allItems = $("#nav a");  
    secondItem = $("#nav a:nth-child(2)");

    //loop through each item in this jQuery collection
    allItems.each(function(){
        //Compare the current jQuery object with the saved jQuery object
        //by accessing the first item in the array of each object.
        if($(this)[0] == secondItem[0]){
            //we are on the second item! Give it a red background
            $(this).css("background-color","red");
        }
    });
});
</script>

   

Posted by Chris Barr on 07/21 at 09:21 PM
Filed under General, Web, Code, Javascript3 Comments

Five Words That Will Rock Your World

Tuesday, June 02, 2009

My church asked me to make a quick video intro for a new 5 week sermon series titled "Five Words That Will Rock Your World." The graphics were already made, I just had to animate it somehow. It's been a while since I last touched Adobe After Effects, but I think I came up with something pretty decent.

I originally made this as a standard 4:3 video at 720x480 to fit on the projector screens at church, but I decided to re-render this in 16:9 720p HD so I can have a good archival copy for my portfolio and just so it looks great online. The original 4:3 video took roughly 5 hours to render out on my MacBook Pro (which I had to do 3 times due to various mistakes and errors!) and the larger 720p version took 10 hours!

The music is "Life Inside You" by Matthew West from his album Something To Say (Amazon MP3 download page)

Five Words That Will Rock Your World from Chris Barr on Vimeo.

Posted by Chris Barr on 06/02 at 09:02 PM
Filed under Design, Projects, Video/Motion Graphics0 Comments

Great Videos I Like

Monday, June 01, 2009

Here's some great videos I've found recently. This first one is a short documentary by Northern Lights about a still working 8,000 pound analog letterpress called the Kludge. Beautifully filmed!

KLUGE from Northern Lights on Vimeo.

This is a great music video by McBess - I'm overly impressed that they not only made the animations, but also the music! Everything here was made by them (or this one guy, I can't tell how many people...)

WOOD from mc bess on Vimeo.

Another great music video for Death Cab for Cutie's song "Little Bribes", but this one's made by Ross Ching. Really catchy song, which is really enhanced by this awesome stop motion/time lapse video.

Death Cab for Cutie - Little Bribes from Ross Ching on Vimeo.

Lastly, a series of time lapse video from Tokyo.

static : pulse from Samuel Cockedey on Vimeo.

Posted by Chris Barr on 06/01 at 09:50 PM
Filed under Photography, Music, Video/Motion Graphics3 Comments
Page 1 of 8 pages  1 2 3 >  Last »