KitFoxInk

Twitterpated 0.01b

kit.macallister@gmail.com (Kittrick) — Sat, 23 Jan 2010 23:38:00 +0000

Twitterpated!

What is Twitterpated? Twitterpated is an engine that turns tweets into tumblr posts.

After a long time in development it's ready for testing, however it's not open to the general public yet. If you would like an invitation please send an email to me here.

Free Google Chrome Sticker Icon

kit.macallister@gmail.com (Kittrick) — Thu, 14 Jan 2010 03:38:00 +0000

I love Iconfactory's StickerSystem icons, but there isn't an Icon in the set for Google Chrome! So I made one myself, free for you to download here. Control Click chrome, select Show Package Contents, select Contents -> Resources, and replace app.icns with the new one. I renamed the old one app2.icns in case I want to switch back. There you go!

Font Love - Baskerville

kit.macallister@gmail.com (Kittrick) — Sat, 31 Oct 2009 19:29:00 +0000

Do you know why this font has that wonderful old-world feel to it? Because it was designed in 1757! It makes me think of peppermint and old libraries, both of which are great things! It is a beautiful font for either titles or paragraphs. If you're using it in CSS try the following font family.

font-family: Baskerville, "Times New Roman", Times, Serif ;

And that's why we love Baskerville!

Google Wave Invite Giveaway!

kit.macallister@gmail.com (Kittrick) — Thu, 29 Oct 2009 02:32:00 +0000

[CLOSED]
The winning emails have been submitted to Google. I hope you're excited! Maybe you will be lucky enough to play with the developer build of some really cool technology!

Google says, "Invitations will not be sent immediately. We have a lot of stamps to lick." - So it may take a little while.

We have 15 wave invites to give out and we'd like to give them to one of you. All you have to do is leave a comment with your email address. The winners will be announced this Friday. Good luck, I hope you're as excited for Google Wave as we are!

Use Advanced CSS Selectors for Illuminated Letters

kit.macallister@gmail.com (Kittrick) — Wed, 14 Oct 2009 22:47:00 +0000

Get those fancy letters in on your page without having to wrap them in extra code!

Introduction

In times of yore, when books were copied by hand, monks would painstakingly illustrate the first letter of a new page to draw the reader's attention. These are known as illuminated letters and they are still used widely in print, especially in newspapers. Turns out they look great on websites too! Here I will show you how to easily implement this into your blog with only CSS.

Step 1 - The Hard Way

If you just want a big letter, styling it in css should be easy.

This produces the desired effect and works well if you only need to use the code one time.

The problem with using a span to select your illuminated letters is it will require you to hunt down every first letter and wrap another span around it. That makes for messy code and it's doing something that can and should be done by CSS.

Step 2 - The Sibling Selector

The important change that is made here is h1+p:first-letter. First we'll talk about the + selector. The + selector grabs only elements that are adjacent to one another. By using this we are selecting only paragraphs that come directly after a header. Of course this could be replaced with any number of other tags, for instance:

This selects the first paragraph after any div of the class header. NOTE, the sibling selector only works if the previous tag is closed. It cannot be encapsulated by the tag.

Bad:

Good:

Step 3 - The First-Child and First-Letter selectors

The first-child selector will select the first element contained by it's surrounding element. This is perfect if you contain your articles in a surrounding div. div.article>p:first-child will select the first paragraph contained by the article div. The > selector grabs all paragraphs contained by the div and the :first-child selector narrows it down to only the first one. However you only want the first letter, well there's a selector for that too. If you use p:first-letter the css will affect only the first letter of every paragraph. Now let's put it all together and select only the first letter of the first paragraph in a div.

This produces something like this:

As you can see, the CSS affects the first paragraph but not the second. Now you can either select elements based on what they follow or on the element that contains them. This should make adding beauitful illuminated letters to your blog a breeze. Remember:Only the first-letter selector is supported by IE6 so be sure to counteract that in an IE specific script if it produces bugs!

Keep orphans out of page titles with only basic HTML

kit.macallister@gmail.com (Kittrick) — Fri, 09 Oct 2009 06:51:00 +0000

