Greg Carrick – HND Interactive Media

Charlie Gentle – www.charliegentle.co.uk – is a web developer currently working for Chemistry Digital in Nottingham. But also does some small freelance projects on the side.

On first viewing the website, it looks very welcoming and has a simple lay out. The first thing your eyes are attracted to is the content in the centre of the screen, as there is a lighting effect around it, which gives the impression of a spotlight shining towards the centre of the page. Your eyes are then drawn up towards the top of the page where there is a multi coloured circle pattern, like those that appear in photography when spots of light are out of focus.

The header is a simple thin transparent rectangle that is above the multi coloured circle pattern and stretches across the whole width of the page. In the header; the developers name is to the left and there are three links to the right. At first the links don’t appear to be links as they are in very large type, just link the developer’s name. When you hover over a link everything else in the header, including the developer’s name becomes blurred. This is presumably to act as the highlight, but as the link is white and stays white when hovered over, it does not make it obvious as a link, because at first you don’t notice everything else blur in the header. I’m not sure the blurring of other elements in the header is a good idea, but then changing the links colour probably would not suit the websites colour scheme either.

The main element on the home page is the large outline image of a camera, video camera and laptop, which is next to some large text saying “Digital Portfolio” that lets the visitor know what the website is about. Under this is the main content of the home page, that consists of a little introduction about the developer and a latest news section, which is kept up to date regularly, as the latest news date is from the day I visited the website.  To either side of the content are two arrows which can be used to scroll between the different pages of the website. When you click on the right arrow the centre section of the page scrolls to the next page, this adds a very nice affect to the website and even the multi coloured circle pattern at the top of the page scrolls in the same direction. The only problem with the arrows for the scroll is that there is still an arrow showing on the last page, which means it does not do anything when clicked; it is also the same case on the home page as you are unable to use the left arrow. It might be better if there was not an arrow when there is no page in that direction.

The next page on the scroll is the developer’s web work. This page consists of a little description about the developer, an outline image of a laptop and thumb nail images of recent projects. When you click on a thumb nail, a light box style feature appears that has been customised to suit the websites design. On this feature there is an image of a page of the website and a description of what he had to do for the project. There is also a link to the website and if you click on the image it also links you to the website. The only down side with the custom light box feature is there is no close button, so you have to click on the faded background to close it. Also there is no link between each full project description, so you have to close each box and then click on the next thumb nail to view the next project.

The next page is laid out the same as the web work page, but this one contains photography work he has done and an outline of a camera. There are thumb nail images that open up in the custom light box, but this time you are able to link directly between each image, instead of having to close and reopen images.

The final page on the scroll is the contact page. This contains a contact form and links to other things he’s involved in, such as, Twitter, You Tube and Flickr. Next to the contact form is an outline image of an old style post box, which goes well with the other outline image on the website.

Overall, the website is well laid out and appealing to look at. There is room to add a few more projects to the website, but he’s limited to only been able to show 12 of his recent projects, with the current lay out. Showing 12 recent projects is quite adequate to demonstrate his ability, but it’s always nice to show quite a lot of work and have the ability to expand easily in the future.

Jarred Badillo – www.jarredbadillo.com is an America website designer and is currently in his first year of employment after leaving University last year. He is working freelance at the moment and is in a similar position to what I will be within the in the next several months, trying to find work to build up a portfolio.

On first viewing of Jarred’s portfolio website, the layout looks clean and simple to understand. There’s a wide narrow header, with three columns underneath, containing the navigation, a blurb and some featured work. Under that is a set of extra navigation, imaged links to his social networks and bookmarks and a nice clean footer.  There is ample space between everything, so it’s easy to distinguish among different page features and nothing seems squished together.

The website has a white background and uses mainly grey text with black text been used in the header for his name and the titles of work he has completed.  This colour combination is simple and gives a good colour contrast for easy readability, but he could maybe have used a slightly larger font size to make it even easier to read.

The header on the website is very simple and works quite well, to the left is the designers branding identity and what he does (website designer). The centre of the header says “/Index” and at first it seems to be there for design purposes, but when browsing the website it changes to the title of the page you are on, so acts as the page name. To the right of the header is a link to the sitemap, it’s aligned to the top right hand corner of the header and could seem out of place but I think it’s their so it’s viewable when you first visit the website and is not included in the main navigation.

One part of the header I’m not sure about is the width, as it’s wider than the content underneath, so the alignment between the header and the main page seem a bit odd. After looking for a while I can see some cases of alignment, such as the page name aligns with the page content and the designers name is right aligned with the blurb. Also the link for the sitemap hangs over the content more than on the other side of the header with the designer name.

The navigation for the website is quite obvious, with the large grey box round the top link for the home page, which also highlights the page you’re on. The text for the navigation is also grey and then turns white when the box appears on hover. Each link has a different coloured box, but the text remains white. The coloured boxes use flat, quite dull colours, which work well with the white and grey colour theme. The colour for the boxes is also transferred to the links on that page.

Next to the links is another column which contains a short blurb about the designer, the text size is quite small but still easily readable. The column is quite narrow so the blurb has short line lengths and it could do with been slightly wider as the line lengths are probably too short.

Next to the blurb is the column containing some of the websites featured work, the column is the main element of the page and is a lot wider than the other columns. The work in the column is in a list, with the company title and date of completion above a rectangle shape image of the end product. Underneath the image is the description of what was undertaken for the project and a grey patterned line, which separates the different projects. The main problem with the featured work is that none of the designs are linked to the full description, which I would have thought would be a must.

The bottom of each page contains spare navigation, social networking links and the footer, with the copyright notice in. I’m not sure if the spare navigation is needed as the website is only small and the pages are not very long in length, plus the home page is the only page that uses the scroll bar. The social networking links are a nice touch as they use the logos from the companies and are in grey scale, so blend into the website well. When you hover over a social networking logo, it shows in full colour.

There is quite a lot of white space on all pages under the navigation and blurb, but this is to be expected because the main page content is over to the right and stays in line within its column.  The white space does not seem to overly substantial as the website uses quite large white spaces to separate different features.

The portfolio page of the website which contains examples of his work is split into three categories; web, print and logo. This arranges the page well and splits up the different types of work he has done. For each of the sections there is a large image scroll, which scrolls through his work showing a few different images. There’s a description section on the image scroll, but there’s not very much information on each project he’s undertaken.  The image scroll may look nice to start off with but it’s not very user friendly, as you are not able to stop the scrolling and the short description for the project covers up most of the larger image. On the image scroll there are links to the full websites, but none of the links work and there are no URL’s listed so you can’t view the websites in action.

The other links on the website are to his blog, which he has integrated into the website, an about page, which tells you a bit more about him and shows his CV and a contact page that contains a contact form and his email and home addresses.

Overall the website has a nice look and feel, it’s easy to navigate and it would be simple to extend and add new work to. The main downside is that it’s quite bland and could do with a bit more colour to liven things up a bit. It could also show his work in a more improved way than the image scroll and have more of a description about the work. The images on the home page could do with been links to make it easier to find that work and they could also do with a description to explain the project and what he did on them.