Feedback on my portfolio

Calneon

Calneon

Calneon

Associate
Joined
17 Nov 2008
Posts
1,680
Still work in progress, and I'm not very experienced at all at web design or development. The photography page looks empty because I haven't had the chance to take many pictures (got the camera for Christmas), and I haven't written any personal information yet. Other pages haven't been done yet, focused mainly on the homepage.

Had a few goes at designing a portfolio before, but I never end up liking the design so I go back to the drawing board, but I can't do that this time because I really need it up and running. Main criticisms are that it's too small, but I can't think of how I'd make it bigger, I don't really have any content to fill the space if I made it bigger, though any ideas are welcome. I personally like small minimalist sites anyway.

Also looking for advice on gallery scripts, I'm quite happy with the one I have but something like this works really well but obviously it's not free. Criticisms on coding welcome too, did some work with CSS and HTML a few years ago so was learning as I went really, working in canvas was also new (though the actual game logic was easy). Seems to work fine in Chrome, Firefox, and IE9, canvas obviously doesn't work in previous IE versions.

The pong animation takes user input when the mouse is over the canvas, otherwise ai takes over, the little button at the top stops the animation.

http://www.sambigos.co.uk/secrettestingarea/index.html

Thanks for any advice you have.
 
Last edited:
 
 
No problem mate.

I'm actually looking forward to creating this one. There are a lot of neat and creative things you can get away with doing on a portfolio site, which just wouldn't be practical on a normal site.
 
bug?

21do20n.png


Safari 5.0.3
OS X Leopard 10.5.8
 
Last edited:
136 views and no feedback on the actual design or coding? I guess that means people like it? Come on guys, even a few words just post if you like or don't like it :). I caved in to criticism and made it a bit wider.
 
bug:

1293927995sam123.png


google chrome
the problem exists if the download bar isn't there, but its much worse when the download bar IS there

also, from a HCI perspective, your navigation sucks - small icons don't read well at all
 
Last edited:
rickh said:
bug:

1293927995sam123.png


google chrome
the problem exists if the download bar isn't there, but its much worse when the download bar IS there

also, from a HCI perspective, your navigation sucks - small icons don't read well at all
Click to expand...
Strange, I don't get that in any browser, goes all the way to the bottom. And your comment about navigation, I see what you mean but those icons aren't navigation, they're just links to my steam profile, flickr, mail, and cv. They're at the top of the page and the icon is pretty clear, so I don't see that as a flaw. The actual navigation is the large images below.
 
That'll be because you're browser window has enough height in it to allow the background image to scale correctly at initial paint.

Resize your browser window to about 400px height (half of the website) and then scroll down to the bottom - you should see it then.

Tooltips would be a good solution to the icons.
 
rickh said:
That'll be because you're browser window has enough height in it to allow the background image to scale correctly at initial paint.

Resize your browser window to about 400px height (half of the website) and then scroll down to the bottom - you should see it then.

Tooltips would be a good solution to the icons.
Click to expand...
Ok I see it, and I think I know what's causing it, thanks :D. The icons do have tooltips, just hover your mouse over them for a second.
 
personally, I think the following could do with some improvement:

1) Wider content - the page looks too thin to me, I understand around 960px wide is the norm, yours looks more like ~500px? on my 1920*1200 screen it's not so good :(

2) Overusage of that pixel font - especially on the headings.

3) I don't get where the pong game fits in? It's not like you can even play it (which would be cool)

4) The image browser on your photography section is a bit annoying, it forces you to view everything full size, instead of allowing you to click on thumbnails to get full size images of the ones you want to see. Also looks out of place on the site imho

5) Your heading says sambigos.com, but clearly we're on sambigos.co.uk

6) The text is speaking in like 3rd party, are you the writer or is someone else writing your content? if you're the writer you should be writing in 1st person.

For example instead of saying: "Sam is an undergraduate studying Computer Games Technology at Portsmouth University" - you should say "My name is Sam, I am an undergraduate studying Computer Games Technology at Portsmouth University" etc etc,.

7) Not a big fan of the colour scheme, but i've never been great with colour schemes so i've not really got any suggestions on this one, but sometimes you see a website and think "that looks cool" or "that has a good colour scheme". I don't get the same impression on yours.

Anyway I know that's a lot of things, you don't have to listen to anything i've said if you don't want to :p
 
