New project for Extensis the long standing font management guys. They are creating mobile app's of their FontFuse and WebINK web services so have hired me to design the app icons.
The first one is for FontFuse which is a site mostly aimed at helping designers match and combine font pairings. There are existing logos for FontFuse and WebINK so I am tasked with creating something based on this existing identity.
After looking at the Android Specifications for icons I realised that I now much prefer their perspective on app design than Apple's. Never been a fan of gloss and big f**k-off corners so the Android sensibility of subtle, flat and tactile looking icons scores highly for me.
So given the desire to avoid gloss and shine I have decided to focus the overall look and feel of the iOS icons based on the official Android icon design specification—now tempted to get an Android.
This is the first idea presented to Extensis for FontFuse and I have tried to find a balance between subtle texture (found via Google after a lengthy search for something half decent that wasn't metal or wood) and visual connections to what FontFuse is about. The direction has taken me down the path of a form of tactile case/wallet/folder/sleeve made of nubuck/suede that holds seperate sheets of font pairing examples.
The orange wiggle, electronic symbol for a fuse, is a refinement of the existing wiggle that I took upon myself to improve to use as a identifying mark. It's also more like a tilde now so that is a closer link to typography than the fuse. I have also created the sleeve opening from this wiggle and using orange to highlight the interior but to also set off the white card sheets.
As Android allows for inconsistent edges it is possible that this version will have the card slips poking out of the top as well as sharper corners.
over 2 years ago
My God that looks good. It looks like suede
Outstanding work, Mr Smith. That texture is lovely.
reading your thoughts and comment on this shot, is like following your mind, from the first idea till you came up with this.
also how much thoughts and problems you have solved during this progress.
you are not only an inspiration when it comes to design, you help others, especially me, to understand the process and i really feel like i am a student and listening to my tutors.
(huge compliment mr.g!)
I tried to decipher the visual meanings before I read your description. The orange squiggle made me think this was the back pocket in a pair of jeans because of the placement and the stitching; The brand mark is often sewn into the corner of the pocket like that. I figured the squiggle represented the tilde key, so this app might have something to do with being able to carry a bunch of fonts in your back pocket with digital applications.
What i love about reading your descriptions is that I find myself working through the design decisions I would have made if I was in your shoes. I'm not sure I would have tried to imitate the squiggle as the upper part of the pocket just because it would have been really hard to pull off. I also don't think it would have occurred to me to modify it to make it work. But look at that, you did and it works. Nice stuff.
This is like a breath of fresh air from all the high-gloss stuff, great job!
You know, I think I prefer your written rationales over your designs. Which is saying something, because your designs are always impressive. I love reading your process and how every mark has been considered, measured, and executed.
The size differences throw it off for me. My mind thinks the pages should be bigger than the pouch in comparison but they're not. I don't know if that makes sense but it seems like you've taken a shrink ray to the pages and stuck them in a tiny pouch http://youtu.be/1wFAamg1NfA?hd=1
Very nice Graham! There are two things I would change:
1. The curve of the pocket is the opposit of the logo, maybe flip it around?
2. The visible part of the cards is rather small, especially when viewed on a mobile instead of desktop. Perhaps enlarging the open (orange) part so that more of the cards is visible?
oVan/Trevor: Both spot-on with that do need to enlarge the cards some what so working on that today. Just needed to get initial idea approval before spending time working out the details. :)
Brad/Dean: Happy that my descriptions are mostly useful, and thank you for the super kind words on that. :)
by Graham Smith
Previous dribbble has background on this project.
A few tweaks based on some comments received in that last dribbble. Notably have enlarged the font pairing cards/sheets so as to fill the wallet/case more generously. As well as covering a portion of the grey casing. Have also vertically enlarged the top portion of the pocket space slightly.
Experimenting with a texture for the orange inside as well as some subtle shadows etc. Certainly don't want to fall foul of overdone effects so not sure yet on this internal texture.
Reversed flipped the wavy cut squiggle to match the bottom right squiggle mark.
over 2 years ago
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–2013 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.
Follow Dribbble on Twitter