With the exception being the iphone, I rarely take much notice when Apple makes a hardware release. This is mainly just because I’m already happy with the Apple hardware I have and don’t normally run out and buy the latest Mac. I like to run my stuff into the ground (as some of you know with my car). However, I found yesterday’s announcement particularly interesting thanks to the comments of Marco, the lead Tumblr developer. His main point being that the great screen (worth reading about) found in the 27″ iMac is now available available in September on it’s own for $999. That’s certainly not cheap for a screen, but Marco sums it up nicely when he writes:

The old 30” Cinema Display, which cost $1799 with the same horizontal resolution, slightly more vertical resolution, and much worse response time, contrast, and image quality, has just been effectively replaced with a $999 monitor that’s far nicer.

So in a sense it’s like an $800 price drop. I’ve been strongly considering a new iMac that can handle more RAM than the 4GB limitation on my current one. However, with this observation by Marco, I now see a MacBook Pro as a very possible alternative. What do you think?

I followed the post’s advice and changed my cache size from 128K to 1024K and I saw a HUGE gain in performance. My RAM usage with the same file when down by nearly 1 GB when opening the same file (I generally deal with 40MB+ psds)! I am pleasantly surprised at this little trick and I’d encourage you to check it out yourself.

Here’s the original post.

This is an image I made for fun. I took the photo as well as made the artwork. Hope you enjoy it.

A similar message for groups

So naturally, I googled for a fix and surprised to find no decent answer, I went back to trying something myself. What I realized was that this was the result of using the marque tool earlier and somehow improperly deselecting. If you happen to run into this problem, all you need to do is grab your marque tool (M) and select an area then delect. Or, you can go up to the Select menu, and click “deselect.” This solved the quirky little error for me. Let me know if it works for you too!

Let’s say you want to make a shape like this:

This simple little shape can't be cut out with a group, you must use a compound path

I’ll quickly show you how using a compound path, you can make it!

First, make a shape close to this using the pen tool or reshaping a rectangle

Now we need to grab the rotate tool and alt-click where the center of the circle should be. This should bring up the dialog box pictured below. Check the preview box to see where your shape will end up as you put in a number. I used the number 60 to end up with 6 shapes (360/60 = 6). Click copy to duplicate the shape into place.

Hint: use the copy button on the rotation tool to quickly duplicate your shape in a circular pattern

To speed this up and keep everything properly centered, just hit cmd/ctrl+D to repeat the copy until you have enough shapes.

Use cmd/ctrl+D to skip the menu

If you add a rectangle behind your shapes, you should have something that looks like what’s below. Go ahead and group the “rays” or “blades” together.

Now with both objects selected, if you were to hit the “intersect” button in the pathfinder panel (pictured below), you would be hit with a warning message.

With only your group selected, we can make a compound path by navigating to Object > Compound Path > Make.

Use cmd/ctrl+8 to quickly perform this step

Now before you hit intersect, my recommendation is that you first select the object in the back, and quickly hit cmd/ctrl+C and cmd/ctrl+F to paste a copy in front to intersect with. That way, when the shapes have been trimmed, you still have a rectangle in the back, like this.

Now throw a circle over your new shape, hit “Unite” in the Pathfinder panel, tweak the color a bit and you’re done! Sorry it’s not prettier, but hopefully you get the idea. If you have any trouble following this tip, or if you find it useful, please let me know in the comments!

This simple little shape can't be cut out with a group, you must use a compound path

1. 2GB of Free Online Storage

This is a biggie. If I had known this, I would’ve been using Dropbox months ago. Dropbox gives you a free no-credit-card-attached 2GB account for absolutely nothing. This is definitely enough to get you started and I am blown away they even give you that much.

2. Works On All Major Operating Systems

Windows, Mac, and Linux are all supported by Dropbox thus allowing you to synchronize files across computers and OS’s. The Mac version has worked flawlessly for me. In addition, Dropbox has browser access and an iPhone app. The iPhone app is pretty impressive too. It allows for offline access as well as uploading and deleting of files.

3. 250MB More Per Referral

Every time you get a friend to jump onboard, you get an extra 250MB of space added for free! So what are you waiting for? Sign up and give me 250MB of space!

Honorable Mention: File Sharing

If you need to share something publicly, just drop it in your public Dropbox folder, right-click and copy the link and send it out!

