Efficient Design – Essentials for Designing Professional Comps Quickly
Through the years I’ve noticed a trend that more experienced, senior designers are much more productive than junior level designers. I first noticed this when LevelTen would hire junior-level designers based on a great portfolio, but ultimately get less productivity from them because it took twice, sometimes three times as long for them to create a site design comparable to a senior designer’s.
From a business perspective, this inefficiency not only causes bottlenecks in production and budget increases, but also can harm morale of the team.
Management may get frustrated because they feel like they made a poor hiring decision. The designer’s confidence is reduced because he feels he’s not up to par. Overall, it can make for a bad situation.
I started researching the subject of why some designers work faster than others and often have better quality work. All things considered, talent wasn’t the issue. Experienced/good designers simply have a much better toolbox to work with. Maintaining a design toolbox can save many hours of research, is a great resource for inspiration, and is essential for any designer wanting to work faster, not harder.
Here are 8 tips for designing professional comps quickly:
1. Create/use a design toolbox
If you don’t currently maintain a design toolbox, I highly recommend doing so. A design toolbox can be as simple as creating a folder and organizing your design tools, tips, tricks, and cool inspiration. The benefit is that it can save you hours of looking through old client folders, setting up new page layouts, finding color schemes, and searching for inspiration.
I categorize my toolbox by Tools, Icons and Buttons, Blank Templates, Textures and Patterns, Inspiration, Color Schemes, Comp Cooler, etc.
2. Use design templates
You probably don’t think about it, but can spend up to an hour or more per project simply setting up Photoshop page widths, guides, organizing folder structures – really any technical task that removes focus from being creative.
My Blank Templates folder houses many preconfigured PSD files. If I know the site calls for a 3 column layout with 20px gutters, I simple copy that template to my Client folder, open it and have pre-defined guides, folders for Header, Banner, Right Column, Middle Column, Left Column, Footer, etc. By doing so I give my clients at least an extra 30 minutes dedicated to image research, tightening up comps etc. Again, work smarter, not harder.
3. Research and Study Photoshop /Illustrator Tutorials
As design experts we all know everything there is to know about Photoshop and Illustrator right? Probably not. I find it very helpful to brush up on tutorials from time to time. Even if there isn’t an immediate need I like to review tutorials and save links to good tutorials in a folder. That way, when the need arises I’m more prepared and don’t have to waste time searching the web for tutorials. “Damn, how did I create that gradient mesh again?” I’m sure we’ve all been there.
4. Collect Color Schemes
Weather you’re creating Photoshop color wheels, using color scheme swatches from websites, or sampling schemes from cool photos its very useful to collect them in one place. My folder consists of subfolders broken down by overall tone/mood. Examples of how you can organize might be Warm, Cool, Exciting, Conservative, Light, Dark…I’ve also seen them broken down by hue >saturation>value.
It’s your toolbox! Organize them in a way that makes sense to you. Overtime, you will gather 100s of wonderful color schemes to use or draw inspiration from.
5. Save Textures and Patterns
I’ve made it a good habit to collect textures and patterns in my toolbox and load them as Photoshop brushes if/when the need arises. Simple and sparing usage of textures and patterns add depth, detail and often a little something that can take a comp from mediocre to professional. Believe me, it’s much easier to load a floral brush and use it than to create a floral pattern from scratch.
6. Collect Inspiration
From time to time, we all need inspiration. It might not be right now, but having a notebook or folder of ideas when the time arises is paramount in our industry. The key is to always be collecting. For example, if I’m out on the town and see a cool shape, perspective, color scheme, or design element, I’ll break out the camera phone, take a picture, and then put it in my Inspiration folder for later use.
7. Record and Save Your Actions
The ability to create and use pre-designed Photoshop actions is on of the biggest time savers I’ve found when creating websites. Photoshop allows you to record step-by-step actions that can be saved then reused if the need arises. The need always arises!
I’ve literally saved 100s of hours by simply recording, saving and utilizing Actions rather than recreating the wheel every time out.
8. Create a Comp Cooler
As a professional designer you most likely create 3-5 comps per client only to have one chosen. Why throw the others away? Instead, place them in a Comp Cooler folder and review them from time to time. Use them to draw inspiration or maybe use a comp for another project. The ability to use and reuse saves time.
