Website re-design – Planning stage

So for whats probably about the third time now, I’m yet again in the process of redesigning my portfolio website. Now, part of this is due to an upcoming assessment date for portfolio’s, but the real reason is as a result of feedback I received from peers and tutors on my last design; the general consensus being that while the design in itself was good, it lacked continuity as soon as you navigated away from the main paige, since the style changed to a more contemporary header/wrapper layout, rather than the previous design which utilised the entire viewport with a large, touch-friendly navigation bar at the top.

Website Sketch

I decided the best way to tackle this would be to convert the site to a one-page format, with scrolling content. This meant that, in the true essence of what a portfolio is intended to be, the information is easily accessible by the user, and minimal interaction is required to view the content. Besides, with only two more pages on top of the index it doesn’t make logistical sense to have links navigating away from the index when the same information can be accessed with a quick scroll. It could be argued also that any potential employers looking at my portfolio would much prefer to be able to have a quick flick down the site and see the work I’ve chosen to showcase than to click links, back and forth, and look for the content. I recognised my own shortcomings, condoled my designer’s pride, and devised a plan for improvement.

Mock website design

The only real change planned here was the lack of a secondary navigation header as was the case in my previous design, as well as using a texture or photo for the background. The one used here was a render I made in CINEMA 4D using arrays and cloners – which I blurred in Photoshop to give the effect of the content being at the foreground, as well as for legibility of the content itself – a common procedure in digital design and on many artistic websites.

Other changes I plan to include will be the conversion of all hyperlinks to other files on the server (other pages) to anchor links, within the same page. However doing this will mean I need to use jQuery to produce smooth scrolling once the user clicks the link, down to the where the relevant anchor is placed. Not doing this not only could confuse the user when the viewport changes without changing page, but enabling smooth scrolling lets the user see where they are in the page, giving them a sense of direction and thus, informing them of content they may have scrolled past and as such, may want to look back upon afterwards. I plan to include arrows of a similar function that will return the user to the top of the page too, for general usability.

Other issues to consider would be usage prompts in general for users who may be alien to the idea of a one page website, as they are a relatively new concept with the exception of Facebook, Twitter, etc, as well as other features my old site was missing such as social media icons, any reference whatsoever to animations that I have worked on, as well as contact information. I plan to produce a short showreel, 30 seconds to a minute, to showcase animations I have worked on as they have often been smaller pieces intended to be part of a bigger project that I have collaborated on – so hence would not be as prominent on their own. In addition to this, users may not be inclined to watch each animation separately in the same way one would view each static image separately, as they take longer to view. A showreel might solve this problem by running through them in a brief, succinct manner.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s