Rounded corners on Merig.com Firefox vs. IE

Currently, I am finishing up a design/development project for Meriwether Godsey, a catering company based here in Lynchburg VA and my current employer (until Feb 26). The design features a series of rounded boxes to feature all of their sidebar content as opposed to a “stacked blocks” look it had before. I had an interesting revelation during the development of this site. I came to my boss with the proposition of giving modern browsers the CSS to have rounded corners, knowing that IE would be forced to render the content as squared “blocks.” After showing her the proposed solution in both sets of browsers, she replied “that’s fine!” I was a bit stunned, but excited at the same time. My goal was to save development time and to ensure cleaner code while providing a nicer look. In addition, I was able to save the user precious seconds that they would spend waiting on another image to download.

Was It Worth It?

With the bulk of the code now done, I can ask myself “Was it worth it?” The answer is a resounding “YES!” Using CSS3 now saved development time, it got the boss’s approval, it saves the user time, and eventually Microsoft will catch up with the rest of the world and users will see these great-looking corners. In the mean time, it’s not a big sacrifice. The design doesn’t look bad in Internet Explorer, so it’s not a big loss. If you’re on the fence about jumping into CSS3, my suggestion is go for it! You’ll be glad you did.

Blog Question

I write these articles for you, the reader more than for me. I want everyone to benefit from what I’ve learned. So, my question is “Do you like a shorter format like this? Or would you rather see a more detailed article?” I’d really appreciate it if you let me know in the comments or on twitter. Thanks!!

Going Fulltime

I’m so excited to announce today that I have turned in my notice with Meriwether Godsey, my employer for the past 4 months. I’ve been working around the clock to get Painted Digital off its feet and I will continue to do so in the coming months, but starting March 1st, I can devote 100% of my waking hours to building fantastic websites, making fun logos, drawing crazy illustrations, and all that boring stuff that comes with running a business. I’m going to try and increase my blogging to twice a week and if there’s any guys out there who love all those things as much as I do, let me know and we can start a podcast.

Podcast Transcribing

Speaking of podcasts…I’d like to let everyone know that Christina will be coming on board part-time to offer transcription services to all you video and audio bloggers and podcasters. We know that as the web moves forward, media is just going to get bigger, but you’ve gotta help search engines and more importantly, the hearing impaired, find and access your content. In conjunction, I’ll be doing a slight redesign to our homepage in the coming weeks.

Money Money Money

Here’s the announcement that you really want to read. From today until March 12, 2010, if you can bring me a paying referral, I will give you 5% of the sale or $50, whichever I can afford. I hope this excites you! It really excites me! Thanks for reading.

In this post, I will introduce you to the latest analytics code from Google, show you how you can update your inline external link tracking to work with it, and then demonstrate how to use a javascript framework to do all the heavy lifting for you.

Back in December of 2009, Google released a fantastic update to it’s analytics (urchin?) app which they called asynchronous tracking. Without getting technical, the big advantage of this update is that it loads the necessary files faster. In addition, you can now safely move you analytics code into the head of your HTML. This matters because you can get a better idea of who is coming to your site and “bouncing” away before the entire page loads. When the script is in the footer, a visitor can leave before the page fully loads and Google never tracks the visit.

Here’s the new asynchronous script from Google:

var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga);
  })();

How to update your external or outgoing link tracking

I don’t claim to be much of a developer (you’ve been warned!) so my big dilemma was figuring out how to get outgoing link tracking working with the new google analytics code. You can find the official usage guide here, but it wasn’t clear enough to me, so I went searching for a better explanation. I found a nice write-up well worth reading on using the async script and jquery to track click events here, which I’ll come back to, but what I initially wanted to know was how to track outgoing links inline with an “onclick” event.

The old method was to use the “_pagetracker” variable and looked like this (if you were linking to my site for example *wink* *wink*):

<a onclick="pageTracker._trackPageview('/outgoing/painteddigital.com');"  href="http://painteddigital.com" target="_blank">

But the new method uses the “_gaq” system to manage things and throws in some brackets to confuse you, but you can format it like this:

<a onclick="_gaq.push(['_trackPageview', '/outgoing/painteddigital.com']);" href="http://painteddigital.com" target="_blank">

