Archive for the ‘Design’ Category

Dual Monitors:Wallpaper Techniques

You’ve just gotten your computer set up with dual monitors. You’re sporting the true sea of information, baby! Only problem is, you don’t want to see the same crappy image on both:

Double your wallpaper, halve your coolness.

Double your wallpaper, halve your coolness.

…and you definitely don’t want to stretch a wallpaper intended for a single monitor onto two.

Stretching the desktop image is for losers, not designers.

Stretching the desktop image is for losers, not designers.

I’ll present a few different ways of getting your monitors to show independent pictures on each desktop, and as a bonus, you will learn how to span a single dual monitor wallpaper onto dual monitors. Then you can use the high-quality dual monitor wallpapers I’ve created for you.

Active Desktop

Originally created for Windows 98 (actually, IE4, which almost converted Win95 to Win98), this gem allows you to have any item that Internet Explorer is capable of rendering directly on your desktop, and offers slightly more customization of monitor content.

Active Desktop was originally intended for Microsoft advertising trolls partners to push crap useful targeted product notifications onto Microsoft customers, but works for putting strange items on our desktop. You can even set entire web pages as your desktop.

In the Display Properties, under the Desktop tab, click the Customize Desktop button. In the window that appears, click the Web tab, then the New… button. A dialog will appear that allows you to select a web page or image. After you pick your image, you should see a bar above your new image. Drag this bar to the appropriate monitor, click the maximize button, and your wallpaper should be covering the monitor. Right-click the desktop and select Lock Web Items on Desktop to keep it from moving around.

Merged Files

This method simply involves stitching two wallpapers together, side-by-side, so they form one continuous image that matches the vertical dimension of my monitors, and double the horizontal dimension.

For example: my monitors run at 1600×1200, so I create an image sized 3200×1200, and paste the two wallpapers I’d like to use next to each other. Photoshop, by default, has snapping enabled, so I don’t even have to pixel-align them. I save out this new file, and set it as my wallpaper with the Position to Tile. Setting it to Tile forces the wallpaper to begin at the top left and span as far as it can before tiling. In our case, the tiling happens offscreen, giving us the appearance of two separate wallpapers on each monitor.

This is the method I use, because I always have Photoshop open, and don’t use Active Desktop. I also use this method to merge two wallpapers into one continuous image, or create a new wallpaper from scratch. All my original dual-monitor wallpapers were created this way, as shown below:

Dual-monitor continuous image set to Tile.

Dual-monitor continuous image set to Tile.

Third Party Application

If you’re not the do-it-yourself type, you may just want to download an application to handle all of this for you. A third party application has the benefit of sometimes offering additional functionality, such as dual-monitor window management.

As far as management applications go, I’d have to say Ultramon is, by far, the highest recommended application out there. It supports more than 10 monitors, and provides window management along with a host of other features. Unfortunately, it is $40, but from what I’ve read it’s well worth the cost, especially with more than two monitors. I have not used it myself, so can’t make a recommendation for or against it.

The software that came with your graphics card may provide this functionality as well. nVidia’s nView Control Panel applet supports separate wallpapers, and I’d think ATI’s CATALYST software does too.

John’s Background Switcher not only switches your desktop automatically with images from Flickr, Picasa Web Albums, Facebook, DeviantArt, and almost any other source, it will switch your monitors independently, saving you from the bother of messing with them at all.

I use WallPapa to switch my desktop backgrounds. It only supports dual monitor wallpapers as a side effect of the “Tile” technique above. Your wallpapers must be stitched together beforehand. It also has…other issues, but that’s an entirely different discussion.

Adobe CS4 Issues and Mini-Review

Adobe has decided to make more of a commitment to customer support. They are teaming up with a global service provider, so I assume that means outsourced phone support. The best place to take your change requests is the Adobe Feature Request form.

This is a really, really long post. It’s long both because the Adobe Creative Suite 4 is vast and encompasses many software packages, but also because I found a great deal of things to complain about. While complaining is nothing new for me, finding this many problems with a mature software product is.

In this post, first I will detail the problems I encountered using the CS4 products, some action items for Adobe, state a few positives, and an overall conclusion. I do not intend to review all of the new features (which are many).

