I’ve been on the fence about Twitter. At first I didn’t see any value in it. I thought it was a way to spread a huge amount of useless, narcissistic information. However, I decided I’d better try it out before passing judgment. Now, I’m intrigued - still uncertain, but curious. I’m finding it very useful for getting and sharing good information about design and development. I’ve gotten some great tips and discovered good resources through the designers I’m following. I’m still not interested in finding out where they’re eating dinner or what kind of coffee they’re drinking, but I don’t mind sifting through those posts to get to the good stuff. Sometimes a quick glimpse into someone else’s life provides a smile and a little break from the work day. That’s not a bad thing.

I’m steadily learning more about how it works. For example, you can use hash marks (#) to tag keywords in posts. Here’s a great explanation from Kristine Wirth: http://kristinewirth.com/that-mysterious-sign-in-twitterwhat-does-it-mean/. You can also “retweet” other user’s posts to share good info with your followers. You can address a post to another user by putting @username before your post (these are called “at replies”). It’s a nice way to quickly send a message to someone or reply to one of their posts.

The following video talks about the value of Twitter’s search engine. This is an aspect I hadn’t considered until I saw this video. I like the idea of “the most contemporary thought stream humanity has ever seen.” Check it out:

So, my advice is this: try it out. Experiment, play, figure out if there’s a place for it in your life. At the least, we humans keep trying to connect with each other. That’s what it’s all about, right?

By the way, if you want to follow me on Twitter, I’m @dgraydesign. Happy tweeting!

If you’re not familiar with jQuery, it’s an open-source JavaScript library which simplifies adding interactive functionality to your website. In this tutorial, I’ll show you how to use ThickBox, one of my favorite jQuery plugins, to create a simple, yet elegant image gallery.

First, Create the HTML page to display your gallery. My sample is just a centered div (margin: 0 auto) with two sets of thumbnails housed in their own divs. The images are floated left with some right margin applied to each. Feel free to use the code as a starting point. The styles are included in the head tag.

In Photoshop, size the thumbnails (uniform sizes work best) and create the larger images that will open when the thumbnails are clicked. I used 450px x 350px for my large images, and 200px x 142px for the thumbnail images. I applied the following style to my img tag to give the images a white border and some space between each thumbnail:

div.gallery img {

border:1px solid #fff;

float:left;

margin: 0 30px 20px 0;

display:inline;

}

You’ll need the following files for jQuery and Thickbox:

Download the current version of jQuery from jquery.com

Download the ThickBox plugin.

Download the loading animation. (right-click and save to your computer)

Download thickbox.css – the ThickBox style sheet

Now you’re ready to put it all together.

In the head of your html document, add links to the jQuery and ThickBox scripts, and link to the thickbox.css style sheet. If you want to use the following code structure, make sure you’ve placed the jquery.js and thickbox.js files in a scripts directory and the thickbox.css in your root directory:

<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/thickbox.js"></script>
<link href="thickbox.css” rel="stylesheet" type="text/css" />

Place the loadingAnimation.gif file in an images directory. If you choose to rename it or place it in a different directory, be sure to update the file path in the thickbox.js file.

On each of your thumbnail anchor tags, link to the larger images and add a class of “thickbox.” The code will look like this:

<a href="images/image1_lg.jpg" class="thickbox"><img src="images/image1.jpg" width="200" height="142" alt="image 1" /></a>

If you’d like for the user to be able to navigate through a slideshow of all the images when the thickbox image opens, just add a rel="gallery" to the anchor tag. You can use any name you’d like as long as all the images have the same name. Here’s the link with the added code:

<a href="images/image3_lg.jpg" class="thickbox" rel="gallery"><img src="images/image3.jpg" width="200" height="142" alt="image 6" /></a>

You can also use thickbox to display HTML in an iFrame. Simply append the url of the html link with “TB_iframe=true&height=400&width=600″ and adjust the size as needed. The code should look like this:

<a href="text.htmlTB_iframe=true&height=400&width=600" class="thickbox">Click here</a>

See the demo for an example of ThickBox with an iframe.

That’s all there is to it! You can play with the thickbox.css styles to customize your gallery – be creative!

Finding the right color palette for a website design can be challenging. Often the client’s logo will dictate the dominant colors, or you might be basing the design on a photo from which you can sample colors. When I’m struggling with finding the combination that makes it all come together, I turn to some great online color resources - these are my favorites:

Adobe’s Kuler - http://kuler.adobe.com/ Explore palettes, search by tags, save your favorite themes, and create your own to share with other designers. View this tutorial video from AdobeTV to learn more about Kuler. I especially like having the ability to create a theme from a photo.

ColorJack - http://www.colorjack.com/ Hover over a color to see a palette suggestion. Don’t miss the articles section for some interesting background about color symbolism and psychology.

Daily Color Scheme - http://beta.dailycolorscheme.com/ Know of other good color resources? Please share them in a comment. Happy coloring!