For those of you that don't know, an orphan is when a single word pokes out at the bottom of a paragraph. When the line breaks this way it creates an awkward visual that breaks apart the look of the text.

This can be fixed with Javascript or PHP if you want to get really fancy about it, but if you don't want to get too complicated, the solution is beyond obvious. Use the   tag to insert a non breaking space between the words. For instance, the title of this post is written as

As you can see, there are actually no spaces in the last word, but the NBSP tag reads as space for the browser. This way the last two words break together no matter what. Visually it will look and read as though it were two separate words, however the code sees it as a single word. Viola, simple solution. No more orphans.

15 Mac Key Commands That Will Make You Look Like a Hacker

kit.macallister@gmail.com (Kittrick) — Sat, 19 Sep 2009 06:32:00 +0000

One of the great things about using a mac is the vast number of key commands built into them. When you don't have a right click button (or in my case, when you don't have a mouse at all) you get used to using key commands quickly. Key commands are a great way to increase productivity, and they make using your computer much easier. Here are 15 great key commands on the mac, hope there are some here you don't know about yet!

Beginner

Command Tab - Application Swap
If you don't already know this one, you really should. Command Tab swaps between your programs, it will bring up a little window showing the icons of each program, and in the order you last used them, so when you're swapping between two applications it's really fast. Use Command Shift Tab to swap applications in the opposite direction.

Command Shift 3 - Take Screenshot
You don't need fancy applications to take screenshots on your computer, just use Command Shift 3. If you don't need to take a picture of the entire screen use Command Shift 4 and drag your cursor over whatever you need a photo of. It will appear right on your desktop!

Command D - Duplicate
Why control click and select duplicate when you can use Command D to make a copy instantly. This is really useful when you're trying to multiply a large selection of files. If you make a mistake, just use Command Delete to get rid of the unnecessary files!.

Command Space - Search
When all else fails, just use search. Command Space makes it fast, which is what you want when you're frustrated by a lost file. If you want to open a new Finder window as well, use Command Option Space. If you REALLY REALLY can't find the file you need, try Command F to get an advanced search window.

Return - Rename File
Possibly the least used key on my keyboard, the ominous "Return" key seems to serve no function at all... but aha! Select any file or folder and with a quick stroke of the Return key rename away. All of a sudden that silly looking key is looking pretty useful!

Intermediate

Command Shift H - Hide all other windows
You may know about Command H, which hides the current window (Great when you need to clear a desktop quickly), but did you know about Command Shift H? This command hides everything except what you currently have open. Now you can focus on work instead of solitaire.

Command Shift U - Utilities
Command Shift U opens up utilities. I use a lot of the applications in utilities, but I don't use them often enough to keep the folder in my dock or on my desktop. It's really convenient to open up finder and hit Command Shift U and be right there. Other related commands include Command Shift A for Applications, and Command Shift O for Documents.

Command Shift T - Add to Dock
When you find you're browsing you photos folder too often for it to be convenient anymore, use Command Shift T to instantly add it to the dock. My dock rotates between folders all the time, I don't use this command a lot, but it still saves time.

Command Escape - Open Front Row
You may know how to open front row with your dinky little remote, but when you lose it what will you do? I spent a good hour looking for the front row application before I figured out Command Escape. Use the arrow keys to navigate, enter to select, and escape to quit.

Command Shift 4 Spacebar - Take Picture of Current Window
I talked about Command Shift 3 and 4 before, but what if you want just your working window? Hit Command Shift 4 then Space to select which window you need to capture, really useful when your working on tutorials or trying to make quick notes on connection settings etc.

Control Option Plus/Minus - Zoom In/Out
Instantly Zoom in and out with these two commands. Zoom Way in and Invert the screen and you'll really have someone thinking you broke their computer. Related commands include Control Option Command > and Control Option Command < Which increases and reduces the screen contrast.

Hacker

Control Option Command 8 - Invert Screen
I love the look on geek squads faces when I walk past a row of Macbooks and all of a sudden the screens are inverted. Use Control Option Command 8 to instantly invert your screen. Good for reading in the dark when you don't want to make a lot of light.