Note that this post is about the Windows version. I believe many of these issues are not present on a Mac system, but I can’t make any assumptions, because I do not own a Mac, nor have I used CS4 on a Mac.

Photoshop

We’ll start with Photoshop, because I’m guessing that the majority of people experiencing a CS4 product will be using Photoshop CS4.

First, the interface, which was the source of the lion’s share of the problems I had with CS4.

Photoshop CS4 changes things up by presenting a mostly familiar interface, but uses custom window chrome. All of the curves have been taken out of panels, which you may remember from CS or CS2. CS3 featured more standard-looking tabs on its panels.

Photoshop CS4's custom chrome and square tabs

Photoshop CS4's custom chrome and square tabs

I actually don’t have a problem with the panel tabs, as the new look is very clean. I also understand the reasoning behind removing the window chrome, as it presents a bit more usable space with the menubar riding the top edge. I guess it’s more Mac-like, but it does break with Windows convention, which is to have a titlebar. Not a huge deal, but it does present additional problems (more on this later).

One thing about the tabs I do have a problem with, however, is the way tabbed documents were implemented. The tabbed interface makes it impossible to drag layers from one document to another. If you drag a layer over a background document’s tab, it simply does nothing. Dropping the item there also does nothing.

See? That's how you notify users of a drop target.

See? That's how you notify users of a drop target.

When I drag an item onto a taskbar button in Windows, Windows warns me that I can’t drop an item there. If I hold an item over a taskbar button, after a brief pause, that window will open, allowing me to drag and drop no matter how many windows I have open.

The workaround to this tabbing problem is to either arrange your document windows into actual windows, which sucks if you have more than a few documents open, or drag the tab of the document away from the dock, which results in its own floating window, which you can then drag layers into. This is a pain in the ass, because the default behavior is to open documents in tabs. You can change this behavior by opening Edit > Preferences > Interface, and deselecting the “Open Documents as Tabs” checkbox.

Many times, when using the Polygonal Lasso tool, my screen would go white with only the top toolbar visible until I closed the lasso. I could not see the canvas or previous lasso selection, despite it still being there once the problem corrected itself. This all happened on my home office machine, which has hardware acceleration turned off. I haven’t encountered the issue at my office office, but I don’t do a whole lot of lassoing there. Sorry, don’t have screenshots of this.

Speaking of hardware acceleration (which is a really cool feature, and I’m sure works flawlessly on Macs), there is no software fallback for canvas rotation. On my home machine, the embedded Intel chip is not up to snuff for hardware (using shared graphics RAM), so I have no hope of ever using this feature there. A bit lame, since that’s where I would use it the most (where I color comics). The obvious solution is to upgrade my machine, but I don’t understand why even a crappy-performing software rotation couldn’t have been included. Given that these guys are graphics programmers working on an image editing tool, I can’t think of a good excuse for not including it.

Guess which one is the actual window. None of them are, actually.

Guess which one is the actual window. None of them are, actually.

At the office, I had to hack my driver files just to be able to upgrade them so that hardware acceleration would work at all. Now that it works, I still get strange visual artifacts from time to time that tells me maybe this feature wasn’t as ironed-out as Adobe would have you believe.

This button does not have a drop shadow. Or does it? No, it's Photoshop.

This button does not have a drop shadow. Or does it? No, it's Photoshop.

There is a drop shadow around every document by default, unless you’re in fullscreen mode. This drives me crazy for buttons and the like, especially ones that already have drop shadows. For full-size canvases, it’s a nice effect, but rather pointless. You can disable this by going to Edit > Preferences > Interface, and changing all “Border” dropdowns to “None.”

Photoshop still has limited PNG support, which is strange for two reasons: 1. Adobe owns Fireworks, which has far more PNG features included. The code is already in Adobe’s codebase, somewhere. 2. This is around the fifth or six major version to Photoshop.

Update (8-26-2009): Many plugins still don’t give visual feedback on what they’re doing, and don’t present a uniform interface. Radial blur doesn’t offer a preview, so you just have to guess where it’s going to apply, or center your artwork on the point you want it to be applied. This interface hasn’t changed since I’ve started using Photoshop, since version 6.

Illustrator

