All sizes in the Fullview! Client work for a lovely new in-development Mac App. Loads of fun to make, and my first experience with tricky materials like cloth and flat metal :)
Lovely work @Ollin. The cloth is marvelous. The small sizes aren't as strong as the full size versions, but recognizable nonetheless. Just out of curiosity: how much of this piece is still vector?
@Max Steenbergen Thanks! My work is done in GIMP, sadly, so no vectors at all D: makes scaling a challenge. This is what I work with... I'll be switching to Sketch 2 once it's released, though :)
mother of icons!! this is a great work man! my only suggestion would be put only the star shape on the smaller size instead of the square with star :), also tone down a little the strokes i think they're too hard, specially on the 32 one.
@Fabrice Delaneau Thanks :) and, yeah, you're right about the perspective. I originally intended to make a 3d model but I ended up just tracing my sketch, hence perspective issues :P need to learn to draw better.
We chose the velvet but I liked the right wrench, so I made a Sloppy combination and scaled it to the right size.
So I traced that to get a flat-color file and tweaked the perspective until I liked it. The star was a pixel image that I rotated, perspective transformed, and then traced into a path. The depth on both the star token and the wrench was created by duplicating the front [white] layer, making it black, moving it around, and then connecting the corners.
Third round, and I fixed the perspective on the cloth and did the smaller sizes.
Long story short: no illustrator, no 3d, not even layer groups. just a bunch of finicking around until it "looked right". Everything is freehand, which is why I ended up with the wrench issues :) Perspective and concept are, for me, easily the hardest part of an icon [shading is easy and fun]. Learning to draw well is definitely the best way to solve the perspective issue, 3d can only be useful in some situations [unless you're really good at it].
@Eli Schiff I've been thinking about doing a tutorial or something for a while, I always ended up getting distracted or discouraged though. :/ once I get a website done, I'm going to try and do case studies [not videos] often, though I'm still not sure when I'm going to make progress on the site. There's a lot of stuff I want to talk about, about how to design concepts and shading and all the protips I've found... but I always find some obstacle to look at and say "oh well, I'll deal with that goal later". I can say for certain that stuff will get done during the summer, but I'm certainly hoping to get it done sooner if I can work up the motivation. If you have specific questions before then, feel free to ask on dribbble or twitter :)
@Ollin Yeah, totally I know the feeling. Yesterday I did a cleanup of my projects folder, and it turns out I have about 75 projects that I want to do, around 8 of them being high priority. Your little tutorial is one of the top 8!
Thank you for the offer and I might just take you up on it! I just followed you on the twitter.
29 Responses (page 1 of 2)
Pro
Ollin
All sizes in the Fullview!
Client work for a lovely new in-development Mac App. Loads of fun to make, and my first experience with tricky materials like cloth and flat metal :)
about 1 year ago
Looks awesome! As not as first try :)
about 1 year ago
Pro
Moritz v. V.
Looks good :) But the stitches could have a bit more volume and maybe a small inset.
about 1 year ago
Pro
Osilly
Woooow :))
about 1 year ago
Pro
Max Steenbergen
Lovely work @Ollin. The cloth is marvelous. The small sizes aren't as strong as the full size versions, but recognizable nonetheless. Just out of curiosity: how much of this piece is still vector?
about 1 year ago
Pro
Guillaume Gaubert
Really nice! The lighting is perfect and the pressure on the tissue is great.
Just a thing, the perspective on the top of the wrench looks a bit odd.
about 1 year ago
As I said before, superb work.However, Y U ADD REFLECTION ON FLOOR?
about 1 year ago
Pro
Ollin
@Asher LOL, is it that bad? I guess it's weird that the floor reflects the wrench but not the other way around... here's a reflection-free version ;)
about 1 year ago
Pro
Ollin
@Max Steenbergen Thanks! My work is done in GIMP, sadly, so no vectors at all D: makes scaling a challenge. This is what I work with... I'll be switching to Sketch 2 once it's released, though :)
about 1 year ago
Pro
Fabio Benedetti
@Ollin lovely work. The metal is ace ++
about 1 year ago
mother of icons!! this is a great work man! my only suggestion would be put only the star shape on the smaller size instead of the square with star :), also tone down a little the strokes i think they're too hard, specially on the 32 one.
about 1 year ago
Pro
Supratim Nayak
Ho, this is awesome!
about 1 year ago
Pro
Fabrice Delaneau
@Ollin, your work on the materials is awesome but I have to agree with @Guillaume Gaubert the perspective of the wrench is wrong.
Right now it seems to be an isometric view of the wrench whereas the rest of the icon has a more natural perspective.
about 1 year ago
Pro
Gert Jan Lodder / Pixellod
Wow, lovely work, Ollin!
about 1 year ago
Pro
wakaba
Very nice! I like the texture and wrinkles of cloth.
about 1 year ago
Pro
Christophe Tauziet
Reaaaaaally nice
about 1 year ago
Pro
Ollin
@Fabrice Delaneau Thanks :) and, yeah, you're right about the perspective. I originally intended to make a 3d model but I ended up just tracing my sketch, hence perspective issues :P need to learn to draw better.
about 1 year ago
Pro
Eli Schiff
@Ollin do you make your perspective in illustrator? How do you get it to be just right like that? (on the star piece it's spot on).
about 1 year ago
Pro
Fabrice Delaneau
@Ollin, like @Eli Schiff says the star is spot and a few tweaks on the top side of the wrench shouldbe enough to correct the perspective.
about 1 year ago
Pro
Ollin
@Eli Schiff In this piece, I did perspective the Pedja way; just play around until it looks nice.
I started by drawing some quick sketches
We chose the velvet but I liked the right wrench, so I made a Sloppy combination and scaled it to the right size.
So I traced that to get a flat-color file and tweaked the perspective until I liked it. The star was a pixel image that I rotated, perspective transformed, and then traced into a path. The depth on both the star token and the wrench was created by duplicating the front [white] layer, making it black, moving it around, and then connecting the corners.
After that, first round of shading
Second round of shading, and then I sent it around for feedback from the client & friends.
Third round, and I fixed the perspective on the cloth and did the smaller sizes.
Long story short: no illustrator, no 3d, not even layer groups. just a bunch of finicking around until it "looked right". Everything is freehand, which is why I ended up with the wrench issues :) Perspective and concept are, for me, easily the hardest part of an icon [shading is easy and fun]. Learning to draw well is definitely the best way to solve the perspective issue, 3d can only be useful in some situations [unless you're really good at it].
about 1 year ago
Pro
Eli Schiff
Ollin, you have just made everything so clear. You should write a tutorial or even teach this. Pull a Sebastian De With :) Thank you!
about 1 year ago
Pro
Ollin
@Eli Schiff I've been thinking about doing a tutorial or something for a while, I always ended up getting distracted or discouraged though. :/ once I get a website done, I'm going to try and do case studies [not videos] often, though I'm still not sure when I'm going to make progress on the site. There's a lot of stuff I want to talk about, about how to design concepts and shading and all the protips I've found... but I always find some obstacle to look at and say "oh well, I'll deal with that goal later". I can say for certain that stuff will get done during the summer, but I'm certainly hoping to get it done sooner if I can work up the motivation. If you have specific questions before then, feel free to ask on dribbble or twitter :)
about 1 year ago
Pro
Eli Schiff
@Ollin Yeah, totally I know the feeling. Yesterday I did a cleanup of my projects folder, and it turns out I have about 75 projects that I want to do, around 8 of them being high priority. Your little tutorial is one of the top 8!
Thank you for the offer and I might just take you up on it! I just followed you on the twitter.
about 1 year ago
Pro
Ollin
@Eli Schiff If they're icon projects I'm always looking for ideas ;)
about 1 year ago
Pro
Eli Schiff
Whelp, maybe we can work together on a project :) Let's stay in touch.
about 1 year ago