Command F5 - Open Voiceover
Who needs a screen to use your a computer? Use voiceover when you have a broken monitor. No need to be familiar with voice over, it will speak all of the instructions right to you.

Option Shift Command Delete - Empty Trash Without Prompt
"Are you sure you want to Delete These files?" Yes, we are sure, and now we can delete all of those pesky files with a quick key stroke. When I'm in the middle of a cleaning frenzy, I can't stand that little window. Good Riddance.

Command K - Connect to Server
Bet you didn't know you could open FTP connections directly in finder. That's right, you can drag and drop files right between folders. Who needs an expensive or complicated FTP client when it's built right into OSX. Seems too cool to be true, but give it a try.

Want a full list of Key Commands, here are a couple links with the full list. Check them out, let me know if you have any interesting ones I haven't heard about!

http://www.danrodney.com/mac/index.html

http://www.cnet.com.au/the-ultimate-guide-to-mac-keyboard-shortcuts-339289468.htm#3

Spoonflower - Custom Fabric on Demand

kit.macallister@gmail.com (Kittrick) — Fri, 18 Sep 2009 07:07:00 +0000

I have always thought online printing was a good idea. Custom books with Blurb or lulu, custom business cards with Moo or Vistaprint; your options with online printing are nearly limitless. Well Spoonflower takes it to a whole new level.

You can upload your own image, and order a yard of whatever you want to use. Talk about the ultimate DIY resource. I'm thinking of all sorts of creative ideas. Set down a google maps image of your house, then build your neighborhood in legos on top of it. Gimme your creative ideas, I'm sure there's endless possibilities.

Google Logo Crop Circles Mystery

kit.macallister@gmail.com (Kittrick) — Tue, 15 Sep 2009 19:46:00 +0000

Google once again mystifies us with a UFO themed logo.

The logo is accompanied once again by a mysterious tweet from the Google Twitter.This one reads:51.327629, -0.5616088 http://twitpic.com/hsfgl. Many people assume these are GPS coordinates, but who knows what they might mean.

View Larger Map

The previous Google mystery image was called 'GO_GLE', this one is called 'GOOG_E'.
Maybe the missing letters will eventually spell something? O,L... what's next? There's not that many words you can make of G, O, L and E.

I get the feeling this is leading somewhere, a product launch? An ARG? I think we need to wait for more clues.

Google Logo Unexplained Phenomenon

kit.macallister@gmail.com (Kittrick) — Sat, 05 Sep 2009 10:05:00 +0000

Today's (September 5th, 2009) Google logo features a UFO abducting the O out of Google. The image links to a Google Search for unexplained phenomenon.

Google has also posted this encrypted message:

1.12.12 25.15.21.18 15 1.18.5 2.5.12.15.14.7 20.15 21.19

on their twitter account. Each letter corresponds to a letter of the alphabet, translating to ALL YOUR O ARE BELONG TO US. This is a reference to the old Internet Meem of All your Base are belong to us. See Video.

Who knows what's going on over at Google. Maybe they're going to steal the O's from the internet. Then we will have to start using G__gle instead of Google.

Read more about his Unexplained Phenominon here.

Snow Leopard

kit.macallister@gmail.com (Kittrick) — Wed, 02 Sep 2009 06:09:00 +0000

Photo credit Betawolf311 on flickr Creative Commons.

I've just installed Snow Leopard on my computer and I just wanted to clear up a couple of rumors I've heard about Snow Leopard.

First of all, you can upgrade directly from Tiger (10.4) to Snow Leopard (10.6) without installing Leopard first. If you've been waiting to put leopard on your computer, put snow leopard on instead, it's only $29.

Growl Support. Yes, Growl has been working fine on my computer. I had heard a lot of rumors of no Growl support, but I haven't noticed anything different with it. If you know of certain programs that are no longer working in Growl, please leave a comment. It seems to be totally normal from my point of view.

