For our first Mac OS X 10.5 Leopard tips, we've been collecting a variety of popular visual tweaks and most-requested adjustments to Apple's updated interface. Because our readership includes a mix of users, we've presented each hack in a technical and non-technical format.
If you've recently upgraded to Mac OS X Leopard, and find yourself disliking the new 3D glass shelf on the Dock, here is the hack to switch it back to a simpler 2D version.
Less Technical: Use the Dock Doctor utility.
For less technical readers, the easiest way to get rid of the 3D glass dock is to download InnermindMedia's handy Dock Doctor utility.
This software utility allows you to easily toggle between 2D and 3D docks. Plus as a bonus you can apply a variety of special backgrounds to the 3D version of your dock if you like. Including such themes as grass, dashboard, checkered, etc.
Using Terminal: Get rid of Leopard's 3D Dock
For more technically inclined users, here are the terminal commands to apply this hack. Please consider yourself sufficiently warned that using terminal can break your computer if mishandled.
Turn off 3D dock:
defaults write com.apple.dock no-glass -boolean YES; killall Dock
Turn on 3D dock:
defaults write com.apple.dock no-glass -boolean NO; killall Dock
For our first Mac OS X 10.5 Leopard tips, we've been collecting a variety of popular visual tweaks and most-requested adjustments to Apple's updated interface. Because our readership includes a mix o fusers, we've presented each hack in a technical and non-technical format.
If you've recently upgraded to Mac OS X Leopard, and find yourself disliking the new translucent menu bar, here is the hack to make it opaque again.
Less Technical: Use MacParc's Leopaque utility.
For less technical readers, the easiest way to get your old opaque menu bar back is to download MacParc's handy Leopaque utility.
Adjust the slider from a setting of grey (0) to white (1) and click "Enable." Choosing a setting of 0.62 gets you the closest to the menu you are used to in the previous version of Mac OS X. This hack does require that you enter your administrative password and restart your Macintosh.
Using Terminal: Make Leopard's menu bar opaque
For more technically inclined users, here are the terminal commands to apply this hack. Please consider yourself sufficiently warned that using terminal, and especially the sudo command can break your computer if mishandled.
Source: This hack first appeared at the great Mac OS X Hints site. MacParc's Leopaque utility is based on this same hint. John Gruber's excellent Daring Fireball gets credit for identifying 0.62 as the best value to mimic the old Apple menu bar.
Too many active fonts can slow your computer down, make the font menu long and unwieldy, and lead to a host of other computer problems. So to coax a little more speed and stability out of your copy of InDesign, graphic designers should keep those long font menus under control.
But what if you are brainstorming a new logo? That's exactly the time you want access to your full library of thousands (and thousands) of creative fonts.
Happily, the big three font managers (FontAgent Pro, Suitcase, and FontExplorer) all provide a quick way to try out your fonts — without having to activate them first. Type a name or phrase into the preview window. Then scroll through your huge font collection and see what catches your eye. When you find something you want to play with, turn that font on for use in your graphics applications.
Preview fonts in FontAgent Pro's Font Compare window.
Font Compare is in the lower right side of FontAgent Pro's main window. This allows you to view any text in a variety of fonts in any size or color you wish. You can quickly activate interesting fonts by clicking on the small grey dot to the left of their name.
Preview fonts using Extensis Suitcase Fusion's QuickType option.
On the right side of the Suitcase window is a preview area showing the fonts you have selected. Change the pop-up menu at the top of that window to "QuickType" and type in a word or two in the field beneath. To activate a font from the preview list, click on the small circle to the left of the font name.
Preview fonts in Linotype FontExplorer X.
The preview area is in the lower right half of FontExplorer's window. Type a word or phrase in the text field, set the font size and color if you wish. To activate an interesting font, highlight the example and choose Font > Activate from the main menu, or use the keyboard shortcut Command-Shift-A.
Preview fonts in Apple's Font Book.
Apple's Font Book offers a very basic font preview. You can only view a single font at a time, and you only have control over the font size. In order to type your own sample text in the preview, you must first choose Preview > Custom in the main menu.
Source: This tip inspired by Craig Swanson's Wednesday morning workshop, Font Management in Mac OS X, where we'll be digging into these font managers in greater detail.
Nov 28, 9:30-11am — Font Management in Mac OS X. Want a fast, stable, healthy Mac? You'd better get a handle on your fonts. Join CreativeTechs’ Craig Swanson for an in-depth look at font management for graphic designers. We'll help you understand what's going on with all those odd font folders scattered around your Mac — and we'll help you slim down your system fonts so InDesign doesn't take forever to scroll to Zapf Dingbats. And as a bonus we'll reveal what's changed about font management in Mac OS X Leopard!
The problem with grasping Adobe's pen tool is that you can't really learn it by reading a description or watching a demonstration. To master the pen tool, you must actively draw with it. Eventually, after enough repetition, something clicks and the pen tool starts to make sense.
So, how does one teach a skill that relies so heavily on learned muscle memory?
The ingenious answer from Veerle Pieters, who publishes the wonderful Veerle's Blog, is to create a series of Bézier dot-to-dot exercises that let even inexperienced designers and illustrators put the pen tool through it's paces.
Download a copy of Veerle's Illustrator exercise file here:
Okay, we don't actually expect anyone to learn Adobe's pen tool through the study of cubic Bézier curves — but we love this cool animation of how the Bézier spline is actually derived from the mathematical equations you control with your handy pen tool.
You can read more than you care to know about the mathematics that Postscript is based on — along with some more fascinating diagrams at Wikipedia:
If you've ever wondered how to create animated GIFs in Photoshop, we've created a simple tutorial with some example files you can download and try out.
We use a lot of animated GIF files in our weekly tips. They are fun to build, and better for our email subscribers because Flash animations are not supported in most email readers.
A Simple Example
For a quick hands-on tutorial on creating animated GIFs in Adobe Photoshop, we'll walk you through creating the following animation:
This simple animation combines the two most common animation techniques in Photoshop: Turning layers off and on, and using the Tween command to animate the movement of an object on a layer.
Step 1: Set up your layers.
The first step in creating any animation in Photoshop is to build a layered Photoshop file with all the elements you plan to animate. Our example document has 7 layers containing the text for our countdown, and layers for the rocket and flame.
Step 2: Create Animation Frames with Layer Visibility.
Chose Windows > Animation to show Photoshop's animation palette.
On the first frame, turn off visibility for all layers you do not want visible at the start of your animation. Then add one frame at a time, and turn on the layers you want visible for each step in the animation.
Changing layer visibility one frame at a time is a classic Photoshop animation technique that covers a wide variety of needs.
In our example, continue this pattern to reveal the countdown and the flame at the bottom of our rocket.
Step 3: Create Animation Frames using Tween.
Now that the countdown is complete, we need to create the illusion that our rocket ship is taking off. Add one more frame, and this time select the group called "Rocket" in layers and move your rocket off the top of your image window.
Then choose "Tween..." from the Animation palette's pop-out menu.
Set how many frames to add, and Photoshop spreads the movement of your layer across those extra frames.
Step 4: Adjust your Timing.
Finally, go back through and adjust the delay for each frame of your animation. That time is shown in seconds below each frame.
Tip: You can hold down the Shift-key to select a range of frames (such as the 9 frames we added for the rocket's takeoff) and change them together.
Step 5: Export the Animated GIF.
Finally, to export your animated GIF choose:
In Photoshop CS3: File > Save For Web & Devices...
In Earlier Photoshops: File > Save For Web...
Make sure the image type is set to GIF, feel free to experiment with some of the other options, and save your file.
To test your resulting animated GIF, drag the file onto you web browser.
As a final reference, you can download our finished Photoshop file here:
Source: The animated spokesperson at the top of this tip is a homage to Tacoma illustrator Mark Monlux's daily comic strip The Return of Stickman. Mark is a talented and funny guy, who generously allowed us to butcher his creation for this tip. Check out Mark's site, and sign up for his daily email Stickman comic.
Nov 14, 9:30-11am — Photoshop: Preparing Images for the Web. This topic comes directly from client requests. What are the best ways to prepare images for the web in Adobe Photoshop? What formats work best? Can you create animated graphics directly in Photoshop? Come spend a fast-paced morning at CreativeTechs — your web developer will thank you for it.
OBITUARY: After a prolonged battle with Mac OS X, Helvetica — along with younger cousin Helvetica Neue — was finally pronounced dead on October 28, 2007 with the release of Leopard, by Apple, in California.
For years, print-based graphic designers and prepress professionals have fought to replace certain Mac OS X default fonts with their existing PostScript Type 1 fonts of the same name — Helvetica being a primary example.
It's been a losing battle.
Now with Leopard, the war for control of Helvetica is done, and Mac OS X won.
Why does Leopard change the fight over Helvetica?
With the release of Mac OS X 10.5 Leopard, Apple hammered a final nail in the Helvetica coffin for print designers. Try removing Helvetica.dfont or HelveticaNeue.dfont from System and Leopard puts it right back:
Apple is serious. Don't mess with Helvetica.
So what is a Helvetica-loving print designer to do? The answer is easy — although you'll need to do the unthinkable and actually buy a font.
The problem: Is Helvetica a System font or a Creative font?
For graphic designers, there are two types of fonts on your computer:
System Fonts which include a core set of fonts your Mac requires for the computer itself to function properly.
Creative Fonts which include a large, varied, and ever growing assortment that creative teams use to keep their designers happy and productive.
At the heart of this battle over Helvetica is a somewhat philosophical question. Is Helvetica a system font or a creative font? When Mac OS X was new, designers attempted to maintain their old ways of working in Mac OS 9. We'd strip out Apple's Helvetica.dfont, drop in our old Postscript standards and work away.
The problem with this solution is that it took a lot of work. Every time a new copy of Mac OS X was installed, we'd have to go in and strip out all the unwanted Helvetica.dfont files again. It became a never-ending battle.
Then new problems started surfacing. With multiple copies of Helvetica in different formats, the font caches become corrupt and we start seeing ongoing problems with garbled text in Safari, Mail and Entourage.
With Mac OS X Leopard, Apple has made it clear. Helvetica is a system font. Period.
Helvetica is dead. Long live Helvetica LT Std.
Here it is: We at CreativeTechs strongly recommend that designers stop using the fonts named "Helvetica" or "Helvetica Neue" in print production.
If your studio relies on Helvetica or Helvetica Neue, it is time for you to purchase Adobe's new OpenType versions of those core fonts. The appearance is the same, but the names in your font menus are different from Apple's default fonts. No longer will you design with "Helvetica" instead it is time to start using "Helvetica LT Std."
Our battles all along have never been with Helvetica the typeface — all our fights with Apple and Mac OS X have been over who uses the name of "Helvetica" in the font menus. Thus, because Adobe's newest OpenType version — Helvetica LT Std — is not named the same as Apple's default Helvetica system font, the problems go away.
By the way, Helvetica LT Std stands for "Helvetica Linotype Standard."
In our testing, the letterform outlines are identical to the old Postscript version of Helvetica that designers have used for years. However there does appear to be some slight variations in character spacing, so check your documents' text rag when you update them.
Yes. You need to buy a font!
We know this solution goes against a long-standing tradition of graphic designers not buying their fonts. In an online survey last year, half the designers responding admitted they had purchased almost none of their fonts. With only 6% saying they had purchased all their fonts. (The graphic below comes from our Fonts & Mac OS X 2007 Update talk hosted by Seattle's School of Visual Concepts last January.)
We joke around with designers about this. But, in this rare case, if you use Helvetica or Helvetica Neue in your studio's design projects, we argue strongly that it is worth stepping up and buying Adobe's updated OpenType fonts. You'll be fighting a losing battle otherwise.
Okay, okay. So where do I buy Adobe’s OpenType Helveticas?
Adobe's online store does not make it terribly easy or inviting to quickly buy an updated collection of Helveticas. For now, here is a link to the "H" section of Adobe's online font store:
This essay has been a long time in coming. We've been actively moving clients away from their old Postscript versions of Helvetica for about a year now. But we know there are going to be a lot of different opinions and suggestions.
We'll have comments on this tip blog back up sometime early next year. In the meantime, we want to hear from you. Please help your own thoughts about Helvetica and Mac OS X to us at tips@creativetechs.com.
Enjoy.
Nov 28, 9:30-11am — Font Management in Mac OS X. Want a fast, stable, healthy Mac? You'd better get a handle on your fonts. Join CreativeTechs’ Craig Swanson for an in-depth look at font management for graphic designers. We'll help you understand what's going on with all those odd font folders scattered around your Mac — and we'll help you slim down your system fonts so InDesign doesn't take forever to scroll to Zapf Dingbats. And as a bonus we'll reveal what's changed about font management in Mac OS X Leopard!
In April 2007, A List Apart conducted a survey of people who make websites. Close to 33,000 web professionals answered the survey’s 37 questions, providing a treasure trove of data on the business of web design and development as practiced in the U.S. and worldwide.
If you are a web designer, hire web designers, or engage web development firms, this is a fantastic business resource.
Source: This tip loosely inspired by great feedback we're receiving from a number of clients who are currently taking "Making the Move from Print to Web" — a six week class taught by Curt Collinsworth at Seattle's School of Visual Concepts.
Last week we posted a fun collection of Halloween MP3s which received a tremendous amount of web traffic. Many people asked about the embedded MP3 player we used to let visitors to listen to songs from their browsers.
For this week's creative tip, we decided to provide a short tutorial on how to setup and use a free Flash-based music player developed by Fabricio Zuardi.
To demonstrate that player in action we'd like to feature the work of CreativeTechs' newest Mac IT consultant, Dave Corter, who in addition to being an excellent Mac engineer has also published several albums of Didgeridoo music. Click on a couple titles above to give them a listen, or scroll down for a tutorial on how to embed your own music player.
For Web-Savvy Designers: Visit SourceForge.net
For the web developers in our audience, you can skip our simplified tutorial and go right to the source. This Music Player was developed by Fabricio Zuardi and is freely available on the SourceForge site:
For our readers who are less comfortable editing HTML, we've tried to simplify the process as much as possible. This tutorial will walk you through the basics of uploading a player with three placeholder MP3 files that you can replace or edit with your own music:
Note: We've tried to provide a good basic tutorial, however this technique does require a medium-level knowledge of HTML and web publishing to accomplish. You'll need to be comfortable with uploading and finding files on your website, as well as making minor changes to HTML and text documents.
Step 1: Download and decompress this folder of files.
At the simplest, to get your web music player running, you'll need to upload a directory to your website that contains your music and the Flash music player. We've prepared folder with the files you'll need here:
When decompressed, you'll find a folder that contains six files:
song1.mp3, song2.mp3, song3.mp3 — We've included three MP3 files as placeholders. You can include as many MP3 files as you wish in this folder. Your song names will vary, however to keep this simple, don't use spaces when naming your MP3 files.
coverart.jpg — This is a thumbnail of the album cover you wish to display in your player. You can use the same art for each song, or you can include different album covers for individual songs.
xspf_player.swf — This Flash object becomes your embedded MP3 player. You do not need to edit it.
playlist.xspf — This text document is an index of all your MP3 files, including links to album artwork and song names. You must edit this file in Step 3.
Step 2: Add MP3 files and upload this folder to your website.
Add additional MP3s you wish to play into the folder you just decompressed. Upload that entire folder to a new directory on your website:
http://www.yoursite.com/folder/MusicPlayerExample
The name of that directory can be anything you like, but you'll need to know it to access those files in a moment. If your web host allows it, you may be able to see the files by viewing that URL in a web browser as shown here:
Note: If you don't know how to upload or find files on your website, you'll probably need additional help to complete this project.
Step 3: Edit the playlist.xspf file.
The playlist.xspf is a text file that contains an index of the songs you wish to play in your music player. Open this file in a text editor, or in Dreamweaver, and change the areas we've highlighted below:
While it can look intimidating at first, you'll see there is a simple repeating pattern. You can follow this pattern to add as many songs as you wish. Each song in your play list has three details for you to fill in:
Location (Shown in Yellow) — Enter a URL for each MP3 we uploaded in the previous step. (Note: Test the URL by trying it first in your web browser which should play it for you if you've go everything correct).
Image (Shown in Blue) — This is the URL for your cover art image. In our example we've only included a single cover, however you could include a different image for each song if you wish.
Annotation (Shown in Green) — This is where you type the name of each song. This name is displayed in the music player's list.
Step 4: Re-Upload the playlist.xspf to your website.
Once you've edited the playlist file, re-upload the file to your website, replacing the original one we uploaded in Step 2.
Step 5: Embed a Music Player link in your Blog or Website.
The final step is to embed a link in you blog or website. While there are a number techniques available for this step, the easiest is to add the following code to your HTML or blog post:
The areas in Red should be replaced with links to the location of your xspf_player.swf and the playlist.xspf file — both of which should be in the folder you uploaded back in Step 2. And yes, you must type this information in twice (this is necessary for compatibility with a variety of browsers).
You can make your music player as large as you wish, although the minimum size appears to be 400 pixels wide by 153 pixels tall.
Hopefully if you've done everything correctly, you'll find yourself the proud owner of a website or blog with a newly embedded MP3 player.
Join us at the CreativeTechs office Wednesday mornings 9:30am to 11am. Pick up a couple new skills, and get back to work before lunch. You can put what you learn into use the same day.
The cost is $50 per workshop.
November 2007 Mini-Workshops:
CLOSEDNov 7, 9:30-11am — Mastering Layers: InDesign, Illustrator & Acrobat. Layers help you organize project files. At their simplest, you can streamline work by keeping graphic elements or editable text areas on separate layers. Beyond that, in Adobe Creative Suite, you can create layers that function across InDesign, Illustrator, and even Acrobat. The layer tricks in Adobe Acrobat alone are worth spending a fun morning away from work.
CLOSEDNov 14, 9:30-11am — Photoshop: Preparing Images for the Web. This topic comes directly from client requests. What are the best ways to prepare images for the web in Adobe Photoshop? What formats work best? Can you create animated graphics directly in Photoshop? Come spend a fast-paced morning at CreativeTechs — your web developer will thank you for it.
Nov 21, No Workshops — Thanksgiving Week. Enjoy the long weekend.
Nov 28, 9:30-11am — Font Management in Mac OS X. Want a fast, stable, healthy Mac? You'd better get a handle on your fonts. Join CreativeTechs’ Craig Swanson for an in-depth look at font management for graphic designers. We'll help you understand what's going on with all those odd font folders scattered around your Mac — and we'll help you slim down your system fonts so InDesign doesn't take forever to scroll to Zapf Dingbats. And as a bonus we'll reveal what's changed about font management in Mac OS X Leopard!
FREE!Nov 28, 3:00-4:30pm — Leopard Server: What's New for Creative Teams. Mac OS X Leopard Server was released in October 2007. Come join CreativeTechs' Enterprise Consultant, Jordan Bojar, as we dig into some of the most important new features and discuss how they effect larger creative teams in the Seattle area. On November 28th, we'll provide a free overview of Leopard Server — with a practical focus on what's working in real studios around the Puget Sound. Then join us in coming months where we'll explore each of these topics in greater depth.
December 2007 Mini-Workshops:
Dec 5, 9:30-11am — Photoshop: Color Correction Techniques. Another installment in Jason Hoppe's continuing series on non-destructive Photoshop retouching. A full description to come later. This 90-minute session focuses on color correction of images.
Dec 12, 9:30-11am — Photoshop: Digital Anomalies. Another installment in Jason Hoppe's continuing series on non-destructive Photoshop retouching. A full description to come later. This 90-minute session focuses on dealing with those odd problems that come up working on images: Moires, banding, dust & scratches, resizing images, etc.
Dec 19, 9:30-11am — InDesign for Writers & Non-Designers. A full description to come later. This 90-minute session focuses on what non-designers need to know about InDesign in order to edit and update files. Perfect for copywriters, account managers, and other people who need to work with InDesign templates.
Dec 19, 3:00-4:30pm — Leopard Server: Shared Calendaring with iCal Server. Leopard Server finally includes group calendaring features, and for some creative teams, this alone may be worth the price of admission. We'll dig into what works, and what's needed to provide shared scheduling and contacts for your entire studio or department.
Don't see a workshop for you?
Workshop topics come directly from client requests (the Preparing Images for the Web workshop on November 14th came from client requests). So email us your idea and we'll work it into an upcoming schedule.
Outside of Seattle? We still want to hear from you. These same workshop topics will eventually be covered in our weekly tips newsletter.
Call us with any questions or problems.
We are all a little new to the logistics of coordinating a weekly event like this. If you have any problems or questions with online ticket ordering, please don't hesitate to call our office at 206-682-4315 or email help@creativetechs.com and let us help you in person.