Oct 16
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.
36served
1
I never thought of using Smart Objects in this way - you may have saved me a lot of time!! Thanks Veerle :) Another great article.
2
Thx for the article! :) It’s great!
3
Hi Veerle!
It’s really clever solution in Photoshop . ^^
4
I usually use Smart Objects in that way and I just love it! Also Great if you import an .ai (logo for ex.) and update it later in that .ai file. Thee PSD updates the smart object and everything fine.. Thank you Adobe. ^^
5
Good lord, thanks a lot for this tutorial. This will save me lots of levels in the folder tree (I bounced into the limit…)!
Thanks V.
6
Hi, I also use the Smart Objects like this. But I encounter another Bug or a bad usability issue:
I often use masks with layers. Naturally, I wanted to use a mask on a Smart Object. If you don’t want to move or scale the smart object everything is okay, but as soon as you move (or scale) it, the mask doesn’t scale/move with it. It just acts like an unconnected mask and stays where it was.
7
Thanks for a great article!
I was never sure what Smart Objects were, now I do and I think they’ll be really helpful in the future.
Looking forward to the next article, Smart Filters are another thing I know nothing about ;)
8
One feature I miss is a way to dumb a smart object
Something like the rasterize smart object but it would create all the layers from the smart object but will not keep the smart object status.
There’s also one option that I use that is the create new smart object by copy, so you will have a second smart object just like the first one, but you can edit it and would not impact the first one
I use it mainly for buttons where all the button art is in a smart object with a text layer on top, and others art that I want only for this specific button, but If I edit the base of the button (the smart object inside the smart object) it will be replaced in all buttons.
9
I saw the title of this post in my feed reader and thought, “What!? Veerle is hating on Smart Objects?” Thankfully that wasn’t the case. For all the time I’ve spent dealing with tiny annoyances that have come up while using Smart Objects and Filters, they’ve saved so much more time overall that I can’t really complain. Looking forward to the post on Smart Filters!
10
Smart objects are a lifesaver - my most usually use of them being when I add a large image to a document, instead of duplicating it and scaling the dupe, I just create a smart object so that I can scale it up ‘n down willy-nilly like.
One problem I’ve encountered with smart objects is that sometimes they don’t retain the sharpness of the original, things tend to get fuzzy.
11
But Masks on that layers are stupid. They`re not linked with layer.
12
Never looked at Smart Objects this way it’s just like an instance of an object in Flash or a factory class in php, thanks for the info.
13
What bugs me about smart objects is when you double-click them to edit, do your editing, save, and return, often. Depending on if the S.O. was scaled (and sometimes regardless) the S.O. will have a low-res look to it afterward. This results in my having to re-open the S.O., drag everything out into the main document, and then recreating a separate S.O. Just not worth it if you ask me. Of course, this is in CS2 and I don’t work often enough in CS3 to see if this has been fixed.
14
This is brilliant. I have been using Potatoshop CS3 for a while now, but never looked into Smart Objects. They just seemed like another add-on-feature that nobody really needed.
15
I’ve noticed the same interface flaw with saving smart objects. I’ve just gotten in the habit of closing the window (cmd+w) and waiting for the “Save?” prompt to say okay. This way, I know the edit is always passed on and I’m not in that, “what state am I in?” mode.
16
As some here already stated, smartblocks, oh yeah, those, there must be cool things to do with it… Thanks for pointing this one out Veerle.
Cheers, Conrad
17
This tutorial makes me realize how little I really know about Photoshop, even though I use it almost every day. The depth of functionality in the Adobe Suite is pretty staggering. I wonder what other tricks and tools I’m missing out on. Thank you Veerle for the useful lesson.
18
Have to agree with Adam, you really need to watch the quality of the rasterising with smart objects - esp vector artwork at small pixel sizes can get pretty rough.
I use the smart object in the design iteration phases but rasterise carefully for the final artwork - blow up the object by 100%, rasterise and then transform back down to 25% - the correct size (remembering to paint some extra lines outside the object so PS doesn’t carve the edges off badly).. this sounds fairly anal (it is) but the results can be a lot better.
I’m really waiting for Adobe to sort out the overly sharp edges/missing pixels that Photoshop creates when scaling down small rounded shapes.
19
Never know of this way to use Smart Objects… i just used them with copy/paste from Illustrator… I’ll try these tips =)
20
And one other thing, if you have your layers set to multiply this no longer work when you put them together in a smart object. The appearance stays but flattened. Al least in CS2 (no funds for 3 :()
21
Excellent article - this can really come in handy and save a ton of time!
22
Wow, that way of using smart objects for placeholders in layout is so simple… Why I didn’t think about it before… thanks.
23
@Carsten & Alex : I noticed this bug too, and I really don’t understand why we can’t link masks to smart objects… The solution I found is to put the smart object in a group, and then apply the mask to the group. That way, the mask will be linked with the group. Cumbersome, but hey smart objects are too useful to be picky :p
24
I love smart objects. But some things about them really annoy me. Two have already been mentioned:
- The fact that you can’t lock a mask to a smart object, like Alex said.
- The issue with the blending modes, like Martijn said.
My third complaint is that when you double click a smart object and then change the canvas size of it’s content, the resulting smart object gets squeezed or stretched. It keeps it’s original size totally ignoring the fact that you changed the canvas size of it’s content.
Disclaimer: I’m still on CS2
25
Is there any way to edit the smart object content in place, without opening a separate window? Sometimes I need to see surrounding area to see if a change is ok to be done.
26
Thanks for the tutorial! Is it possible to use the same smart object across multiple files? For instance mocking up a webpage often involves creating images of several of the pages to be found within the site. If I had a “play” button that was going to appear on numerous pages…could I open one of the mock ups, edit the “play” button smart object and have that change occur in all of the mock ups? In my experimenting I can only get the smart objects to change within a file, not across files. Any suggestions would be great. thanks!
27
very neat. i’ve never really used smart objects, other than imports from illustrator sometimes…
i’ll have to give them a go!
28
June said:
You can make your play button an independent file, and “place” it into your different mockups. The button will appear as a smart object in the layer palette, linked to the original file. If you update the button file, the mockups will ask you if you want to update the link and if you answer yes, they will be updated. Pretty neat. But I dunno if double clicking on the smart object will open the original file or if it will open a “local” copy of it. Gotta try that…
29
As seemingly everyone else has said, Smart Objects are very cool, but there’s a few annoyances (some already mentioned).
In particular, if you make a smart object of a few layers, and duplicate the resulting smart object layer, they become an instance of that smart object.
If you edit one of those object the changes go across all smart objects.
This may be a feature, but it can prove annoying. For example, the boxes used in your own example above, you may want to make these boxes different to each other and there’s no way to solve that with Smart Objects.
Don’t get me wrong though, smart objects make my day easier :)
30
I really need to learn smartobjects… why does it always feel like everyoneelse knows everything? :)
31
Thanks for the lesson. I’ve never used smart objects before and this is a real timesaver for photo contact sheets.
32
Great tip, thanks
33
Thank you all for commenting here. Some of you were mentioning things that don’t work well with Smart Objects, such as Masks or Layer modes. It would be cool to have both working perfectly. I use the same technique to link the mask as Jean-Baptiste, but it’s of course not ideal.
Martijn said:
Pjtr said:
That I believe is solved in CS3 :)
Richard said:
Unless someone contradicts me on this, I don’t believe there is.
Jean-Baptiste said:
I recently discovered this myself. I didn’t know this. This could be pretty handy. Thank you for this valuable comment :)
Tom said:
True, but if you just group the layers of the things that are the same and leave the layers that you like to differentiate out you can still do this. That’s how I sometimes do it. For example a page design for a blog that shows 10 entries, I leave title out and the image out and they look like random entries. If the client decides to add something in the footer of the these entries well I edit only 1 footer, not 10 ;) I also use the “New Smart Object via Copy” a lot to create a 2nd, different Smart Object from the original Smart Object (holding down 2nd mouse button on the Smart Object Layer). This is also pretty handy.
34
Thanks, I wondered what they were ... guess you’ve just saved me a few days a year.
35
Wow, and I thought Smart Objects were just there to kill machines with less than 3.5gb RAM. (Just kidding - kinda)
Showed me a trick or two - thanks!
36
Great article thanks for sharing..:)