Honestly, Snow Leopard isn't all that different from Tiger in my experience. The big difference is that all of the little bugs seem to be gone. I feel like I've just run a really good clean-up on my computer. It is running a little smother, a little faster, and all of my little glitches have disappeared. It's not all bells and whistles, just cleaner code. E.G. It's the difference between a new transmission, and new rims. Maybe you want rims on your car, but you the new transmission is really what you're going to appreciate in the long haul.

Please feel free to leave a comment if you have any questions or comments about Snow Leopard.

Edit: For more info on what's new in Snow Leopard, I recommend this excellent article on lifehacker. Here's another great article on how to upgrade to snow leopard.

Snow Leopard Performance Test from Gizmodo on Vimeo.

10 Invaluable Design Tools For Mac

kit.macallister@gmail.com (Kittrick) — Thu, 27 Aug 2009 10:07:00 +0000

Coda

My personal favorite IDE. Coda may not be free, but it's much cheaper than DreamWeaver and it's FTP integration and file browsing system are great. Netbeans and TextMate are both good options. Espicially Netbeans because it's free. If you start making some money in web-design, Coda is a good investment.

CyberDuck

Coda may have some good FTP options for code, but sometimes I need to move images or folders or any number of items between FTP servers. For that I use CyberDuck. CyberDuck is free, it's easy to set up, and best of all you get an awesome duck icon in your dock (trust me, this will wind up in your dock somehow).

FireBug

FireBug is an amazing plug-in for FireFox that allows you to debug your code live. It's also great to look at other people's websites and learn from their code. Firebug has really helped me clean up my code.

W3C Validator

Not only is it good design practice, but making sure your code is valid makes your code cleaner, easier to navigate, and it renders better across browsers. Once you get into the practice of closing all of your tags and making sure your tags don't overlap, you will code faster more confidently.

960 Grid System

The 960 Grid System is a beautiful way to start a website when you are still working out the design phase. 800px used to be the design standard for page width, but really, who's still using an 800x600 monitor? 960px is a pretty safe bet, and it's great to have some guidelines to work from when planning out your site.

MAMP

MAMP is a virtual server that runs Apache and MySql servers locally on your mac. This is the ONLY way to run PHP without uploading to a server. I hate it when my clients call me saying "My website has an error message, is it broken?" because I can't test on a server before going live. That's exactly why I got MAMP, and it works like a charm.

PhotoShop

Is it rude for me to say Duh? Trust me I've tried Gimp, I've tried Aviary (even the pro version), and nothing compares to good ol' fashioned Photoshop. I have a theory that photoshop was a divine tool stolen from mount Olympus and given to as a gift to all of mankind. Really, you have to have it if you're trying to design on a mac. No alternative.

Stickies

If you are a Mac user and you have yet to discover the beauty of Stickies, check your applications folder. I bet it's in there. Long time mac users are used to them because they make your life super easy. I use them all the time, for anything and everything. Digital sticky notes, saves time and trees.

WebDeveloper

My immediate reaction to the WebDeveloper plugin for Firefox was, "That's an ugly Icon," but after using it for a minimal period of time I quickly realized just how useful it could be. There are tons of useful tools built into it that have made my life so much easier. For instance, resizing the browser window to 800x600. Normally I have to screw with my resolution to test for that, now it's really easy. If you're a web developer, give it a try.

Xee

Xee is just a photo viewing program, like preview, only its 10x better. I can view animated GIFs, tons of file types that preview won't see, and I can flip through layers in a photoshop file without having to boot up photoshop. Why settle for the default photo viewer. I know it's a simple app, but I've found it really useful.

That about sums up my Design App roundup. Now I want to do a Firefox plugin round-up. I've got lots of those to talk about too. Feel free to leave a comment if you have any questions.

Coda VS Dreamweaver part II - Coda Wins

kit.macallister@gmail.com (Kittrick) — Mon, 27 Jul 2009 10:43:00 +0000

Well, I've finished the 15 day trial of Coda and the verdict is good. I've just purchased the full version. At $99, this is definitely cheaper than Dreamweaver. Coda is not only an excellent text-editor, it is a fully developed FTP program as well. Projects can also be worked on collaboratively via Bonjour, although I didn't have time to test that one.

