I'm working on a very tricky client project [iOS] at the moment and decided I needed to get some practice with the basics of iOS icon design. I've never really done it before so these are some of my first attempts.
Check out the fullview, I tried to make sure things looked beautiful at the full resolution :3
Critique and stuff from all of you iOS pros out there would be awesome, I'm new to this but don't hesitate to tear these apart.
Oh and here's a download for iPhone, let me know if you want any other sizes
over 1 year ago
The contacts icon is a bit plain, you could use some stronger gradient, apart from that these are nice :3
Use some lighter colors on the contacts icon to match the other icons, like the mail icon, and I'd also suggest making the A B C D a little larger. The stitches is a very nice detail.
Just swell. I think the blue bases are just great on the black background, but on a lighter background the white at the top looks a bit odd. Here's an example: http://cl.ly/image/3y2V3k3G3n1r
When making a gloss icon, use a white to transparent gradient with no blending modes. It seems like linear dodge (no idea what that is in gimp), makes it really harsh to the eyes on lighter backgrounds, as Eli stated. The contacts is a little dark for me, and needs a larger texture so it can be seen on the retina display. Hope this helps :)
They look nice, but the blue shadow in the envelope and the compass seem a little bit strong. I think they should have less opacity or / and size.
If you take a look at the original mail icon, it feels more flat, with almost none to no distance in the envelope shadow
@Ollin lovely work Ollin, great stuff!
The safari one looks great!
Ow @Ollin this is crazy man !!! Great job you rock them hard
Agreed with @Rok Benedik , Safari one looks great.
Whoa guys, thanks for all of the critique so far! I really appreciate it.
@Jakub Krehel Plain? The colors are less saturated than the other icons, and there is no gloss or shiny in it :/ I wasn't quite sure how to work around that. Agreed about the stronger gradient.
@Vincent Good catch on the colors, I think you're absolutely right. I tried the letters larger but they seemed distracting, so I shrunk them.
@Eli Schiff @Morgan Carmont I disagree. Certainly, the icon looks a little "off" on a light background. So does Apple's, I think. That's because they were specifically designed for a dark background. Why? Because 100% of the time iOS icons are on a background [Homescreen, App Store], they've got a software-applied drop shadow, which darkens the area around the icon so that it contrasts with the white edges.
I agree about contacts being too dark. I'll test the icon out on retina and see how the texture looks, you're probably right.
@Edokoa This is also the case with the shadows on Youtube and Contacts. I tried them out on the device, and preferred the stronger, more depth-giving shadow in each case. To me it made the icons feel much more clickable, much more real. I suppose that is probably a matter of personal preference?
@Winston Wolfe Yup. Always have. I'm slowly learning PS [in case I ever need to use it] but I don't intend to switch from GIMP any time soon :)
Thanks for all of the feedback, you guys rock
I love so much the fourth icon.
Sharp and glossy! nice :)
You make always awesome works.
The leather texture on the address book is little bit too strong, I think.
All of these are a little too intense. The colors are too contrasting or vibrant. You could tone down shadows, highlights, and the gloss a bit.
I think the gloss is a bit too much on all the icons, not the top part being white, but the lower part not fading off and blending into the background and as Mantia notes, a bit too vibrant. Also as Vincent notes, A,B,C and D should be bigger and about the stitch, though a nice touch, I am afraid if it would show up as some pixel alignment imperfection in lower resolutions. But otherwise, the colors are really nice.
Youtube: The outer circles are to big in comparation with the metal circles. Try doing the metal circles bigger.
Mail and Safari: The gloss is too white, try reducing the opacity or the fill.
Contacts: Is my favourite icon so far, try a gradient for the base, because this is looking to plain for me, and increase the font 2 or 3 pixels..
iOS gloss is always the topmost layer
@Andrey Grabarchuk Not always. Check the original mail or safari icons if you don't believe me :)
The noise in the drop shadow for the envelope is awesome. I like the vibrancy, it keeps it from feeling too Apple.
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2014 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.