I actually had nothing to complain about in Illustrator, and encountered no problems. Its UI highly resembles Photoshop and Flash.

Audition

I did not get a chance to review Audition CS4, but CS3 seemed way too bloated for normal use. I ended up using Sound Forge for my needs, which starts in 1/3 the time and I don’t need to wait on the interface to load.

Bridge

In Adobe Bridge, you can’t specify UNC paths. I’ll take a shot in the dark and say this is because of Adobe’s Mac roots. To load anything from a network, I have to have a location mapped to a drive letter. In this era, with multiple NASes and large networks, this isn’t a very feasible option. I already have some 10 locations mapped to drives because of our domain policy, so I don’t get a choice. It becomes a bit inconvenient to dedicate more drive letters solely for Bridge.

Flash

Flash is my specialty, so I use this software quite a bit. The CS4 version has shown huge improvements in stability and features, and I had no issues using it so far, other than its really slow startup time (starting Flash 8 and CS4 at the same time was an interesting experiment). Like Photoshop, it uses custom window chrome. Actually, Flash and Photoshop are the only two applications in CS4 that have any sort of consistency.

Update (8-25-2009):Ah, yes. How could I have forgotten? Flash still has the problem that if you delete things from your library and re-save the file, the filesize stays the same, forcing you to use the clunky “Save and Compact” command (which is a hack on Macromedia/Adobe’s part for the process of “save as a different filename, then copy this newly compacted file over the old file”). This sometimes causes problems on network drives, as the temporary intermediate file won’t delete automatically.

Flash still has the odd unexplainable issue, such as certain movies not displaying bitmaps because “one or more items in the scene could not be displayed because of insufficient memory.” I have a machine with 2 GB of ram, and it’s a 30 MB file, so I assume it’s a different error with really undescriptive text. It’s the same error that Flash 7 displayed on the same file. Whoo, progress!

Premiere Pro

Standard window chrome, and different panel controls.

Standard window chrome, and different panel controls.

Like previous versions, Premiere Pro uses standard window chrome. It looks nearly the same as previous versions, save for darker UI. It uses dockable panels like the rest of the CS4 products, but unlike Flash and Photoshop, the panel titles are not in uppercase, and use a different font. It’s clear the UX guys for the web and video product teams aren’t communicating.

Enough already! Isn't there a maximum setting?

Enough already! Isn't there a maximum setting?

Also true to the Premiere Pro legacy, CS4 leaves files scattered all over my various drives. On each export, Premiere Pro copies the .prproj file to my Temp folder, renaming each subsequent save. I found files named Project_Name_25.prproj (with all previous versions there too). Normally, this isn’t a problem, but at the office we work with .prproj files that are 15MB and more. It adds up.

Not in the working folder, not in Temp, but ANOTHER folder.

Not in the working folder, not in temp, but ANOTHER folder.

Add to this, there are numerous files cached in Documents and Settings/[user]/Application
Data/Adobe/Common/Media Cache Files, and also Documents and Settings/[user]/Application
Data/Adobe/Common/Media Cache. After wondering why I kept running out disk space on C:, I have my answer (before you accuse my disk of being too small, we use C: as an OS/programs drive, and D: as our working drive).

Not only does it cache these media files in multiple locations, conformed audio files (.cfa) are cached in (depending on your version) Documents and Settings\[user]\My Documents\Adobe\Premiere Pro\[1.5|2.0|4.0]\Adobe Premiere Pro Preview Files. These files are stored in addition to your actual working folder (where you saved the .prproj file), autosave, and preview folders. That makes…what, five different locations that Premiere Pro uses to store files?

Like previous versions, you still cannot defer conforming audio when loading new media into the project. It runs in the background, which is nice, but when you have on the order of several hundred media files, it would be nice to defer a large chunk of them later if I’m not working on those files. Additionally, every time Premiere Pro conforms audio, it cracks and pops my headphones enough to be painful. So I get to either wait for conforming to finish, or disable my audio.

In CS4 (and I don’t know if this was the case in CS3 or not), there is no keyboard shortcut for Export, which is the new replacement for Export [Video|Audio|Image|etc]. I now see it has Ctrl+M as a shortcut, so maybe this was addressed in the 4.1.0 update. To export any media, you use the same command: File > Export > Media…, which opens Adobe Media Encoder. Even for a still image.