Here's a rundown of some of my favorite features in Coda.

1. The Sites Page

This makes arranging my projects really simple. You can organize your pages by Site in Dreamweaver, but there's no visialization for it. This syncs my folders to my FTP server really quickly. Setting it up was really easy.

2. Editing Colors

Sometimes typing lots of code can get pretty confusing. That's why I like being able to customize my workspace as I feel is necessary. In coda I can change the colors of Syntax Highlighting for each type of code, invert colors, show or hide line number, and highlight the current line I'm working on. The last one is particularly useful because it's really easy to get turned around when I'm flipping between Photoshop and Coda and Firefox.

3. Find and Replace

When my client emails me and says "I misspelled my last name in the documents I sent you.", I really don't want to have to look through my entire website for every instance of the problem. I like being to search and replace locally as well as site wide, it makes fixing problems like that really fast and really easy. When I'm done finding and replacing, I just hit the Publish button, and my website is updated. Easy as pie.

4. Books

Coda comes with code reference books pre-installed. How cool is that? I love sites like W3 Schools, but when I'm on a train in the middle of nowhere, I need to be able to work without an internet connection. This is really useful.

There's lots of neat things about Coda that I'm getting to enjoy. I want to stress that I am not in any way affiliated with Panic.com or Coda. I am receiving no rewards for this article. I just like this program, which is rare for me, because code can be frustrating. I definitely recommend looking at the trial version here. If Dreamweaver didn't take 30 minutes to download, install, and start up, I might do a review of that one too, but I'm a busy guy.

Google Voice: First Impressions

kit.macallister@gmail.com (Kittrick) — Fri, 17 Jul 2009 10:46:00 +0000

I just received an invite to check out the new Google Voice. I won't lie to you, I'm pretty excite about this. I already use text to access my Google Calendar, which has made my life way easier.

If you check out my contact page, you can see it now has an Embedded phone widget that allows you to call my phone directly from the website. Google not only forwards your call directly to any number of phones, but it will also re-direct your voice-mail to a website specific voice-mail. This way I can keep business calls and regular calls separate without paying for multiple phone lines.

I can view my voice-mails, calls, and texts online. I can even read transcripts of my voice-mail if I'm at a computer with no audio. Google also let me pick out a number of my choosing, (505) 216-6548 [2166 KIT]. I'm not worried about giving my new number out because Google allows me to block annoying calls the same way I block spam in GMail.

I won't lie to you, I'm pretty excited about the potential for Google voice. I believe real integration of phone, text, email... any communication, is really on the way. Google definitely has something here. Check it out.

Coda VS Dreamweaver

kit.macallister@gmail.com (Kittrick) — Thu, 09 Jul 2009 09:24:00 +0000

I've been a Dreamweaver user for a long time. I ran through a long string of terrible editors before discovering Dreamweaver, which works pretty well for me. Granted, I am using Dreamweaver 8, which was built by Macromedia before it was bought out by Adobe. I'd like to upgrade to CS4, but that'll be $400. So I'm looking at Coda, a $99 code editor designed for macs.

The first thing I immediately notice is how fast the download was. When I downloaded the trial version of CS4 it took a good half hour. Coda was downloaded in seconds. The App is nice and lightweight, no installation required. It boots up WAY faster than Dreamweaver, which is a big pro for me. I often close Dreamweaver too quickly, hoping to free us some CPU, only to realize that I've left a bracket out of my code. Then I have to boot Dreamweaver up again, edit, save, close; the whole process is just time consuming.

The first thing Coda asks when launching, is to set up a new Site. It is very project oriented. I like this. Organization can be very hard when you're working with lots of files, and many projects, and multiple resources... It just isn't fun.

Opening an existing file is FAST. Another pro. I know CS4 was running much faster than Dreamweaver 8, but opening a file in Coda is instant. And the file browser is exactly like the Mac's finder. Very useful.

(Aside: I'm writing this review as I test the program, so these are initial impressions. Sometimes a program reveals problems weeks and weeks into development, so it's always good to have a backup.)

