Filtering by Tag: tips
As a designer, I know what it's like to start designing and be so focused on getting your design done and tweaking it just right until you've created something that you and your client are happy with. I get into the zone when I design and I'm jumping from layer to layer, resizing elements, adding layer effects, etc. At the end of the day you don't necessarily have time to be as organized as you can be. Your process is your process and it works for you. But last week I was closing up my files and organizing my designs at EFS to allow for the next Art Director to take over. And let me tell you that opening up some of those designs was annoying and I have myself to thank. It was especially annoying because I remember working on some of them and making a mental note of how to make my files and designs more organized. So now I turn my mental notes into actual ones. As I worked on my EFS files while following these tips I felt so much better - more organized and more effective and efficient! Trust me, it's worth the time and saves you the mental battle. Here goes...
Name your files, folders and layers. It is one of the most annoying things when you open up a photoshop document and the layers are named "layer 1" or "layer 44". What does that mean?! Even if you've worked on the file yourself doesn't mean you'll remember all those layers. It just saves you the time that you would use to familiarize yourself with the file. If nothing else, group the layers and name the folders that you group these layers into and make it descriptive but short. When naming your files, make it descriptive and short too. And if you have multiple versions of files, make sure you indicate which one is the master one. Now before people comment on this one, I know people are divided on this issue - some think it's a complete waste of time and others greatly appreciate it. I am in the latter group (obviously) and this is one designer's opinion.
Use Smart Objects
Whenever possible, design your elements as vectors or large images and import them into Photoshop as Smart Objects. This will allow you to resize these elements easily and as often as you want without losing quality. This will increase your file size but it's worth it! I've opened up other designer's files to work on them and realized that I can't enlarge their elements as I need to because they've flattened their vector objects.
Hide Your Layer Effects
I wouldn't say you need to do this while you're working on your photoshop files, but it's helpful at the end of the day or when you close out a design. Click that little arrow where you have your layer effects and hide it. It makes looking through your layers and familiarizing yourself with your files so much easier the next day or the next time you refer to them.
Use Layer Comps
This is one of those Photoshop tools that I discovered later than I would have liked. Layer comps are one of the most useful tools in Photoshop. It is especially useful if you're designing for interactivity. If you don't know what it is or have never used it I suggest you get familiar with it. It makes creating mockups of your designs so much easier because it remembers the state of your layers.
I find designing for a larger resolution than you intend to is always better. Especially if you're doing a lot of your design work in Photoshop on flat layers. If you're working with mainly vector elements then it's not so much of an issue. But working at a larger resolution gives you the flexibility of going bigger. What if your client all of a sudden wants to deliver their project for 1024x768 and not 800x600 as they originally wanted?
Keep Text Layers
Do not rasterize your text layers whenever possible. This gives you the flexibility of changing your text layers as you want. If you're delivering the file over to another designer and font availability is an issue then by all means flatten it. But keep a copy of the original text layer when you can.
Delete Unused Layers
My design files usually have layers that I keep around in case I want to go back to that design, but most of the time when I've moved on from a certain look, I've moved on and never come back. So it's good to clean up your files. This goes for Photoshop files and also your CSS documents. This isn't always feasible on a day-to-day basis but even if you do this at the end of the project when you've finalized your design it's good practice. It can also reduce your final file size.
Invest Time Into Your Workspace
By this I mean your graphic editing software. Take the time to set up your workspace in Photoshop (or your favourite graphic app). This includes adding brushes, styles and effects plug-ins. This will make designing a lot easier because you can use and reuse styles, mix and match them, add your favorite effects, etc.
Know Your Development Environment
As a designer/developer, I consider what it means to have to develop and deliver a design myself. It's good to know who your clients are and who your target audience is. If file size is important then you can reduce your designs to the effects that are needed and make a difference as opposed to "nice-to-have" polish. You should also consider how to create the design programmatically. If it can be reduced to code then that's more efficient than slicing every element into images.
All that being said, I won't pretend to follow these tips 100% of the time. I know there are time constraints, deadlines, whatever. But I also know now that it will make my life (and other designers that have to see my design files) easier if I do.
Occasionally I'll post a developer tip/note. As an interactive designer and developer, I use Flash and ActionScript often. These are two methods that I find useful and indispensable when working with dynamic movieclips.
Imagine you need to find a MovieClip in your library or dynamically reference a Class and all you have is the linkage/class String name. You can create an instance of that MovieClip or Class using getDefinitionByName.
This method returns an instance of a Class Object from the Class name you provide. It is defined in the support docs as:
public function getDefinitionByName(name:String):Object
Let me show you an example. To get an instance of a MovieClip or a Class Object with the name "Class_Name" and add it to the stage:
var myClass:Class = getDefinitionByName("Class_Name") as Class; var classInstance:MovieClip = new myClass as MovieClip; addChild(classInstance);
This is equivalent to
var classInstance:MovieClip = new Class_Name();
Now, to do the reverse - to get the name of a MovieClip that you've dynamically created, use getQualifiedClassName.
This method returns a String which is the name of the Class instance you provided. It is defined in the support doc as:
public function getQualifiedClassName(value:*):String
Back to our example. Suppose we've created the instance classInstance and we want to get the linkage name or the name of the Class:
var className:String = getQualifiedClassName(classInstance);
The result would be, className = "Class_Name".
That's it! Oh and don't forget to import these two methods:
import flash.utils.getDefinitionByName; import flash.utils.getQualifedClassName;