Eulogy said:
personally, I think the following could do with some improvement:

1) Wider content - the page looks too thin to me, I understand around 960px wide is the norm, yours looks more like ~500px? on my 1920*1200 screen it's not so good :(

2) Overusage of that pixel font - especially on the headings.

3) I don't get where the pong game fits in? It's not like you can even play it (which would be cool)

4) The image browser on your photography section is a bit annoying, it forces you to view everything full size, instead of allowing you to click on thumbnails to get full size images of the ones you want to see. Also looks out of place on the site imho

5) Your heading says sambigos.com, but clearly we're on sambigos.co.uk

6) The text is speaking in like 3rd party, are you the writer or is someone else writing your content? if you're the writer you should be writing in 1st person.

For example instead of saying: "Sam is an undergraduate studying Computer Games Technology at Portsmouth University" - you should say "My name is Sam, I am an undergraduate studying Computer Games Technology at Portsmouth University" etc etc,.

7) Not a big fan of the colour scheme, but i've never been great with colour schemes so i've not really got any suggestions on this one, but sometimes you see a website and think "that looks cool" or "that has a good colour scheme". I don't get the same impression on yours.

Anyway I know that's a lot of things, you don't have to listen to anything i've said if you don't want to :p
Click to expand...

Thanks for taking the time to reply, really appreciated :).

1) I must be in the minority by liking small minimalist sites. Yeah it's 500px wide, it was 350 before I changed it. It's a portfolio site not a blog or e-commerce site, it doesn't need to be big. In fact, if it was much bigger I wouldn't have anything to put in it.

2) I think it looks fine for headings, and the only other thing that uses it is the logo at the top.

3) Because I'm studying game development, and it adds something of interest to the portfolio. And you can play it in every browser other than Firefox, which seems to have some trouble with canvas I'll have to try and fix. Just put your mouse over the canvas and move it up and down.

4) True, adding thumbnails underneath might be a good idea.

5) I have both, .com points to the .co.uk domain. I should probably switch that around.

6) Good point, I was reading a lot of other portfolios and a lot seem to talk in 3rd person, so I just did a draft in 3rd person. It's by no means final.

7) Yeah I know what you mean, some sites just seem to work. However, I don't dislike the scheme I have, and I'm definitely not a designer.

Thanks again for the in depth analysis, hope more people can do the same so I can get a general idea of what people think. :)
 
Less in this case doesn't equal more in my opinion. I am on a 1650x1080 resolution and the screen usage is not brilliant, the majority of the web-page, all I am seeing is whitespace and as bigger screen resolutions are now much more popular smaller websites generally don't cut it as most people run with maximized windows on their web browsers.

Pixel fonts (to me) on a website don't work well, in a typographical sense they seem to be very zoomed in and not incredibly legible especially too people who may have visionary issues.

I like the Pong header, however there seems to be limited usage for it, as the bar moves itself when it wants to, on Opera that is anyway.

Unfortunately I only really have Opera (latest edition) to hand to test the site, however I notice at the bottom you state IE9 and I wonder whether or not it works in IE6 and IE7 which are statistically still two of the most popular web browsers used, so if the website doesn't work in these browsers you risk alienating any prospective clients if they visit a broken website.
 
Hi Calneon,

Im working on a portfolio just now so im in a similar position to yourself. To me your site is lacking that unidentifiable "something".

I think that your content being narrow is fine, but you could do something with your background to add a bit more interest even if it is simple/subtle.

Ditch the 3rd person, im not a fan of that at all.

Finaly, you say that the canvas element is not working with firefox. Now I may be wrong but your document type is xHTML 1.0 transitional. Surely it should be HTML so firefox/browsers know how to render/handle this HTML 5 property?

The bug mentioned above also happens in firefox when its resized, looks like one of the divs is set to 100% of the viewport and so the footer moves up covering some of the content.

Ultimately I like it though, I think the font you have enbedded works well seeing as you are studying game development.
 
Last edited:
Throrik said:
Less in this case doesn't equal more in my opinion. I am on a 1650x1080 resolution and the screen usage is not brilliant, the majority of the web-page, all I am seeing is whitespace and as bigger screen resolutions are now much more popular smaller websites generally don't cut it as most people run with maximized windows on their web browsers.