I'm really coming to like this program. I'm trying to be fair and unbiased, but honestly I am definitely impressed. Previewing sites is fast and easy. It has a built in CSS editor. It comes with built in reference books for HTML, JavaScript, CSS, and PHP.

For 1/4 of the price, and 1/4 of the load time, I'm thinking it's at least worth giving a try. I've got another 14 days left of the trial and I'll let you know if I discover more exciting things. Right now I'm going do some more testing, I'm excited!

UPDATE--
I've tallied the results, read the exciting conclusion here!

Choosing colors for the Web

kit.macallister@gmail.com (Kittrick) — Mon, 06 Jul 2009 05:10:00 +0000

While there are many wonderful colors to choose from when designing for the web, picking which ones work well together can be a pretty large chore. So why pick a palette at all? Keeping a defined color theme will enhance your subject, whether your website is for fun or for work, the colors you use can accentuate the overall tone of your website. It also makes the CSS coding a LOT easier.

From Blogger Pictures

I recommend checking out Adobe's Kuler. It allows you to build and share palettes online. You can start from scratch, or pull colors from an image.

For my new website I decided to use an image. I already have business cards printed out that matched my old website, so in order to keep a running theme between the two sites I used this image:

From Blogger Pictures

In general I like to start a website with an image. This image not only provides color information, but also gives me an idea of textures and shapes I can use throughout my website. For this website, I used an image of a nebula. I pulled some purples and oranges out of the image and voila, I had my palette.

From Blogger Pictures

Once I had my colors, I do a little manipulating in photoshop to make sure the colors are web-safe. Why do I do this? Even though most monitors and web-browsers can display many colors beyond what is technically deemed "web-safe", I use web-safe colors because they are always easy to remember. For example, I know off-hand that all of the purple-titles on my web page are #663399 (hexadecimal color codes). You can see how easy that is to remember. That way when I switch rapidly between Dreamweaver and Photoshop I always remember what colors I'm using.

When choosing a palette for web-design, keep links in mind. Your links will have to stand out next to your other text. Since I was working in a range of red-orange and purple colors, I decided to go with a good blue to make my links stand out. #336699 is another one of my web-safe, easy to remember colors.

Working with colors can be fun, and when you get good at it your design will look really snazzy. Experiment with mixing colors some time, see what you come up with.

Moving to Javascript

kit.macallister@gmail.com (Kittrick) — Fri, 03 Jul 2009 19:09:00 +0000

Adobe Flash is an amazing tool that allows interactive video and animation right on the web page. I've used it in the past and I know you can do a lot of cool stuff with it.

The problem with Flash is it's not open source. For programmers, that means you have to buy Adobe software to develop Flash, for consumers it means you need to download extra plugins in order to view Flash.

This is one reason why most cell-phones and smart-phones don't have flash video.

Javascript, on the other hand, is built right into any modern browser. It is fully capable of rich, interactive animation, and best of all, it's free to everyone. This means Google, Mozilla and others are free to develop and enhance it. Check out this video, running 3d entirely in Javascript.

This technology is free to everyone, and runs on the same code that has been available in browsers for over 10 years. This means when your site is developed in Javascript, you don't have to worry about backward compatibility.

If you are a developer working with Javascript, I highly recommend learning about code-bases like MooTools or jQuery.

These are pre-built code libraries that allow you to quickly throw in beautiful Javascript animation with very minimal work on your part. My navigation is an example. (Here is another example.)

To be fair, there are lots of things Flash does better than Javascript. For now, video is one of them. Html 5 (coming soon to a browser near you) makes use of a new tag called the video tag. This will allow for easy integration of video into Javascript applications. But, as of yet, Html 5 is not in common use.

I think I would advise to use flash sparingly, if it can be done quickly with Javascript, go for it.

Here are some good links if your interested in learning more.
http://www.webreference.com/programming/javascript/java_flash/
http://www.jonathanwagner.ca/2009/06/12/javascript-vs-flash/

Open for Business

kit.macallister@gmail.com (Kittrick) — Thu, 02 Jul 2009 07:46:00 +0000

Open For Business, originally uploaded by kitisconfused.

