Tag Archives: Portfolio

Website Template Mockups

These are my 3 mockups for the design of my new personal portfolio. I have done a mock up of 3 of the sections that will be available:

Home page:

The home page of my new online portfolio design
The home page of my new online portfolio design

Blog page:

The blog section on my new portfolio website
The blog section on my new portfolio website

Portfolio page:

The portfolio section of the new layout. The portfolio images will be faded out and fade in when the user moves the mouse over them. If a user views that item specifically they are permanently full opacity.
The portfolio section of the new layout. The portfolio images will be faded out and fade in when the user moves the mouse over them. If a user views that item specifically they are permanently full opacity.

Narfstuff – Review

Website address: http://www.narfstuff.co.uk/

It isn’t immediately clear as to what Narfstuff actually is, there are lots of clues to indicate, but at a first glance, it gives the impression of being a personal website of some sort, due to the laid back, informal appearance to the graphics and site design.

The Narfstuff blog and portfolio is very relaxed and inviting
The Narfstuff blog and portfolio is very relaxed and inviting

Despite this initial uncertainty, it quite quickly becomes clearer when we look at the navigation items that this is a portfolio and blog site.

When we look at how customised Narfstuff is, it maintains a stereotypical blog layout with a main column for blog posts and a right hand column for the blog category and archive navigation. Despite this though, the blog has been quite well created in a unique way using a great deal of custom imagery to create the appearance of a clipboard on top of numerous other items on a literal desk. This makes it seem fairly personal, but the added touch of flowers to assist in the creation of a border between the clipboard and navigation shows us a little bit more of the creator’s personality. This personalisation makes the website memorable, though it does not incorporate any “fancy” functionality such as the scrolling effects of WeBleedDesign.

The content is reasonably professional, but has a more personal blog style of writing than a formal document. The website has not been updated regularly for some time, but it does appear that it is becoming more regular, and includes items that may be of use to the professional community such as free graphics packs. This assists in developing a more professional appearance, despite the informal writing style.

The website loads relatively quickly and functions on a number of different browsers without any hiccups, so it is quite accessible and the navigation is easy to use. The navigation with roll over effects also form the only interaction available with the website. One thing that can cause confusion though is that the portfolio section of the website changes in appearance quite dramatically to the rest of the website.

The changed design for the portfolio section on Narfstuff
The changed design for the portfolio section on Narfstuff

Not only does the design change, but all the functionality and navigaition items have become different as well. This is a bit off putting especially as there is no clear way to return to the other section of the website. The only similarity is the colours and the vines with flowers that are used to create borders.

Despite this lack of consistency though, a contact page is available in both sections of the website. However, no contact details are available, there is only an inquiry form. Similarly, there is no reference to any other social media, such as Twitter or LinkedIn which could be useful in developing further leads or clients.

KIB216 Top 10 Portfolio Requirements

As part of our tutorial today, we have determined our top 10 criteria for reviewing a portfolio website. As a class, we have established that the following 10 are very important in any portfolio:

  1. Clarity
  2. Customisation / Personalisation / Your Style – In other words, it doesn’t look like a generic blog.
  3. Networking / Rabbit Holes / Professional links – Such as LinkedIn, Twitter etc.
  4. Content – Professional and correct.
  5. Usability – Is the portfolio complicated or easy to use and find your way around? Does it load quickly?
  6. Interaction – What does the portfolio do when you interact with it?
  7. Memorable / Unique – Does it stand out and make you want to send it to other people?
  8. Accessibility – Does it work on multiple browsers and platforms?
  9. Updated / Maintained – Has it been updated recently?
  10. Contact information – Are the contact details readily available and easy to find?