Pixel fonts (to me) on a website don't work well, in a typographical sense they seem to be very zoomed in and not incredibly legible especially too people who may have visionary issues.

I like the Pong header, however there seems to be limited usage for it, as the bar moves itself when it wants to, on Opera that is anyway.

Unfortunately I only really have Opera (latest edition) to hand to test the site, however I notice at the bottom you state IE9 and I wonder whether or not it works in IE6 and IE7 which are statistically still two of the most popular web browsers used, so if the website doesn't work in these browsers you risk alienating any prospective clients if they visit a broken website.
Click to expand...
Thanks for your opinions! You say the site has too much white space, which is true. Do you have any ideas about what to fill it with though? Some sort of background image is all I can think of.

I think the pixel font works well because it goes with the theme of game developer.

When I tested the site on Opera, user input was working. If you move your cursor over the area the paddle will follow it, if you stop moving then it will start moving automatically after a short delay.

I need to find out how to download previous versions of IE to test them. I say it runs best on IE9 and not the others because of canvas support, the rest of the site should work fine (except maybe IE6, which I'm not too bothered about).

Garee said:
I hate the 3rd person context of the writing.
Click to expand...
Will definitely rewrite that, thanks.

pieplough said:
Hi Calneon,

Im working on a portfolio just now so im in a similar position to yourself. To me your site is lacking that unidentifiable "something".

I think that your content being narrow is fine, but you could do something with your background to add a bit more interest even if it is simple/subtle.

Ditch the 3rd person, im not a fan of that at all.

Finaly, you say that the canvas element is not working with firefox. Now I may be wrong but your document type is xHTML 1.0 transitional. Surely it should be HTML so firefox/browsers know how to render/handle this HTML 5 property?

The bug mentioned above also happens in firefox when its resized, looks like one of the divs is set to 100% of the viewport and so the footer moves up covering some of the content.

Ultimately I like it though, I think the font you have enbedded works well seeing as you are studying game development.
Click to expand...
Hi pieplough, thanks for the reply, really appreciated. You mention that the site doesn't have an unidentifiable 'something', could you link me to a few sites that you think do have this?

About the doctype, thanks for pointing that out, I will change that. Not really knowledgeable in that area (I used Dreamweaver before and that did it for you).

The bug I think is because the footer is below the background div, and positioned at the bottom of the screen, it's blocking the background div from going to the bottom when you have a smaller resolution.

Thanks for all the replies everyone keep them coming!
 
Calneon said:
Hi pieplough, thanks for the reply, really appreciated. You mention that the site doesn't have an unidentifiable 'something', could you link me to a few sites that you think do have this?

About the doctype, thanks for pointing that out, I will change that. Not really knowledgeable in that area (I used Dreamweaver before and that did it for you).

The bug I think is because the footer is below the background div, and positioned at the bottom of the screen, it's blocking the background div from going to the bottom when you have a smaller resolution.

Thanks for all the replies everyone keep them coming!
Click to expand...

Here is a nice bit of code for keeping a footer in place, link

I suppose it comes down to personal preference but ill link you some portfolios that I have found recently.

http://www.webeffectual.com/
http://www.gagesalzano.com/~gagesalz/
http://www.markhobbs.net/

Heres another, its narrow and simple.

http://designingmonsters.com/
 
Last edited:
You could do a lot worse Sam. Your code is tidy, your design has good alignment and repetition. Your design is small because you don't have much content - that's perfectly fine. I would change the white background, see this for inspiration http://twd.trenchwars.org.

You could improve now by thinking about tasks. If I'm your visitor - what am I visiting your site for, what do I want to do?

This is what I did:

- land at site
- hover over icon at the top to see what it was
- found out it said toggle animation
- clicked it anyway
- animation stopped
- clicked it again
- animation didnt restart
- hovered over the other icons because I couldnt tell what they were
- didn't want to click them
- couldn't be bothered to read the small text
- rollovers are nice
- didn't want to read your blog
- didn't want to see development
- clicked photography
- really like the photo scrolling thing, would be better if the header was shallower
- dont know how to get to other pages or home page from here
- closed browser

I've also just noticed your CV is a word document. You should either:
1. Markup as HTML page
2. Use PDF and make it clear it's a download, with an indiciation of size, and link to PDF reader
 
Last edited:
You must log in or register to reply here.
Back
Top Bottom