In a forthcoming redesign of pacifichelm.com, I decided to make icons for the services we provide: UI Design, Visual Design, Production Design, Consulting, Animations and Special Effects. They'll be used at a fraction of this size, but I decided to play them up a little with some shiny visual treatment for kicks!
Please, feel free to comment below, just keep it constructive.
I love this wand. However, I feel like the middle separation on the pen is too big. It feels like the pen is cut in 2 parts. Also, I feel like you could add some space between the nib and the rest of the pen, like you did with the paintbrush. Love the colors :)
Most of it has some detail, but wand and brush dont. I think there's something missing here. Wand is understandable, but I think you could add more detail on the brush. Anyway, great job.
@matt ⚒ Thanks, I'm not sure about adding additional detail near the tip, because it already has quite a bit there.
@Christophe Tauziet "I feel like" this is good feedback. At this large size, I agree with you. At a smaller size (half of this size here) is what it will be used at, which is nice to have those clean breaks.
@Lucas Veiga While the pencil is detailed out of necessity, adding detail to the paintbrush or wand would be unnecessary, I believe.
@Louie Mantia "I feel like" this is a valid reason :) about the space between the nib and the rest of the pen, it would be more consistent with the paintbrush icon. Don't you think?
I like these, but the overall shape of each one is so similar. I wonder if it might make more sense to focus on the unique, identifying part of each tool, rather than showing the whole thing. Especially if they're going to be used at half this size.
So, basically just zoom in on the tip of each one and crop out the rest with the circle. You might need to add a bit more detail to the pencil (show the lead) but otherwise I think they'd be just as identifiable, and the differences between each tool would be more emphasized.
It's got a lovely feel, and they all work quite well for me. However, I agree with the pencil nib separation. I also perhaps feel like the brush shape needs some altering.
Would also like to have a peek on the smaller scale versions! Really tasty icons!
From my point of view, there's something a little odd about the color scheme here: there's a lot more in the shade of blue than there is of green and yellow— or red even. Though I assume it has something to do with the overall branding of your studio. Nice work!
I would've rather seen them on flat colors - they look too childish here. I think the flat color at a smaller size would make them look quite classy.
On another note - I don't like the pen nib. Can you honestly say you guys use those on a daily basis or know anyone who does? Even if you did, I think it's a little archaic and not sure that it is an accurate representation of Consultation. I would rather associate that as a conversation and a gathering ideas vs. writing something down.
Also, regarding the pen, none of these are a literal translation. I don't use a paintbrush to paint UI or Xacto knife to cut UI, they're all metaphors.
@Louie Mantia Well, it is your right to not agree, but that's the point of posting to dribbble to get feedback, yes ;) ? Not everyone looking at the site is going to be you or think just like you, and that's what I'm getting at with my feedback I don't think they need the added "glitz" for dribbble if that's what you'd like to call it. They probably look great without them, since you said yourself, they would be flat on the site.
In that case, I also wouldn't think these are the best representations in general for what they're supposed to be a metaphor 'for' if you will - for example, I'd probably be quite confused if I saw a paintbrush for UI, because I'd probably think illustration instead, but hey, everyone's different! :P
You've sacrificed accuracy for the sake of consistency in the design. Making it difficult to understand what each icon means. The best icons don't require labels describing what they are. They are nicely designed, but your use of them is confusing. I can't tell which icon is for Consulting (the pen?) and which is for Animation.
@Elisa D'Alessandro I think you overestimate the role of these icons. They're going to be 48x48 with a large title next to it. The focus wont be the icons, the icons are just anchors.
@Steve Grenier Like Elisa, I think you are overthinking these icons. And your notion of "the best icons don't require labels" is precisely the opposite of what I'm doing here. The labels on the site are primary, and they are the ones that are required. I don't believe there's anything I could draw for each of these that would convey each service without saying what service it is beside it. And I don't believe you can accurately say that the use of these icons is confusing as these are out of context.
@Josh Puckett For some of our clients, they already have UI (wireframes and rough mockups) already drawn up, and we come in to make it look beautiful (Visual Design). For others, they have done research and have ideas, but don't have wireframes or application flows built (UI Design) to move forward.
We like to think of UI Design as Sudoku, knowing that specified things are required, and fitting them together properly. And we think of Visual Design as a paint-by-numbers, taking the UI and creating a beautiful, consistent visual style on top.
@Robert Cooper I think @Mike Piontek suggested earlier using the tips of the tools, but I disagree. I prefer them being the same thickness and angle for aesthetic reasons. They definitely can work at different angles, and that could work as they will go down the page. :)
25 Responses
Pro
Louie Mantia
In a forthcoming redesign of pacifichelm.com, I decided to make icons for the services we provide: UI Design, Visual Design, Production Design, Consulting, Animations and Special Effects. They'll be used at a fraction of this size, but I decided to play them up a little with some shiny visual treatment for kicks!
Please, feel free to comment below, just keep it constructive.
5 months ago
Pro
matt ⚒
The only one I'm not getting is the x-acto... maybe some breaks around the blade?
5 months ago
Pro
Christophe Tauziet
I love this wand. However, I feel like the middle separation on the pen is too big. It feels like the pen is cut in 2 parts. Also, I feel like you could add some space between the nib and the rest of the pen, like you did with the paintbrush. Love the colors :)
5 months ago
Most of it has some detail, but wand and brush dont. I think there's something missing here. Wand is understandable, but I think you could add more detail on the brush. Anyway, great job.
5 months ago
Pro
Louie Mantia
@matt ⚒ Thanks, I'm not sure about adding additional detail near the tip, because it already has quite a bit there.
@Christophe Tauziet "I feel like" this is good feedback. At this large size, I agree with you. At a smaller size (half of this size here) is what it will be used at, which is nice to have those clean breaks.
@Lucas Veiga While the pencil is detailed out of necessity, adding detail to the paintbrush or wand would be unnecessary, I believe.
5 months ago
Pro
Christophe Tauziet
@Louie Mantia "I feel like" this is a valid reason :) about the space between the nib and the rest of the pen, it would be more consistent with the paintbrush icon. Don't you think?
5 months ago
Pro
Mike Piontek
I like these, but the overall shape of each one is so similar. I wonder if it might make more sense to focus on the unique, identifying part of each tool, rather than showing the whole thing. Especially if they're going to be used at half this size.
So, basically just zoom in on the tip of each one and crop out the rest with the circle. You might need to add a bit more detail to the pencil (show the lead) but otherwise I think they'd be just as identifiable, and the differences between each tool would be more emphasized.
5 months ago
It's got a lovely feel, and they all work quite well for me. However, I agree with the pencil nib separation. I also perhaps feel like the brush shape needs some altering.
Would also like to have a peek on the smaller scale versions! Really tasty icons!
Also, Olympics fan?
5 months ago
Pro
Josh Puckett
How do you (Pacific Helm) differentiate UI Design from Visual Design? Can you give an example of each?
5 months ago
Pro
CJ Melegrito
From my point of view, there's something a little odd about the color scheme here: there's a lot more in the shade of blue than there is of green and yellow— or red even. Though I assume it has something to do with the overall branding of your studio. Nice work!
5 months ago
Pro
Rok Benedik
I can see why you added a magic wand. It's the "do your magic" thingie that you often hear from clients :)
5 months ago
I like everything but the shiny circles. The color distracts me from the icon shape. And all the shapes are so nice, they should stand on their own.
5 months ago
iPod nano buttons!
5 months ago
Pro
Louie Mantia
@Fernando Lins Honestly the shiny was just for dribbble. Only the flat color glyphs are for the site. :)
5 months ago
I would've rather seen them on flat colors - they look too childish here. I think the flat color at a smaller size would make them look quite classy.
On another note - I don't like the pen nib. Can you honestly say you guys use those on a daily basis or know anyone who does? Even if you did, I think it's a little archaic and not sure that it is an accurate representation of Consultation. I would rather associate that as a conversation and a gathering ideas vs. writing something down.
5 months ago
@Louie Mantia Ah, good :)
5 months ago
Pro
Louie Mantia
@Elisa D'Alessandro I'm not sure I agree with "childish."
Also, regarding the pen, none of these are a literal translation. I don't use a paintbrush to paint UI or Xacto knife to cut UI, they're all metaphors.
5 months ago
@Louie Mantia Well, it is your right to not agree, but that's the point of posting to dribbble to get feedback, yes ;) ? Not everyone looking at the site is going to be you or think just like you, and that's what I'm getting at with my feedback I don't think they need the added "glitz" for dribbble if that's what you'd like to call it. They probably look great without them, since you said yourself, they would be flat on the site.
In that case, I also wouldn't think these are the best representations in general for what they're supposed to be a metaphor 'for' if you will - for example, I'd probably be quite confused if I saw a paintbrush for UI, because I'd probably think illustration instead, but hey, everyone's different! :P
5 months ago
Pro
Steve Grenier
You've sacrificed accuracy for the sake of consistency in the design. Making it difficult to understand what each icon means. The best icons don't require labels describing what they are. They are nicely designed, but your use of them is confusing. I can't tell which icon is for Consulting (the pen?) and which is for Animation.
5 months ago
Pro
Louie Mantia
@Elisa D'Alessandro I think you overestimate the role of these icons. They're going to be 48x48 with a large title next to it. The focus wont be the icons, the icons are just anchors.
@Steve Grenier Like Elisa, I think you are overthinking these icons. And your notion of "the best icons don't require labels" is precisely the opposite of what I'm doing here. The labels on the site are primary, and they are the ones that are required. I don't believe there's anything I could draw for each of these that would convey each service without saying what service it is beside it. And I don't believe you can accurately say that the use of these icons is confusing as these are out of context.
5 months ago
Pro
Louie Mantia
@Josh Puckett For some of our clients, they already have UI (wireframes and rough mockups) already drawn up, and we come in to make it look beautiful (Visual Design). For others, they have done research and have ideas, but don't have wireframes or application flows built (UI Design) to move forward.
We like to think of UI Design as Sudoku, knowing that specified things are required, and fitting them together properly. And we think of Visual Design as a paint-by-numbers, taking the UI and creating a beautiful, consistent visual style on top.
5 months ago
Pro
Robert Cooper
It's probably been said, but because of them all being roughly the same thickness and angle they may be too similar at smaller sizes.
Maybe they should be caricature like with accentuated shapes for the bits that make them distinctive, eg. the tip of the brush.
Also with them being in a circle I feel like they could work at different angles eg. flipped.
5 months ago
Pro
Louie Mantia
@Robert Cooper I think @Mike Piontek suggested earlier using the tips of the tools, but I disagree. I prefer them being the same thickness and angle for aesthetic reasons. They definitely can work at different angles, and that could work as they will go down the page. :)
5 months ago
Pro
Robert Cooper
@Louie Mantia Nice. Just scaled to 25% in PS and they work really nicely small :)
5 months ago
Great work
about 1 month ago