Research: Portfolio Layout
Before updating my website, I want to look at some examples of how to display my work in order to ensure that the layout is as professional as possible.
This is the first portfolio page that I stumbled across. First thing I noticed is that the page does not have a colour scheme and it looks very messy and unorganised. The different sizes and orientations are confusing and the pictures are really small which does not help to identify what each project is about. This was a great example for me to understand that I want the same orientation and layout for each portfolio page.
You need to hover over the images to see the title of the work. However, I dislike the font she used and the size is really small.
I think it is vital to display both title and year in clear and professional fonts, something which is not shown in this design.
I like the method of hovering over as it is a common way to display the images onto the page. It is simple and effective.
This was a beneficial example to look at as I realised what I want to avoid in my own website.
This is a similar method to the one looked at previously. However, in this case when you hover over the image, the image becomes blurry in the background. I really like this as it helps you identify what the main title is. Additionally, I really like that the designer included different shots of each product (close ups, long shots, medium). This makes the website have more variety and looks more professional.
I like that the images are large enough and take up a lot of space as the user can take his time to contemplate and really look at the detail on each before clicking it.
I also like how the designer maintains a professional colour scheme. Even though the products differ in colour, the background is kept very simple and minimalistic to ensure that there is an ongoing theme which shows brand identity.
In the previous one, the background would change constantly which showcased the work in a messy and unorganised manner. This shows how much the background can affect the formality and image of the brand and product.
This is a different display method that the ones I previously looked at. Instead of including only a cover image, the artist included a short description and the title next to it before clicking on it. This can be beneficial as the user can have the opportunity to find out more about it and identify it before clicking on it.
It is also isolated from the other portfolio products. This can be good as it ensures that the viewer is only staring at one object at a time without getting overwhelmed with the information given.
I cannot tell which one is more effective as it is simply a preference, however, I definitely prefer the image method. Displaying large images is always more attractive and enticing to me when it comes to a website. I will definitely include an introduction, but you will be able to access it once you click on it.
A disadvantage of this method can be that people will not click on it. By describing the product on the layout page, people may not be as enticed to click on it. However, if you place an interesting image of the design without any information displayed, this will make the viewer more eager and curious to find out more about it. It builds tension and creates excitement to further explore the product. That is what I always feel when looking at websites.
Lastly, this method takes up a lot of space. Therefore, when there are many projects displayed, the user has to scroll down for a while to find the desired one.
Once again, this is a completely different method than the previous ones used. The designer displays his products using a slide gallery. However, each slide of the gallery is a different project. The slide gallery contains 6 different projects. You have to click on each one individually to find out more about it.
Personally, I really dislike this method. It does not give the viewer the chance to look at your work together as he has to slide to view the different products. This may alienate the user as he may get overwhelmed or lost in the process of it.
Additionally, the cover page is not as enticing and does not make me feel interested enough to find out more about this.
A slide gallery can be effective to showcase the work of the same project, but not different projects.
For the layout once you click on the thumbnail picture:
Sophie chose to display her design boards and outcomes vertically. She did not include a gallery, the user simply just has to scroll.
Personally, I think this is not very neat and organised. I will place 6-8 design boards which will not be effective for the user to scroll. I do not like this method as the user cannot have access to all the information at one place.
Marc Newson applies the same hover over with image layout for the portfolio. However, once you click on it, it opens up to another page.
I really like that the orange theme is ongoing and seen in all of his works.
The slide gallery helps keep everything organised and he only includes images of his work. He does not include any design boards as the information is on the bottom.
I do think that it is a very effective method. However, I am thinking of including the design boards first that showcase the work (sketches etc,- research I did in previous post), and then also include some stand alone images to further showcase and enhance the details in my work.
Thinking about it, I could include the stand alone images first to encourage the viewer to scroll and find out more about the process and technical aspects of the design. I want to include around 10 images max in my slide gallery, therefore I am aiming for 6 design boards and 4 stand alone images which are mock ups.
For my layout, I want to use the picture method. Maybe I can also enlarge the image for this terms project and make last ones smaller. This will also indirectly showcase which work was done this term and I can change it next term to make the upcoming project enlarged. I think the image layout works the best and then once I open it up I can include the introduction and design boards.
Once you hover over it, I want the title and year to appear to ensure that people get the right information before clicking on it. I will also include a slide gallery once you click on it.
I have not blogged about my website changes yet as I want to ensure that I correctly research everything before changing it in order to be more efficient.
This was a very beneficial task to complete as it helped me realise my preferred layout and what I would like to include in my own website to enhance and showcase my work better.
Comments
Post a Comment