Photoshop Smart Objects, smart but not always that smart
2007 at 08.43 am posted by Veerle Pieters
One of my favorite Photoshop features is the Smart Object one. It has saved me a lot of time because you can avoid repetitive tasks. It’s perfect when you design template web pages with temporary content placeholders etc. But that’s just one advantage…
How I use Smart Objects
What I usually do is save the layers of a group of elements into a Smart Object and then duplicate that Smart Object as many times as I need to. Perfect example is the image below which is from a project I worked on called MoveDigital. This web page design shows 5 of these small boxes containing a title, text, image and play button. I create a Smart Object : I select the layers, hold down 2nd mousebutton and select 'Convert to Smart Object'. Then I duplicate the Smart Object layer 4 times and move each of them to its right location.
If I need to change something I'll just edit the Smart Object by double clicking the Smart Object Layer icon. I save it, close it and all Smart Objects are updated. I use Smart Objects for buttons that appear more than once on a page for instance "Learn more" or "Read more". If you need to change the button's color or its effect, you only have to do this once.
Smart Objects means flexibility
I try to work with Smart Objects as much as I can because it gives me this flexibility. I tend to copy and paste objects from Illustrator a lot. I always paste icons or illustrations as Smart Objects. This way you keep the flexibility of a vector-based object. You can resize the object without the fear of quality loss. You can apply changes via Illustrator. You save it, close it and it's updated in Photoshop.
Flexibility, but not only for vector-based objects
Another good idea of how to use Smart Objects is when you have a bitmap element that you would like to use in your layout. Only, you're not sure how big you would like to place it in your layout. You need some room to play with it. You could start with big dimensions, make it a Smart Object and then scale it down to the preferred size. If you decide later on to enlarge this shape a bit, you still can without any quality loss even though the shape is pixel-based. Its original size is the size you saved in the Smart Object. So as long as you don't resize it bigger than that you are safe.
Smart but not always *that* smart
Smart Objects are perfect... or maybe not for 100%. At least that's my experience. There are a few pitfalls and I would even consider them bugs. Though, I would call the one I recently encountered a usability flaw.
These were my steps :
- I double click the Smart Object to edit its content
- I edit the content of the Smart Object, save it, but don't close it
- I click back to the main Photoshop file (to copy some text)
- while I go back to the main Photoshop file, I noticed that I accidentally moved an item
- I want to undo my error, but it appears to have happened already before I double clicked the Smart Object
- I go to the History palette to undo my mistake and so I go back before the 'Update Smart Objects'
Here is what happened:
My thinking here was "OK I can still do this. My Smart Object is still open with its new state so if I save this state, it'll re-update in the main document". Well guess what: WRONG! After saving and closing the Smart Object, nothing got updated and I was back to square one. I had to redo all my work. Now I wonder, what the hell was Photoshop saving when I saved my Smart Object? To me this is bad usability. Even if I go back in the History palette before my last Smart Object update, I find it illogical that when I save the Smart Object in its current state, things don't get updated. I didn't close the Smart Object and after all I did was saving it in the end.
One more thing...
In a next article we'll talk about a sibbling of the Smart Objects namely Smart Filters. You know, normally filters are a destructive way to manipulate images since they change the actual pixels in an image. Smart Filters lets you recall, modify and delete filters without touching the orignal image.
Want to learn more?
A good and not expensive source to learn more about Illustrator, Photoshop, or web design is by joining the Tuts+ sites. You get access to the source files for just $9 a month. So your ONE membership gives you access to members-only content for ALL the Plus sites. I've written a tutorial for the Vector Tuts section.