Oh my gosh you guys, it's new and it's shiny!

Please have a look and let me know what you think about it, I put a lot of hard work into it.

As I hope you can understand, a website is an ongoing project. That means if you find something that looks funny or doesn't make sense, let me know! That's what the super nifty contact form is for.

Also, if you're too lazy to read my blog, subscribe to it with either our Atom feed or our RSS feed.

One Week's Wisdom

kit.macallister@gmail.com (Kittrick) — Thu, 02 Jul 2009 03:16:00 +0000

One Week's Wisdom, originally uploaded by kitisconfused.

This is a website I just finished called One Weeks Wisdom. Check it out. I've been working on the code for this site for several weeks now and I am very proud of it. The woman I am working for does a lot of work promoting arts and health in Haiti. It's a very interesting project, so if you have some time on your hands, stop by and check it out.

Lego Font

kit.macallister@gmail.com (Kittrick) — Wed, 21 Jan 2009 00:21:00 +0000

This Lego Font is really great. I can definitely see myself using this in creative ways.

Edit: I just used some Lego fonts on my new business cards. Each card has a different Lego figure.

Ubiquity - Firefox Extension

kit.macallister@gmail.com (Kittrick) — Fri, 16 Jan 2009 09:54:00 +0000

If you're a computer person (know how to embed a youtube video) you should really check out the newest version of Ubiquity. It adds a command line to the internet. Type w dinosaurs and it will do a wikipedia search for dinosaurs. It's pretty nifty, and it's getting better by leaps and bounds with each new version. Try it out.

Website Overhaul

kit.macallister@gmail.com (Kittrick) — Fri, 16 Jan 2009 00:15:00 +0000

Website Overhaul, originally uploaded by kitisconfused.

My website has been fully overhauled! It's colorful and probably a little bit too trendy for it's own good. If you're reading this via Google Reader or Facebook you should check it out.

Tutorial Sites

kit.macallister@gmail.com (Kittrick) — Thu, 15 Jan 2009 20:48:00 +0000

Here's a couple of really good tutorial websites for Photoshop and Illustrator. You have to pay if you want the really nifty features, but most of the tutorials are totally free. I've already picked up a couple of really useful tips from them, check it out.
Vector Tutorials
Photoshop Tutorials

Newsprint Effect Tutorial

kit.macallister@gmail.com (Kittrick) — Tue, 13 Jan 2009 07:46:00 +0000

If you're tired of having crisp hi-res photos all the time, it's easy to ghetto-fy your pictures in photoshop. Click on any of the images to see a full sized flickr version.

Here's the original picture, it doesn't matter what it is.

And here's the edited version.

Take your pic and pull it into photoshop.

If you're in a rush, you can go to Filter > Pixilate > Color Halftone which does a decent job if you're not looking for a lot of detail. This actually works pretty well when you're working with hi-res photos.

If you want to do it by hand, however, it's a little bit more difficult. Start by creating four new layers and fill one of each with Cyan(#00FFFF), Magenta(#FFFF00), Yellow(#FF00FF) and Black(#000000).

Now create three new layers and create a dot matrix pattern on each of them, it's better if they're a little bit different on each layer. I got mine here.

Place a half tone layer above each of the CYMK layers and set the layer to lighten, then merge the layers together.

Once you've done this for all four layers, copy the original image and paste it into four new layers. Set them above the CYMK layers and set them to lighten. Each layer should look something like this.

Merge again so that you have four CYMK layers. Set each layer to multiply. If you move the layers around a little bit you get a misprint effect which makes it look very news-papery. If it looks a little too light, copy the black layer and set it to multiply again, printers do this all the time to save money.

Hopefully your end result looks something like this. If it doesn't leave questions in the comment box. I'll try to answer any of them I can.

Color Management for Web Designers

kit.macallister@gmail.com (Kittrick) — Sun, 11 Jan 2009 07:48:00 +0000

Here's a really good article I found for setting up optimal color management in photoshop and on your monitor so that things look the same between computers. This is very important when doing web design, I know I've run into this problem before. I'll tell you, the difference is immediately noticable.