After Effects

Now, on to After Effects. After Effects is like the Photoshop of video. At least, that’s what I tell laypeople. Actually, the only issue I had with After Effects was having it crash numerous times when I taxed it too hard. At the time, I think I was using Trapcode’s Particular, so can’t conclusively lay the blame at Adobe’s feet.

Like Premiere Pro, it uses standard chrome and non-caps font for panel titles, along with orange outlining of active panels.

Media Encoder

So, speaking of Media Encoder, I had numerous problems with it on my first go-round, mostly relating to crashes and freezes. Whenever I would lock my workstation to step away while files were encoding, I would come back to a crash error in “PProHeadless.exe” relating to “[..\..\Src\AudioRender\StackAudioBuffer.cpp-58]” and my media would not be exported in the queue. Updating to 4.0.1 fixed the issue.

Because of the aforementioned crashes, I noticed that if output fails for any reason, duplicated files append “_1″ even when no file of that name already exists. I guess it’s keeping an internal counter? Not a big deal, but was annoying to rename output files numerous times.

Media Player

Adobe Media Player was a package I had not seen before, but am glad it was included. It is a bit heavy for what is essentially an .flv player. I know it plays other media, but I have other players (Media Player Classic, Quicktime, etc) for that. To play .flv files quickly, you’d be better off using an .flv codec, or downloading a free, lightweight, standalone player.

I noticed on our subtitled .flv files that Adobe Media Player does not show embedded cue point information. I found that fact strange for a player included in a media development suite developed by the same company.

Soundbooth

One application I was completely underwhelmed with was Soundbooth. Wow, this application is sluggish, and no longer resembles CoolEdit at all, in that it is slow and bloated, and CoolEdit was a lean, mean, audio editing machine. I actually wasn’t going to make this comparison, as I know Syntrillium and Adobe have differing goals, but honestly, Adobe started it.

I found that Soundbooth was paged out of memory very quickly, even with a generous amount of RAM. This was noticeable because after leaving it minimized for a bit, dragging a file in from Explorer took quite some time.

Why the @#&! is this a tab?!

Why the @#&! is this a tab?!

My biggest problem was the interface. There is a tab that shows the currently opened file, but it contains a stupid dropdown on the tab for switching files instead of, say, using more tabs. This design choice has the benefit of closing all open documents when you try to close a single one using the “Close” icon in the tab, which directly opposed to tabbing behavior in Adobe’s two flagship components of CS4, Flash and Photoshop. Oh, and every other tab in the universe.

There is also a “Search Help” box at the top-right. This seems to be the only application in the suite to have this feature. Using this box opens up Adobe search results. On testing, I found faster results with Google, as I could find things actually relevant to my search terms.

'forfuture pasteoperations'

'forfuture pasteoperations'

An issue I thought was horrible QA turns out to be simply weird font kerning. I don’t know if it’s my machine or poor font choice, but it looks awkward.

Action Items

  1. Either put the regular chrome back onto Flash, Photoshop, and Illustrator, like Premiere Pro, or use the custom chrome for all apps. Pick one. This suite feels like it was developed by three different companies (which it was, but now several versions have passed since these acquisitions).
  2. Get the UI guys from each of your app groups together, and talk. Aside from “grey or dark grey buttons” there’s little consistency between apps in the same suite. After Effects chrome is darker than Flash/Photoshop chrome, but matches Premiere Pro and the audio editors. All of the video applications use orange outlines, while the web and design applications use 3D-ish shading.
  3. Allow users to choose which audio items NOT to conform in Premiere Pro. On our projects (approx. 6-hour videos), I sometimes have to wait almost an hour for all the audio to conform. It would be nice to disable conforming for an entire subset of my audio (maybe per-sequence?), or at the very least defer that subset until last, so I am free to export relevant portions of projects.
  4. Create a setting to allow Premiere Pro to clean up after itself on exit, possibly with options for which items to clean up (cached media, Project_Name_25.prproj, and so on).
  5. Change the name of Flash from “Flash CS4 Professional” to either “Flash CS4″ or “Flash Professional CS4.” It’s the only app in the suite that doesn’t end in “CS4″ (Acrobat, Pixel Bender, and Device Central excluded). Premiere Pro is missing the CS4, so I’m not sure if they’re going with the “4″ or “CS4″ on this one. Come on, Adobe. Don’t you have a marketing and QA department for this? Please note that I would be happy to accept money from Adobe, having done this for you.
  6. Allow items to be hovered over tabs in Photoshop if you must use this style of interface. Sometimes layers gotta get moved from one document to another.