That’s all there is to it! …unless you want to make things easy for yourself and automate this so you don’t have to enter it into each link. With Jquery, this is is pretty simple. I have a client who needed to track on Joomla which is stuck on Mootools 1.11 so I’ll post that code here as well.

How to automatically track outbound links with JQuery

I recommend that you also use the new Google CDN Ajax library to load your JQuery for you, so I initialize with that (If you have any questions, just ask in the comments). You could also switch out target*=”_blank” for rel*=”external” if you use that tag.

google.setOnLoadCallback(function() {
	$('a[target*="_blank"]').click(function () {
		_gaq.push(['_trackPageview','/outgoing/'+$(this).attr('href')]);
	});
});

How to automatically track all external links with Mootools 1.11

The try/catch isn’t necessary, but it’s a nice catchall

window.addEvent('domready', function() {
	$$('a[target*="_blank"]').addEvent('click', function(){
		try {
			if(_gaq) {
				_gaq.push(['_trackPageview', '/outgoing/'+ this.getProperty('href');]);
			}
		}
		catch (err) {}
	});
});

If you find that something I’ve posted is not working out for you, let me know and I will try and help in the comments as best I can.

More reading from Google:

Google Analytics Blog: Google Analytics launches asynchronous tracking
Google Code Blog: Google Analytics Launches Asynchronous Tracking

A couple days ago on Twitter I made the statement that what Apple ”would announce [today] could change the face of the design industry.” After seeing the official announcement, I’m more confident than ever of that fact. Apple’s new device has the potential to make even more of an impact on those of us in the creation industry than the iPhone.

1. Jobs. No, not that Jobs, new positions

The number one way I see the iPad affecting these two industries is the creation of jobs. New positions will be created specifically for designing for this device. Much like there are designers for email marketing only and designers who specialize in iPhone apps, there will soon be the opportunity for a whole new platform to be designed for. But I’m not just talking a designer for an app or a game. I’m also saying that The New York Times, Time Magazine, and plenty of other companies will be hiring new designers to format their site and their content for this device daily. It’s extremely exciting!

2. Comic book subscriptions.

While not yet annouced, I predict that we’ll see nearly every major print media company moving quickly to this device, including comic book distributors [Edit: I found this site today. Looks like they're working on a marketplace for artists]. All comic book artists need to jump on this thing, especially those who produce their own content. Hopefully we’ll see the new iBook store open up to small companies as well as the big guns. To give you an idea of what’s possible, check out this youtube video by Sports Illustrated and image the possibilites.

3. A Transformed Portfolio

Scott Bourne has just done a quick article on how the iPad will rock photography.  He brings out the idea of handing over your tablet with a portfolio open. This could just as well apply to anyone with a visual portfolio. Handing an open laptop just doesn’t seem as graceful as giving someone a flat touchscreen device. They can view all of your artwork with you in a way that I think is far more intimate than even a laptop can accomplish. All the while, you are explaining each detail of your work.

Image Courtesy of Engadget

4. Finger Painting

Brushes is an app that’s currently available in the iTunes store for the iPhone/iPod that was demoed today during the Apple keynote and has been re-written specifically for this device. I think we’ll see many similar apps show up (Adobe has release a version of Photoshop for the iPhone) that will enable portable painting and drawing like we’ve never seen.

Image courtesy of Axiotron.com

5. Killing the ModBook and the Wacom Cintiq

The iPad is an ultraportable tablet. Right now, there aren’t too many artists who would willingly tote around a laptop and a tablet whereever they go. The only device on the market offering comparable portability is the ModBook. If you haven’t checked it out, I suggest you hurry before it becomes extinct. The iPad could potentially eliminate the need for a Wacom cintiq (drawing tablet with built-in screen) and save hundreds you’d spend on a ModBook IF it can support a pressure-sensitive stylus and someone makes it.

Am I Crazy?

What are your thoughts? Do you think I’m a crazy fanboy? Or do you see some potential killer feature that I’ve missed? Let me know in the comments.

Further Reading:
Some really good observations for designers
How iPad Affects the Way we Design Websites?
The Unofficial Apple Weblog did a nice write-up with more thoughts on comics on the iPad
“iPad in the family: What it’ll take”
Ivan has a similar write-up on creativebits.org that takes a different approach
“What Does the iPad Mean for Designers“