I am coming to the end of building my Web Design Portfolio site and was wondering if anyone could give me some feedback on my site. Anything is welcome, obviously not unnecessary criticism but I always welcome constructive criticism. Are the colours right, layout, fonts ETC. Also one thing I need to know is does it take too long to load the page.
The first thing that hit me was "What do I look at first?", there is too much going on and the eye is not drawn to something first with a logical progression to other areas. Second observation "Where's the navigation?" It is not obvious that the links to your portfolio are down below the image. Navigation should be obvious. It didn't take long to load. Personally I didn't like the look or the usability, but then who am I to judge...
I agree with virtual, the layout is very confusing and i found when i first went to the site i was looking all over the page because everything just blends together, doesn't seem like anything has been picked out as more important then other parts.
Thank you both for your feedback. I was considering this as a problem but as I knew the site inside out it was difficult for me to judge if things looked more important. I have tried to address some of your criticisms.
I improved the portfolio navigation by applying arrows to show what state the button is in. I also rearranged the site layout to hopefully aid the read ability of the site and to show "a logical progression"
Any other comments about the revised version are very welcome.
I like the general look, but even seeing it for the first time after the revisions I spent a good 30 seconds figuring out what I was looking at and how I was supposed to interact with it.
Maybe this would be a good candidate for a 1 page jquery driven site.
Maybe have something like "About Tom" "Contact" and "Portfolio" as little office-esk sticky things on the right, and if you click on one, it takes the pieces of paper that represent the content off to the left and brings the new content back on the page (kind of like shuffling actual office papers?)
Looks really messy to me. No real order, no consistent design. Not a site that is really indicative of a web designer. I feel people would leave really fast as it looks amateurish.
Sorry if I come across harsh, but being a designer who hires developers I know what I would want to see.
Tom, I think your site could benefit greatly from moving content around and rescaling that content. I don't have a problem with the design elements of your site, though I think they could stand to be tweaked a bit too.
Fundamentally, I think the site is weak because I don't know what to look at. The importance we place on an item is driven by its location on the page, its boldness (colors, etc..) and its proximity to other elements. I'm probably misquoting some theory of element importance, but you get the idea.
What I would change: Your header needs some breathing room. I would add some padding and bring it down an inch or so. "stalk me" as well as your contact form are minimally important on the "order of importance list". Therefore, they should be placed somewhere else on the page, and made smaller.
After those changes are made I would address perhaps the most important element on the page, your portfolio. This isn't working for me at all. I'm not sure why, but I would try making that vertical a horizontal.
The America conference poster is very weak. I would exclude it from your portfolio unless you rework it. I would address the type and the background elements.. I suspect this isn't something you do often, or is an early piece?
Specific design elements. Though you're going for a hand-done desk aesthetic, it looks a little to artificial too me. I don't think there's great consistency amongst design elements. I would suggest going all out with the hand done aspect. Write on real sticky notes, try more handmade type, if that type isn't handmade. Also, that yellow in the header doesn't work at all. It's too faint. I would redesign that in some way.
I'll just give you my opinion in pros and cons, although at this point I'm probably repeating the obvious.
Pros:
-Creative design, unorthodox, unique if nothing else
-Good loading times despite being image-heavy
-Creative 'follow me' links (misplaced and oversized but creative none the less)
Cons:
-Colors are clashing (you have 2 sticky notes using different shades of yellow basically side by side, and another shade of yellow/orange in your name on the top left... match the colors up it'll help a lot)
-Main content is smaller than your contact form and 'about me'. (if you are promoting your work and hoping to get more, you should definitely make the focus of your site your portfolio, not your contact form / about me)
-Repetition (I'm not sure if this was part of your SEO strategy, but you basically said a lot of the exact same things in several different sections, even using the same words, which is a BIG no-no if you want to come across as a professional. Basically never use the same words twice if possible.)
EXAMPLE: I'm available for freelance work. I am currently available for freelance work. I am a UK based freelance web designer. I have been building websites since 2005 and freelancing for the last 3 years.
-Spelling / Grammar (on your contact form it reads, "...either fill out the on the left or via my contact details below.")
At this point I feel like I'm kicking you while you're down which is definitely NOT my intention. I hope that you take our opinions in a positive tone, because there is a great deal of potential in your ideas.
What I would do is similar to what brianallan said, resize your portfolio so it takes up about twice the size, downsize your contact form, 'stalk me' and about me (all 3 of those items could fit comfortably along the right side or even at the bottom of your page), use proper padding on your headers, streamline the colors, remove your weakest link ie: 'Politics Event Poster'...
You're very creative and not afraid to try something different, so I'm sure that as you continue to mature as a designer, you will eventually find your niche and leave the critics speechless!
Tom, I can tell you have an idea of the art direction which is at least a good sign. Brianallen and maximus hit on a lot of good points that I agree on, although I have some further *suggestions* to help you make a more cohesive design:
-Add suggested padding to top -Use the same yellow throughout or find a different color for portfolio section and smaller sticky note rather than the eggshell brown. -Consider horizontal portfolio section, or make the current one larger than your contact and about sections. -Per the previous suggestion, reduce size of the contact form, it's flippin huge so you're asking people to contact you before they even realize why. -If you use the same vertical bar for portfolio, hide any work initially or only show your best stuff, as its true the low quality of the American flag graphic really throws off the look. The gray bars are a bit awkward as well. -As noted the grammar is pretty redundant; all sentences start with "I"; revise to be more concise without repeated wording.
Your biggest problem, as has been noted by many, is the page heirarchy which is confusing and defies expectations (in a bad way). If you follow what has been said I think you'll be well on your way to a decent portfolio site.
@ mrking: If you're going to be "harsh" then at least leave some constructive feedback. Coming here and just telling someone their work is bad is a waste of time for both you and the other person, as it adds to the discussion in no way.
Thank you everyone for your help. I appreciate it a lot. This was my first time of really trying to design a portfolio site. With most of my the sites I have mainly been a developer.
With this site I was going with the "I want something a bit different" probably a bit too different as the case may be. Also to stay on one page but I can see unless that page is amazing it can be messy. This means lots of refining which isn't always bad, as now I can learn from this site also.
To be honest the site was slightly rushed as I am attempting to secure a work placement year for University. This site, I see now isn't really ready for employers to see yet.
I will keep developing this site and keep posting about it. If anyone wants to ever see my work again, some posts would suggest otherwise, keep a look out here.
Hopefully next time I post I will have something where MrKing likes wont be able to be harsh.
The layout probably isn't final its just showing some of the features I will use and their look.
The text in the about fields are still the same as the text from the previous design but these will be rewritten when I have time using the criticisms above as a guide. If you have anything to add to the above criticisms please do.
I am aware that the same text is on the ttTuts and Dmu Politics Society model windows. The ttTuts was recently added and I have yet to write anything for it.
I'm not sure what to do with the background. It cannot stay how it is atm there is far to much white space. Any constructive criticisms or ideas are welcome.
I think you seem to have something going with the notepad, scribble, scratchy look. This, if consistent could be nice, although it is a familiar look and not entirely innovative and representative of a up-to-date and versed designer.
My suggestion would be to look at all of your images that you have across the home page: The first top two of the header seem to work together, whereas thi furthest right of the header breaks consistency. I'm guessing you hand-drew the first two and appropriated the third.
For me the font you have chosen could be better thought out. Because of the fact that you have a hand-drawn header, and then have chosen something that is not hand drawn but pretends to be, then, on top of that you have the Arial or Myriad throughout the page, it created a very lumpy harmony. I suggest you choose a maximum of two and keep them consistent throughout the entire site.
Last, I think the the bars of the sliding menu that are a greyish fade need to absolutely be changed. They don't really have anything to do with 'organic design your going for, and above that they remind one of the old dreamweaver sprys. I'm quite sure its a repeating jpeg that you could easily alter in color and style using photoshop. You might think of a color thats consistent with the rest of the site (and font as well, like I said before).
Hope that helps, I think if you find some consistency, it'll start shaping up to your surprise.
Although the original was a bit messy i do like the idea you had in place, but that could have been all apart of it. the page looks to be designed as if it was a cork board above your desk. I don't know about anyone else, but there isn't much organization to any cork boards i've run across. also i don't see the need for adding a title to the tape :P
I love the form! There should be more text. Also, think whom you would like to target, and shape your business like that. If you do it right, you will attract the people you want to target. We can not target the whole world. Cheers!
PS: I love website's portfolio that are valid xhtml. To me that is very important. You have a valid website. Good for you.
If you are mainly a developer, then maybe that is where your skill set lies. Left brain, right brain, or middle of the road we all have our own strengths and weaknesses. You should have a fair idea by now where your strengths are. I would suggest that you develop those as they come easier to you and to perhaps promote any design capabilities by taking a few courses.
I remember when I was a kid trying to understand why everyone told me not to wear orange pants with a violet T-shirt. When they are just big chunks of colour like that, they do not go together, but mix them in with some other tones and smaller elements and they become complementary.
I am coming to the end of building my Web Design Portfolio site and was wondering if anyone could give me some feedback on my site. Anything is welcome, obviously not unnecessary criticism but I always welcome constructive criticism. Are the colours right, layout, fonts ETC. Also one thing I need to know is does it take too long to load the page.
http://dot-tom.co.uk/index.html
Thanks for your help in advance.
Tom
Second observation "Where's the navigation?" It is not obvious that the links to your portfolio are down below the image. Navigation should be obvious.
It didn't take long to load.
Personally I didn't like the look or the usability, but then who am I to judge...
I improved the portfolio navigation by applying arrows to show what state the button is in. I also rearranged the site layout to hopefully aid the read ability of the site and to show "a logical progression"
Any other comments about the revised version are very welcome.
Many thanks
Maybe this would be a good candidate for a 1 page jquery driven site.
Maybe have something like "About Tom" "Contact" and "Portfolio" as little office-esk sticky things on the right, and if you click on one, it takes the pieces of paper that represent the content off to the left and brings the new content back on the page (kind of like shuffling actual office papers?)
Sorry if I come across harsh, but being a designer who hires developers I know what I would want to see.
Fundamentally, I think the site is weak because I don't know what to look at. The importance we place on an item is driven by its location on the page, its boldness (colors, etc..) and its proximity to other elements. I'm probably misquoting some theory of element importance, but you get the idea.
What I would change:
Your header needs some breathing room. I would add some padding and bring it down an inch or so.
"stalk me" as well as your contact form are minimally important on the "order of importance list". Therefore, they should be placed somewhere else on the page, and made smaller.
After those changes are made I would address perhaps the most important element on the page, your portfolio. This isn't working for me at all. I'm not sure why, but I would try making that vertical a horizontal.
The America conference poster is very weak. I would exclude it from your portfolio unless you rework it. I would address the type and the background elements.. I suspect this isn't something you do often, or is an early piece?
Specific design elements. Though you're going for a hand-done desk aesthetic, it looks a little to artificial too me. I don't think there's great consistency amongst design elements. I would suggest going all out with the hand done aspect. Write on real sticky notes, try more handmade type, if that type isn't handmade. Also, that yellow in the header doesn't work at all. It's too faint. I would redesign that in some way.
Pros:
-Creative design, unorthodox, unique if nothing else
-Good loading times despite being image-heavy
-Creative 'follow me' links (misplaced and oversized but creative none the less)
Cons:
-Colors are clashing
(you have 2 sticky notes using different shades of yellow basically side by side, and another shade of yellow/orange in your name on the top left... match the colors up it'll help a lot)
-Main content is smaller than your contact form and 'about me'.
(if you are promoting your work and hoping to get more, you should definitely make the focus of your site your portfolio, not your contact form / about me)
-Repetition
(I'm not sure if this was part of your SEO strategy, but you basically said a lot of the exact same things in several different sections, even using the same words, which is a BIG no-no if you want to come across as a professional. Basically never use the same words twice if possible.)
EXAMPLE: I'm available for freelance work. I am currently available for freelance work. I am a UK based freelance web designer. I have been building websites since 2005 and freelancing for the last 3 years.
-Spelling / Grammar
(on your contact form it reads, "...either fill out the on the left or via my contact details below.")
At this point I feel like I'm kicking you while you're down which is definitely NOT my intention. I hope that you take our opinions in a positive tone, because there is a great deal of potential in your ideas.
What I would do is similar to what brianallan said, resize your portfolio so it takes up about twice the size, downsize your contact form, 'stalk me' and about me (all 3 of those items could fit comfortably along the right side or even at the bottom of your page), use proper padding on your headers, streamline the colors, remove your weakest link ie: 'Politics Event Poster'...
You're very creative and not afraid to try something different, so I'm sure that as you continue to mature as a designer, you will eventually find your niche and leave the critics speechless!
Good luck!
-Add suggested padding to top
-Use the same yellow throughout or find a different color for portfolio section and smaller sticky note rather than the eggshell brown.
-Consider horizontal portfolio section, or make the current one larger than your contact and about sections.
-Per the previous suggestion, reduce size of the contact form, it's flippin huge so you're asking people to contact you before they even realize why.
-If you use the same vertical bar for portfolio, hide any work initially or only show your best stuff, as its true the low quality of the American flag graphic really throws off the look. The gray bars are a bit awkward as well.
-As noted the grammar is pretty redundant; all sentences start with "I"; revise to be more concise without repeated wording.
Your biggest problem, as has been noted by many, is the page heirarchy which is confusing and defies expectations (in a bad way). If you follow what has been said I think you'll be well on your way to a decent portfolio site.
@ mrking: If you're going to be "harsh" then at least leave some constructive feedback. Coming here and just telling someone their work is bad is a waste of time for both you and the other person, as it adds to the discussion in no way.
With this site I was going with the "I want something a bit different" probably a bit too different as the case may be. Also to stay on one page but I can see unless that page is amazing it can be messy. This means lots of refining which isn't always bad, as now I can learn from this site also.
To be honest the site was slightly rushed as I am attempting to secure a work placement year for University. This site, I see now isn't really ready for employers to see yet.
I will keep developing this site and keep posting about it. If anyone wants to ever see my work again, some posts would suggest otherwise, keep a look out here.
Hopefully next time I post I will have something where MrKing likes wont be able to be harsh.
Thanks Again Tom
I have been working on a preliminary design for my portfolio redesign.
Here's the link http://www.flow23.co.uk/dot-tom_redesign/redesign.html.
The layout probably isn't final its just showing some of the features I will use and their look.
The text in the about fields are still the same as the text from the previous design but these will be rewritten when I have time using the criticisms above as a guide. If you have anything to add to the above criticisms please do.
I am aware that the same text is on the ttTuts and Dmu Politics Society model windows. The ttTuts was recently added and I have yet to write anything for it.
I'm not sure what to do with the background. It cannot stay how it is atm there is far to much white space. Any constructive criticisms or ideas are welcome.
Many Thanks Tom
I think you seem to have something going with the notepad, scribble, scratchy look. This, if consistent could be nice, although it is a familiar look and not entirely innovative and representative of a up-to-date and versed designer.
My suggestion would be to look at all of your images that you have across the home page:
The first top two of the header seem to work together, whereas thi furthest right of the header breaks consistency. I'm guessing you hand-drew the first two and appropriated the third.
For me the font you have chosen could be better thought out. Because of the fact that you have a hand-drawn header, and then have chosen something that is not hand drawn but pretends to be, then, on top of that you have the Arial or Myriad throughout the page, it created a very lumpy harmony. I suggest you choose a maximum of two and keep them consistent throughout the entire site.
Last, I think the the bars of the sliding menu that are a greyish fade need to absolutely be changed. They don't really have anything to do with 'organic design your going for, and above that they remind one of the old dreamweaver sprys. I'm quite sure its a repeating jpeg that you could easily alter in color and style using photoshop. You might think of a color thats consistent with the rest of the site (and font as well, like I said before).
Hope that helps, I think if you find some consistency, it'll start shaping up to your surprise.
GOOD LUCK!
n
Although the original was a bit messy i do like the idea you had in place, but that could have been all apart of it. the page looks to be designed as if it was a cork board above your desk. I don't know about anyone else, but there isn't much organization to any cork boards i've run across. also i don't see the need for adding a title to the tape :P
PS: I love website's portfolio that are valid xhtml. To me that is very important. You have a valid website. Good for you.
I remember when I was a kid trying to understand why everyone told me not to wear orange pants with a violet T-shirt. When they are just big chunks of colour like that, they do not go together, but mix them in with some other tones and smaller elements and they become complementary.
Thanks Tom