Good Stuff

Now, onto a few positives, so you don’t think that I just hate CS4 and change (get off my lawn).

If you are able to use the hardware acceleration that Photoshop provides, it’s a pretty amazing experience. The canvas slides when using the hand tool, zooms are smooth, and of course you get the canvas rotation tool.

When I managed to crash After Effects (several times), it recognized a crash was “in progress,” and immediately popped up the save project dialog. The crash warning is not modal, which allowed me to save my project before losing anything.

Routing every media export from Premiere Pro did annoy me slightly, but it does provide a huge productivity boost. While media is exporting, you can continue to work in Premiere Pro while Media Encoder does its thing. After Effects still uses its same Render Queue, strangely enough.

The features for photographers are too numerous for this already long post, but suffice it to say they are worth the upgrade cost.

Conclusion

Most of the problems I have with the CS4 suite are UI-related. For some reason, Adobe decided to completely throw away any semblance of using the native OS user interface (except, of course, those times they didn’t). I do understand the need to have smaller dropdowns, trees, and buttons. I’d be fine with most of the custom UI if it were: 1. applied consistently, and 2. loaded quickly and was responsive. At the office, I’m not exactly on a slow machine, but many of these applications load their interfaces slowly. I can actually see various parts of the UI loading into memory. Isn’t the point of the splash screen to do all this loading in the background first?

If you’re a heavy Photoshop or Premiere Pro user, the CS4 package will most definitely serve you well. If you’ve got a top-end machine, Photoshop and After Effects will provide the most benefit to your workflow.

Block Windows Live Messenger Ads

All your ads are belong to us

All your ads are belong to us

Earlier, we learned how to block ads at the OS level. Blocking ads through the browser is awesome, but advertising these days is all about making inroads to the desktop. Even though Microsoft claims that their business is software, Live Messenger seems to be an ad vehicle. I quickly became tired of video ads constantly showing up in Live Messenger (especially those insipid Tru dating site ads) that would play as soon as the cursor went over them, so I resolved to do something about it. I fired up Fiddler, a proxy that allows you to view HTTP traffic. I saw several random requests for rad.msn.com, and upon further examination saw that it was serving ad content, which depending on the content type, would be handled appropriately by Live Messenger’s ad box.

I added rad.msn.com to my hosts file, and the ads were now blocked. Since there was now a blank box, I decided to go a step further and replace the image. I tried this before with a program that patched the ad out of the executable, but this isn’t a long-term solution, since any software update will require waiting on a new version of the patcher, and a subsequent re-patching. If I just serve a different image up, it’s fairly future-proof because Messenger is one the wiser. No matter what subdirectory or file is being requested by Messenger, this script will always throw back the custom image.

Using the index.php file we ended up with on our last ad-blocking adventure, we will add the following before the html is sent to the browser:

// if it’s live messenger, spit out an image and exit
if ($host == ‘rad.msn.com’) {
$filename = ‘false-ad.jpg’;
if ({FNAMEL}“>file_exists($filename)) {
$handle = {FNAMEL}“>fopen($filename, “r”);
$contents = {FNAMEL}“>fread($handle, {FNAMEL}“>filesize($filename));
{FNAMEL}“>header(“Content-type: image/jpeg”);
echo $contents;
}
{FNAMEL}“>exit();
}

The exit() is added so we can bail out early after serving my custom image, and not serve up the normal adblock page (that I see in my browsers). The image size for the Live Messenger ad is 231×60 pixels.

I opted for an image that would blend in with the skin I use for Live Messenger, but wasn’t just a “blank space here” image. The skin shown is Oil Slick for Messenger Plus! Live.

MSN (Windows Live) Avatar Icon Size

…is 96×96 pixels.

Sometimes I really hate when basic information is hard to find.