Member Offer
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Folio/Website - Final touches?

Discussion in 'Graphic Design & Logo Design Critique:' started by Jamie Mitchell, May 3, 2013.

  1. Jamie Mitchell

    Jamie Mitchell Junior Member

    Hey all,

    I've been working on my site redesign for the last couple of months (I am not a huge fan of web design), and I think it's getting close.

    Please check it out if you have time, I've been looking at it too much to be objective anymore.
  2. I like how you've tried to do something different :)
    I'm not massively keen on the huge background image, mainly because the focal point of it is obscured by the web content, and so it doesn't feel like that was designed particularly well. I would also look at your text, it's all a bit too small for my liking and certain areas don't really stand out enough; such as the branding, print and misc buttons. They need to visually appear separated and like buttons that actually do something, at the moment it kind of just looks like it could be your brands tag line.
    Please left align the text on those portfolio pieces, it breaks the flow by having the details so far away from everything else, it makes my eyes feel a little lost. Why don't you try putting the information centrally? If my memory serves, you had two different colours for work and play? I quite like that idea, because you can also incorporate some more design elements to the page, which are associated with either work or play. Perhaps the styling around the content boxes could be more playful/serious on the corresponding page.
    I would consider adding a directory position to the pages, i.e. Work > Foodlem Amsterdam as it's a little confusing when you click on a piece of work and are taken to a page that looks identical, but have no way of getting back. Alternatively, just add a back button. It's a shame you couldn't get expandable content in there, that would work much better and isn't too hard to do. Also I would lose that left border on the portfolio pieces, it looks odd.
    You're missing out on a great opportunity with your current set up of social media links on the left. You need to get some icons in there! Make them yourself, it always looks good when you do it well :)
    I'm not sure what's going on when you hover over your logo but it looks horrible. For me it just goes grey and looks very jagged, a white highlight might be better, or perhaps blue.
    Other than that, it's looking good! ;)
  3. Jamie Mitchell

    Jamie Mitchell Junior Member

    Some fantastic feedback, thanks!

    Background image - I agree, I think I'll play around with some simple textured backgrounds.
    Navigation - Maybe just an i-bar between each word and a little bigger?
    Portfolio pieces - I'll play around with having the details underneath (as on the individual pages for each item), but I don't think I'd like it on the left.
    Work/Play - Perhaps I could kill 2 birds with one stone...have a nice plain(ish) background with some doodles in blue when on 'play' and the same drawing vectorised when in 'work'...what do you think?
    Directory - yes please! I have a fair few pages, is there an easy way to do it or do I just need to enter manually?
    Icons - YES. I completely forgot. I had it on my list of things to do...a month ago.
    Logo - There shouldn't be a rollover response from the logo so I shall take a look.
    Thanks so much, all good stuff

  4. No problem :)
    Just one other thing, not sure if this was changed or I just didn't notice it last night, you need to have something which clearly and quickly states what you do, that's high up enough in the text hierarchy that it's one of the first things that's read. As it is now, when I go to your index page I feel a little confused. I read Jamie Mitchell, WORK, PLAY and then available for anything and everything. The page doesn't really communicate concisely what it is that you do. I would change that last part to something that explains exactly what you do in as few words as possible. And I'm not too keen on that phrase anyway, it kind of makes you appear desperate, that you'll take on LITERALLY any work going!
    Also, it would appear that the blue, right aligned border signifies a link, but the "working hard, simple isn't easy" section isn't a link. Just a little bit of confusion there to tidy up.
    Navigation: i-bar? Are you talking about the Branding Misc and Print? I would just put them in their own boxes and just put a space of about 10px between each of them.
    Work/Play: Yes, great idea. If you want to stick with a dark theme, you could always go for a blackboard, instead of the overused paper textures. Then have the work and "chalk" effect illustrations. Just an idea :)
    Directory: I'd just do it manually. Unless you're working with a CMS already.
    Good luck with it :) Make sure to keep us up to date on its progress!
  5. Jamie Mitchell

    Jamie Mitchell Junior Member

    Plenty to think about. My copy-writing is generally pretty awful so I will be taking some advice in the next couple of weeks from a few wordy people I know.

    I'll try separating the buttons but I quite like how they're all on the same 'strip', you're completely right about clarity of navigation though, so it may be the only option. I hadn't considered the links as well as I should have.

    You've given me some solid ideas so I'll have a play in the next few days and update.

    One last question. Do you think it has the potential to work, or do you think I'm forcing it? I'm conscious of the fact that it's a little different, and I like that, but I don't want to confuse potential clients or distract them from the work.

    Thanks again!

  6. DavoSmith

    DavoSmith Member

    Really like your work pal, looks great. You have a real nack of combining clean typography with something a more hand written. Great stuff. And your typographic logo is top for me. Always loved the stuff that Stussy used to do, not sure if they are around anymore. They had a wicked hand written logo.
    I like the site too. I'd certainly agree with Sean on removing the left border on the portfolio elements, although I don't mind too much that the descriptive text for each piece of work is on the right. Adds a little more focus to the imagery and work.
    A little more subtlety with the background images might help, but it does add a nice personality.
    You should definitely design some hand drawn social media icons that would be consistent with your name branding, always adds a nice touch. They could be featured below your contatc details if you were to make the strip longer. Perhaps that strip could be fixed to the top and not scroll upwards disappearing when you scroll.
    Marching onwards with it though, good times.........
  7. Defiance

    Defiance New Member

    I like this, especially the large background image.
    I think the navigation works well, however the typeface used for 'WORK - PLAY' seems a little too harsh in comparison to your hand-drawn logotype. Maybe reduce the weight of the type, or move everything down a little (so that the top of the work/play buttons are in line with the blue divider underneath your logo).
    Personally, I would like to see some colour when you hover over the work.
    Maybe increase the size of the column containing the description for each project, it seems a little difficult to read. I think the left/right borders work well. If I'm going to pick on anything, it would have to be your choice of content font as I already mentioned above.
    Good job :)
  8. Jamie Mitchell

    Jamie Mitchell Junior Member

    Thanks for the comments guys, I was going to respond earlier but thought I might as well come back with here it is, new and improved (hopefully):
  9. Jamie Mitchell

    Jamie Mitchell Junior Member

    Oh and icons are on there way!
  10. DavoSmith

    DavoSmith Member

    Works GREAT with the strip fixed to the page like that. Good stuff man. Really not sure about the transparency on the work though, would be excellent to see them greyscale and then colour on hover I think personally.

    Looking forward to seeing what you come up with on the SM Icons!!
  11. DavoSmith

    DavoSmith Member

    One small extra comment. I'd align the sub heading info / text for WORK and PLAY to the left of the images in the scroll, they seem to float a touch with that alignment being set inside. Just refinement..
  12. Jonna Healey

    Jonna Healey Member

    That's a nice looking site.
    The only thing I would mention is to be careful of your responsiveness with the design. When I viewed the site using my smaller browser, I had to scroll to see the main content of your work (which I don't mind particularly, but it does put a lot of people off). Also, when you do scroll, the content seems to lay on top of the sticky navigation bar.
    But other than that (and the comments people have made above) it's a good site :)
  13. Jonna Healey

    Jonna Healey Member

    Just so you know what I mean here's a screenshot:

  14. Jamie Mitchell

    Jamie Mitchell Junior Member

    Hey Jonna. Thanks for the comments, I was aware of that problem and it's annoying me too. Do you have any idea how to fix it?! I'm clueless.

    Davo, I think the static sidebar has added the most of all the changes, so thanks for the suggestion. And well spotted on the page description alignment thing, I'll get that sorted.

    I think I'm happy with the transparency. The colour-rollover thing works really well on other sites but it's a pretty colour-heavy site so I like the co-ordination. Also it's really easy to do it this way in CSS without getting bogged down in flash. In fact the whole site is written in HTML (no flash, js, php etc) which for accessibility and SEO is a nice bonus.
    Thanks again for all the feedback, I will keep tweaking but I am really happy with where it is thanks to you guys.
    DavoSmith likes this.
  15. DavoSmith

    DavoSmith Member

    No sweat man, it looks great with the fixed sidebar.
    Hey, you shouldn't take on board everyones comments, ha, as it wouldn't be your site then. Thats what makes it unique. I really like it.
    Tell me, did you hand draw your logo??? I'd love to see a sort of WiP breakdown of it if you did of how the story unfolded.
  16. Jamie Mitchell

    Jamie Mitchell Junior Member

    Can't really take too much credit for the logo-face, I just adapted a free font called 'Hand of Sean'. I did it when I first started in freelance so perhaps it's time for a rethink/redo with my own handwriting.

    Usually I wouldn't take as much feedback as I have, but there was a gem of advice in most of the comments and I think they've worked well in the design.
    DavoSmith likes this.
  17. DavoSmith

    DavoSmith Member

    The logo works really well Jamie, I wouldn't change just yet it in all honesty, unless you felt it there were any elements of it you didn't like OR, you wished to add a splash of colour to it, like each i for instance? Who knows......
    You may benefit from having a peek at this that Gianluca posted in the Indentity section though:
    Jamie Mitchell likes this.
  18. Jamie Mitchell

    Jamie Mitchell Junior Member

    Truth be told typography scares me a little. I'm still learning so much every time I sit down to get some designs done, but typography seems like a crazy mountain to tackle.

    I'm planning on learning more about print processes too which is going to be a hell of a challenge.
  19. Looking better. Still getting that issue with the logo hover, I've narrowed it down to this line of code:

    Line 80
    a:hover{ color:#FFF; text-decoration: none; opacity:0.7; filter: alpha(opacity=70);}Just replace the filter with "color: #c1c1c1;"
    I don't think there's any reason to use the filter in that situation. Also, your content boxes in your portfolio need looking at too. It looks better but they need to be opaque and not translucent because the background image makes it hard to focus on them properly. You've also got two different hover effects, one for the border and one for the image itself, it feels a little odd. I'd stick to one hover effect, and possibly just put a blue tint when hovered, instead of it being translucent and then opaque on hover.
    The bottom of the J and the right of the last L are getting chopped off for me too:
    I think once you've sorted out the left panel as well, it's going to start looking really good :)
  20. Jamie Mitchell

    Jamie Mitchell Junior Member

    Hey Sean,

    Sorry I completely forgot to reply. Thanks for the heads up on the logo's opacity filter, that's all sorted.

    As for the portfolio elements and their opacity, I've bumped it up a bit (85% I think) which I a happy with. I agree with your point about the background but it's a compromise I'm willing to make.

    I think I've also fixed the logo (the J and L being cut off), how's it looking your end?

    Thanks again

Share This Page