******************************
*** DesignGeek ***
******************************
Tips and techniques for the digital designer
In this issue:
-- Pixel Fonts for the Web and Flash
-- Editorium: DesignGeek for Editors
-- Scaling Photoshop Layer Effects
Issue 25, 7/26/04
Written by Anne-Marie "HerGeekness" Concepcion
... for her clients, colleagues, random contacts and interested subscribers
© 2004 Seneca Design & Training, Inc.
==========================
Pixel Fonts for the Web and Flash
==========================
I have a compulsive fascination with pixel fonts. I keep buying them, amassing a collection, even though I don't get a chance to use them that often. I'm always amazed at how creative people can be when they have just a few pixels to work with to design a typeface.
Not sure what a pixel font is? I'm sure you've seen them already on modern-looking web sites ... they're often used for navigation as text labels, and most of the time appear in all caps.
Look at the navigation labels at this web design firm's site to see what I mean:
http://www.grafik.com/
Pixel fonts are designed for readability at small sizes on web sites, Flash movies, or any other computer screen-based medium. They use no anti-aliasing (blurring/smoothing). The majority are optimized to a specific small size like 7, 8 or 9 points, where most "normal" fonts become unreadable on the monitor. A few pixel fonts are designed for larger sizes and/or can be used at two or three sizes.
On web sites, pixel fonts usually appear as .gif text, since few site visitors will have that pixel font loaded on their system. The designer chooses that font in Photoshop or whatever, types something out in the font designer's recommended size, turns off anti-aliasing (sets it to None), saves it out as a .gif and adds it to their web page.
In Flash movies, the font is always embedded in the file. Flash designers need to make sure that the font is placed at a whole pixel so no anti-aliasing is introduced by accident. Use the Info palette and make sure that the X and Y fields show whole numbers (11.0/53.0) and not fractions (11.2/53.6).
Pixel font designer/graphic designer Craig Kroeger offers a great guide to using pixel fonts in Flash on his web site, miniml.com (love that domain name). You can download his Font Guide in PDF format at the top of this page:
http://miniml.com/fonts/
... and while you're there, see if you can't resist buying one of his pixel fonts that appear below the link. At only $10 each, they're like potato chips.
The first pixel font I bought was in 1997, the venerable "MINI 7," designed by Joe Gillespie and arguably the most-used pixel font to date. When I bought it, it was only available as a screen font suitcase for Macintosh users. He's since updated it to TrueType format for both Mac and Windows:
http://www.wpdfd.com/mini7.htm
(Joe's acronymed web site stands for "Web Page Design for Designers," one of the first sites around that helped professional designers figure out how to create great looking web sites while under the yoke of HTML and web-safe colors. When you go there, be sure to hit the home page and use it as a jumping-off place to see all the other pages on his site. You'll learn something useful, trust me. He's one of those quiet geniuses on the web.)
Have I whet your appetite for pixel fonts? Here, have another chip:
http://www.orgdot.com/aliasfonts/
http://www.dsg4.com/04/extra/bitmap/index.html
http://atomicmedia.net/
|| top ||
==========================
Editorium: DesignGeek for Editors
==========================
The InDesign listserv and forums have had a lot of discussion recently about importing Microsoft Word files and their attendant style-sheet/local formatting problems. When I went to the InDesign Conference in Boston a couple weeks ago, the same topic came up in various sessions. On the Quark listserv and forums it's a perennial topic as well.
If only Word users had some inkling of how to apply (or not apply) text formatting correctly, we page layout people wouldn't have to spend hours fixing their files...that's the general gist. And oh, how true it is! (I can feel the earth shift a little as hundreds of you read this and nod your heads in commiseration.)
During one of these discussions -- I can't remember where -- someone recommended a web site devoted to tools, macros, and informative articles about cleaning up Word files in preparation for importing into a page layout program, or for converting it to tagged text, or for publishing long documents in Word itself. The production manager said the tools had saved him hundreds of hours of time and his sanity.
I'm all for that. So when I came back from Boston, I went through my notes and found the URL for the site, called The Editorium:
http://www.editorium.com/
The home page lists a bunch of amazingly helpful tools, mostly in the form of .dot files (Word templates) that add functions to Microsoft Word on both the Mac and Windows platforms, for the current version of Word and a few versions back. More on that in a second.
Right now I want to direct your attention to this page on the site:
http://www.editorium.com/euindex.htm
It's a listing of the articles from back issues of the "Editorium Update," a free, weekly DesignGeek-like newsletter with a focus on editing and formatting Microsoft Word files.
The writer, tool developer and site owner is Jack Lyon, past book editor and current managing editor of a publishing house. After I read a few of his articles, I was hooked. I'm not an editor, but I play one all the time, and in my brief sampling came across a ton of information that will help me work smarter in Word (and, subsequently, in InDesign and QuarkXPress). I subscribed immediately.
If you use Word (even just to look at a file before importing it into a layout program), take a look. If your clients or your editors use Word, do them a favor and encourage them to check out the site and perhaps subscribe.
To subscribe to the weekly Editorium Update, send a blank e-mail to:
editorium-subscribe@topica.com
You'll need to reply to the confirmation e-mail, and then you're subscribed. Jack sends these out every Wednesday.
-----
About those Editorium Tools
-----
Go back to the home page at editorium.com to see the Word add-ons and other tools. You have GOT to check these out. (Where have they been all my life?)
Here's one example:
FILE CLEANER: FileCleaner cleans up common problems in electronic manuscripts, including multiple spaces, multiple returns, unnecessary tabs, improperly typed ellipses, ells used as ones, and so on. It turns double hyphens into em dashes, and hyphens between numerals into en dashes. It can also remove directly applied font formatting (such as Times 12 point) while retaining styles (such as Heading 1) and character formatting (such as italic and bold), quickly cleaning up those messy documents imported from other word processors or OCR programs.
It looks like Jack allows you to download and use any of the tools for up to 45 days as a try-out. All the documentation for the tools are on his site (I love it when developers do that) so you can get an idea of what's involved installing and using them.
Also, some of the tools can apparently do batch operations -- they can be run on a folder full of files. Now *that's* a time-saver.
|| top ||
==========================
Scaling Layer Effects in Photoshop
==========================
Since Layer Effects were first introduced in Photoshop--I think in version 6--their relationship to the layer they're affecting has always confused me.
For example, as soon as you apply an effect like a Drop Shadow or Bevel and Emboss, the effect is married to that layer alone. You can't select a second layer and say, "Hey, do it to this layer too."
Instead, you have to right-click on the Layer Effect, choose Copy Layer Style, then right-click on the second layer and choose Paste Layer Style.
Okay, they're married. A team. Understandable.
But when you scale a layer (Edit -> Transform -> Scale or Edit -> Free Transform), only the original contents scale, not the Layer Effects you've applied. If you scale a layer down to a tenth of its original size, its original Drop Shadow layer effect ends up looking enormous. Why is that? I thought they were a couple.
Here are a couple ways you can scale your Layer Effects to match the scale of the layer they're affecting.
----
Scale Effects
----
It's easy to miss, but there is a "Scale Effects" command in Photoshop. You can find it by right-clicking on the Layer Effects dropdown menu next to the layer in question, or from the Layers menu itself (Layers -> Layer Styles -> Scale Effects).
Choose the command to get a simple dialog with a percentage slider and a Preview checkbox. Use the slider or type in a number in the percentage field and you can see your layer effects grow or shrink appropriately, while the layer content itself remains the same size. In other words, the opposite of what I described above.
If you've applied more than one Layer Effect to the layer and choose Scale Effects, all the effects scale as a group. You can't single one out for special treatment.
I normally do this by eyeball, but Shangara Singh, ever-so-helpful Photoshop pro, provided a nifty tip on the Photoshop listserv recently: When you scale a layer, the Options bar across the top of your monitor gives you a readout of the amount of scaling you're applying. It goes away as soon as you confirm the Scale transform, so keep an eye on it and memorize it.
Enter that same number in the Scale Effects dialog to get the layer effects to match.
-----
Lift and Separate
-----
If you're positive that the Layer Effects you've applied are final -- that you'll never need to edit their settings -- you can separate them out as actual layers, and link them to the layer they used to affect.
As you know, linked layers transform in tandem. Select the artwork layer, scale it, and the others (the linked effect layers) go along for the ride.
To convert Layer Effects to regular layers, right-click on the layer effect dropdown menu and choose Create Layer, or go to Layers -> Layer Styles -> Create Layer.
Depending on the kind of Layer Effects you applied, your results may not perfectly match; but Drop Shadows are usually not a problem. Some of the effects get converted to grouped ("clipping mask") layers so they work correctly.
To link the original layer content with its emancipated layer effects, click in the empty box to the left of each layer you want to add to the link group. You'll see a little chain icon appear in the box when it's linked.
Now you can choose any of the linked layers, and when you scale it, the others scale along with it.
*^*^*^*^*^*^*^*^*^*^*^*^*^*^**^*^*^*^*^*^*^*^*^*^*^*^*^*^*
TRAINING FROM SENECA GOES ON AND ON AND ON...
All of our design software training includes 3 years of 24/7 follow-up support from me by phone or e-mail for each student in the session. It's like having your own personal consultant at your beck and call. Clients love it for getting a quick answer, or when they're working outside of "normal" business hours, when Adobe or Quark's tech support departments are closed.
This phenomenal level of support is just one of the benefits I offer to training clients. To learn more, contact me or fill out the no-obligation "Request a Training Quote' form on Seneca's site:
http://www.senecadesign.com/training/request.html
Recent training clients include Ispat/Inland Steel (InDesign); Serta (Photoshop); Awana Clubs International (OS X, InDesign); BBDO Chicago (InDesign); S & C Electric (InDesign); Emergency Nurses Association (Quark 6, Photoshop CS and Illustrator CS); McDougal Littell (InDesign); the Chicago Cubs (Quark 6) and Phototype Engraving (Illustrator CS).
*^*^*^*^*^*^*^*^*^*^*^*^*^*^**^*^*^*^*^*^*^*^*^*^*^*^*^*^*
|| top ||
--------------------------------
DesignGeek is a free bimonthly publication written by Anne-Marie "HerGeekness" Concepcion, a cross-media designer and authorized Adobe and Quark training provider. She owns Seneca Design & Training, Inc. in Chicago, Illinois (http://www.senecadesign.com/).
To subscribe to DesignGeek or read archived issues, go to its home on Seneca's site: http://www.senecadesign.com/designgeek/subscribe.html
To unsubscribe, follow the link at the bottom of this page.
Contact Seneca by phone at 312-946-1100 or e-mail at info@senecadesign.com
Copyright 2004 by Seneca Design & Training, Inc.
Please forward without cutting. Please contact Seneca for reprint permissions. We don't guarantee accuracy of articles. Company or product names mentioned in DesignGeek may be registered trademarks, we use the names in an editorial fashion with no intention of infringement.
--------------------------------
If you had received this by e-mail instead of reading it on my web site, your unsubscribe link would appear right here.
