Compare the ways that designers and design companies present their websites. Use the Website Design Analysis sheet on Moodle (under website project) to make close deconstruction of at least TEN of these websites.
The first website that I am going to look into is Carter Wong Design. (http://www.carterwongdesign.com/) From looking through parts of the website I found that it is a website for information; about the projects and the clients that the graphic designer has. It shows previous projects and a small snippet of information about the design. In particular I looked at the project of 'Café Direct' for coffee packaging. The way this has been set out on the website shows a timeline in how they came to final design, the research and images that they used and how they do this. I think that this lets the viewer realise how much work goes into small details within design. I found the way of the set up here really easy to use, the function of the arrows at the side of the screen slides the timeline along, making it easy and user friendly for any age group or for anyone with different heights of computer and internet knowledge.
The immediate feel that you get from this website is quite professional and organised. I felt as though everything was explained in the right sections of the side bar. I think that it has been designed the way it has because this website can be used by anyone, like I have mentioned before, that the website is user friendly for people who maybe are interested in Graphic Design but aren't up to scratch with the internet.
The page size and length I think works really well in this website design. I think having all the sections listed along the side makes it visually pleasing, being able to see everything in one view instead of having to scroll down, you can click on a heading that interests you, there comes a drop down menu of sub-headings with in that, which is a good space saver and also keeps thing separate and the viewer knows where they are looking for certain parts of the website. So with these reasons I would definitely say that these points are beneficial to the site.
The images used through out the whole site I think compliment the colour and layout. The images are a huge part of the specific layout here. For this part I looked at a few different parts of the 'project' section.
My first was 'Tetley' As soon as I clicked on this, the first image you see is their website home screen with the designs and illustrations from Carter Wong.
My first was 'Tetley' As soon as I clicked on this, the first image you see is their website home screen with the designs and illustrations from Carter Wong.
 |
| http://www.carterwongdesign.com/projects/tetley.php |
 |
| http://www.carterwongdesign.com/projects/tetley.php |
The typography used on this site I think works good together. The title at the top is kept in a block typeface which I think it most important. Even here on my blog I have decided to go for a block typeface for my name, as I think its important to make this noticeable, especially if it's the company name or the designers name, this will more likely to be remembered if its bolder than the rest. The typography used for the side directory bar is a serif text, making it quite approachable I think, these are sub-headings so this also I believe has to be different, as they have a different meaning. In some circumstances I think that the sub-headings should match well to the title but I think this works perfectly as a mix, along with the titles of the projects (under each sub-heading). I think that all these typefaces are effective for screen use. The same typefaces used on the sub-headings are the same throughout the timelines, which links well the whole site.
The colour used on background on this site is good, its simple and effective for showing the work to its full potential on screen. The strip through the middle, where the timeline sits, is a good way to divide the sections up. The parts of text in the title that are in yellow just give it a hint of colour for the home screen which stays along the side, this makes you see which parts are the information and the navigation.
-------------------------
The second site that I am going to look at and analyse is Pearlfisher. (http://www.pearlfisher.com/index.php) I looked through this website quite a lot because the style caught my eye. The simple layout of the site is what I find attractive in both design and on websites. From looking through it I found it is a commercial, informative and an online portfolio to show off the beautiful works the company has produced for advertising. I think that this website can be used by any body who has an interest in advertising and design, but most importantly, I think that it has been aimed towards clients and new clients. They need to attract and promote, and I think that this website does exactly that. Here is the opening page for the site:
 |
| http://www.pearlfisher.com/ |
The Waitrose advert that they have designed being on the home page has been done for a purpose. It has a lot of colour attract peoples eye, while everything else around it has been made into a grey and black. After looking at this first I then went into the webiste at other projects, going first for the 'Innocent' project. For this all that comes up is the logo that they designed and in the left hand corner, a small caption on the task and scope. I think that this lets clients and viewers know a small section about what has gone on to design this but there is not as much information on every project as before with Carter Wong, there was so much, telling much detail about what went into the project. I don't think that this is a strong point for the site, but so far I think everything else I have seen here, really shows and portrays how they work and the style of projects that they design.
The immediate feel that I got from this site is simple and elegant. From the homescreen with the Waitrose advert I felt as though it is clear and precise about what they are going to be showing within the website. I was pleased with what I saw. The information down the side of the site I think works perfectly along the pieces of work that appear with a click.
The size of the site works well, as before with the Carter Wong site, it is as big as the webpage you would usually have open. This makes the site incredibly easy to look at and use. If on a site, you have to keep scrolling up and down, the viewer will soon get bored of looking for things, this set up with sub-headings works perfectly, with the headings along the top and side.
Images used on the site are simply laid out. There is only 1 image on screen at any one time which I think works in their favour for interest. Personally I like this better as my concentration is based more on 1 piece of work than 5-6 at the same time, which I think can spoil a piece of work, I would prefer to look at a thousand pieces separately and it take double the time, that viewing many in one go. Detail can be missed and I think this is the point Pearlfisher has gone for.
The typography used throughout the site is small and quite a quiet font to read. The text has all been made small and in a colour that makes the images of design stand out. I still notice these as the whole of the background is plain white. The typeface that has been used works well for screen use, this links in well with the navigation. The navigation for this site is good for the design structure that Pearlfisher has used. I really like this site and everything that they have done to show design and certain parts of information that they believe to be important (the task and scope - all the info needed?) I think the text works well with navigation, being a good size to not make anything else on screen seem less important.
The third website that I am going to analyse is Spin (http://spin.co.uk). The kind of site that this is, is a commercial, contact site and visual. Again for this site, the same as Pearlfisher, it has quite a simple layout which I think attracts clients to just look at the work. This is who I think the site is aimed at, as well as people who have a general interest in industry logo and advertising.
The size and length of this works well, just the same as the previous two websites I have looked at, the length works well as there is no scrolling involved in trying to look at further options which I think works best for sites, especially sites such as this. The only thing that is different about the size and layout on this site, is on some projects, there is a scroll to go further down into images, I think this is a good way to use the scroll. The only part that moves is the images part, the navigations stay along the top and sides, this is a good idea, still allowing viewers to change what they are looking at, without going right back up to the top again.
The immediate feel I got from this site by looking at the first opening page was quite an industrial feel. The opening image is the Renault 4+ with black and yellow, to me this doesn't show much of the design potential they have, but it is a big company to design for, so I do think that this was why they have decided to go for this as their home page.
The typography on the site I think is similar to Pearlfisher again. The font used is quite a simple font, and the colour used is different for each set of navigations, separating them up into different sections of navigations. I think they type works well with the images and the plain white background, it's not too big/small or too blocky.
I am next going to look at NB Studio. (http://www.nbstudio.co.uk/). My first initial thoughts when I saw the home screen of the site was sophisticated and style. The site for me seemed really interesting just by seeing the home image. This is what I saw first:
By looking at the home screen, with the navigation, my initial thoughts for this site was an information site. The map being the back ground, being in focus and the person being the street view, not noticing anybody. There was a slide show on the homescreen, showing more pieces of work from the company, I think that this is a really good idea, it has a selection of different types of work and ideas.
This way of showing work within the slideshow is showing potential clients the variety of works that the company can do and I think that it works in a brilliant way of advertising, the slideshow is quite quick, but not quick enough you can't identify certain aspects of the pieces, and you get a feel of the quality. Any one can look and appreciate this site. The navigation being very easy to use and the 'clients' section of the site, being high up in the list, draws clients and possible clients to this part, as within that link the list of already cliental is impressive, the layout on this page is easy and informative, making you see what you would want to with a design company.
The immediate feel when looking throughout the sub-headings is that the company has a lot of big clients, and the designs for these projects is set out in a way that you can go in to a client you like, viewing the work that has been made, I think that this something I would like to think about when making my web portfolio - linking.
The page length, much like the others I have looked at, it is as long as the browser. The analysis for this part is the same ideas and thoughts as before.
Images are used well, like I have mentioned earlier in this analysis, the slideshow shows a good and effective way of showing images to full potential, making them full screen, showing lots of detail.
The typography on this site has used a plain and easy font. quite a bold typeface, all in black and grey.The navigation has been set in a font with a serif, this to me makes the page look a little more sophisticated, a little 'posher' and a good mix of the two fonts, making a good contrast, showing which is a title and sub-heading. I think that it is an important point to experiment with different typefaces on one page, to me it makes it more interesting and visually exciting to look at, and you are more prone to look at different sections of text if the font is different to another, it may, and in this case it does, have something different to what you see first.
The colours on this site is something I would use on a site, plain and simple. I think this works well and is effective in a way that it shows everything on the site with no distractions.
The next site I am going to look at and analyise is one that is different from the rest I have seen so far. This is http://www.segura-inc.com/.
As soon as I got on to the site, my immediate feel and thoughts were not like the previous sites. I wasn't as keen on the layout, fonts sizes, set up on the site or the amount of information that is on the welcome page. I found it quite overwhelming and until the image of 'TYPOGRAPHY SKETCH BOOKS' appeared, to me I wouldn't have known this site was about design.
As you can see from this screenshot, the size of the page is quite long and this put me off straight away as before I have mentioned that I personally prefer a first initial page to be the size of the screen or less (all the the information and images). This webpage is to me a forum and informative page. I first clicked on the link for clients, as I like to see what cliental a company has. I don't want to have to put down this site, as some people may have the opposite opinion to me, but the layout of this page to me, wasn't the best. Again, I wasn't keen on the layout of the page and the way in which there is many different little segments to the page, I found it quite formal and almost like a site with lots of adverts, these aren't adverts as such, but it felt almost like a page where you might buy stationary, and its all been separated into each product.
The images that have been used here on this site I dont think have particularly been used to full potential. Although i'm not keen on the site layout itself, when you eventually get to click into projects the images do get larger, this is where you can see the proper images of the works. This is where the images are detailed and look good. As you can see here, the images are made bigger, but it is not until you click into the projects that you see all these images, and im not sure that the best images from them are used to their best on the link.
The typography used on this site is quite boring. Because the text is all really small, it doesn't make me want to take time to read it. I find that there is an overload of text on the home page, making it slightly overwhelming to see when you look at it. This is why I said before, I didn't quite think it was a design site, until the typography image loaded as there was so much writing that a first you wouldn't be intrigued to read.
The navigation is quite small and confusing. I dont think that it has been shown well on this site, just because its the same size and font of the text being written on the site.
Although I have said before that I think that a page looks a lot better when there isn't any scrolling and the page looks less scruffy, but on this one, because this is so well laid out, spread out so I think that makes quite a lot of difference.
The images on this site also work well, there is only ever a few on show at any one time which I think is a good idea, so that the viewer isn't totally distracted from the surroundings.
The typography on the site is quite simple and the colourings of the text is really good, the grey doesn't make anything to bright and distracting from the images which for this site is a lot more important.
The immediate feel that I got from this site is simple and elegant. From the homescreen with the Waitrose advert I felt as though it is clear and precise about what they are going to be showing within the website. I was pleased with what I saw. The information down the side of the site I think works perfectly along the pieces of work that appear with a click.
The size of the site works well, as before with the Carter Wong site, it is as big as the webpage you would usually have open. This makes the site incredibly easy to look at and use. If on a site, you have to keep scrolling up and down, the viewer will soon get bored of looking for things, this set up with sub-headings works perfectly, with the headings along the top and side.
Images used on the site are simply laid out. There is only 1 image on screen at any one time which I think works in their favour for interest. Personally I like this better as my concentration is based more on 1 piece of work than 5-6 at the same time, which I think can spoil a piece of work, I would prefer to look at a thousand pieces separately and it take double the time, that viewing many in one go. Detail can be missed and I think this is the point Pearlfisher has gone for.
 |
| http://www.pearlfisher.com/WyldWood.htm?viewallow=1 |
 |
| http://www.pearlfisher.com/FoodDoctor.htm?viewallow=1 |
-------------------------
The third website that I am going to analyse is Spin (http://spin.co.uk). The kind of site that this is, is a commercial, contact site and visual. Again for this site, the same as Pearlfisher, it has quite a simple layout which I think attracts clients to just look at the work. This is who I think the site is aimed at, as well as people who have a general interest in industry logo and advertising.
The way that it has been set out it quite similar to Pearl fisher, for example the navigation along the top and down the sides:
Looking through this site the visuals and image they have used is video and image. They have shown their work in a really good and simple interesting way. I like this site, because it is much like Pearlfisher in the sense that it is visually exciting and has a lot going on, yet not a lot at the same time, with all the work to look at, there is nothing else to see, not spoiling the details in the pieces. 
 |
| http://spin.co.uk/ |
The size and length of this works well, just the same as the previous two websites I have looked at, the length works well as there is no scrolling involved in trying to look at further options which I think works best for sites, especially sites such as this. The only thing that is different about the size and layout on this site, is on some projects, there is a scroll to go further down into images, I think this is a good way to use the scroll. The only part that moves is the images part, the navigations stay along the top and sides, this is a good idea, still allowing viewers to change what they are looking at, without going right back up to the top again.
 |
| http://spin.co.uk/latest-work/christies-march-issue/ |
The typography on the site I think is similar to Pearlfisher again. The font used is quite a simple font, and the colour used is different for each set of navigations, separating them up into different sections of navigations. I think they type works well with the images and the plain white background, it's not too big/small or too blocky.
-------------------------
 |
| http://www.nbstudio.co.uk/ |
By looking at the home screen, with the navigation, my initial thoughts for this site was an information site. The map being the back ground, being in focus and the person being the street view, not noticing anybody. There was a slide show on the homescreen, showing more pieces of work from the company, I think that this is a really good idea, it has a selection of different types of work and ideas.
 |
| http://www.nbstudio.co.uk/ |
The immediate feel when looking throughout the sub-headings is that the company has a lot of big clients, and the designs for these projects is set out in a way that you can go in to a client you like, viewing the work that has been made, I think that this something I would like to think about when making my web portfolio - linking.
The page length, much like the others I have looked at, it is as long as the browser. The analysis for this part is the same ideas and thoughts as before.
Images are used well, like I have mentioned earlier in this analysis, the slideshow shows a good and effective way of showing images to full potential, making them full screen, showing lots of detail.
The typography on this site has used a plain and easy font. quite a bold typeface, all in black and grey.The navigation has been set in a font with a serif, this to me makes the page look a little more sophisticated, a little 'posher' and a good mix of the two fonts, making a good contrast, showing which is a title and sub-heading. I think that it is an important point to experiment with different typefaces on one page, to me it makes it more interesting and visually exciting to look at, and you are more prone to look at different sections of text if the font is different to another, it may, and in this case it does, have something different to what you see first.
The colours on this site is something I would use on a site, plain and simple. I think this works well and is effective in a way that it shows everything on the site with no distractions.
-------------------------
The next site I am going to look at and analyise is one that is different from the rest I have seen so far. This is http://www.segura-inc.com/.
As soon as I got on to the site, my immediate feel and thoughts were not like the previous sites. I wasn't as keen on the layout, fonts sizes, set up on the site or the amount of information that is on the welcome page. I found it quite overwhelming and until the image of 'TYPOGRAPHY SKETCH BOOKS' appeared, to me I wouldn't have known this site was about design.
 |
| http://www.segura-inc.com/ |
 |
| http://www.segura-inc.com/portfolio |
The typography used on this site is quite boring. Because the text is all really small, it doesn't make me want to take time to read it. I find that there is an overload of text on the home page, making it slightly overwhelming to see when you look at it. This is why I said before, I didn't quite think it was a design site, until the typography image loaded as there was so much writing that a first you wouldn't be intrigued to read.
The navigation is quite small and confusing. I dont think that it has been shown well on this site, just because its the same size and font of the text being written on the site.
---------------------
I am now going to look at a site called Sagmeister. http://www.sagmeister.com/
When I first came on to this site, I was quite confused as to what was going on with the navigation. After sitting and looking at the screen, going away then coming back to the screen after looking at other things online, I realized that the people had moved around and doing different things around the room. I think the visual aesthetics here are brilliant and can please anyone who looks at this if you were to look for long enough, realizing the clever idea and thought that went into just the home page of this site.
Here you can see the guy in the left hand corner has appeared, and here you can see the dates and times are the same from the corner with a difference of 10 minutes.
From seeing just the homepage from here I could tell that the site is a site to showcase work, answer fans questions and to get in contact. Making this site quite an informative site. The site is directed at potential clients, after looking a few of the questions and answers in the 'ANSWERS' link I can see that the company are showing that the client needs to be serious about design, not rushing it through, they need to know that this is what makes their company sell and known.
The function of the site is easy, the navigation is clever and inspiring, seeing people work in the studio is so interesting, you can leave this site on for hours and you would see them moving about, seeing what they do on their day to day basis and design timetable. (not up close, but roughly)
The site is set out well on the work pages, having a navigation along the top, the when going in to work, there is smaller sub headings, which allows you to go in to different sections of the companies work.
Like here, the piece I clicked on from the choices in the screen shot above, the good thing about the way that these pages have been set out, is that you can choose whether you want to view the information on the piece, after clicking 'info' you can also 'hide info' which I think is a nice touch which makes the viewer concentrate on the piece of work.
I like the way also that the the page is simple and makes the work the main piece of info that you can see, it doesn't take anything away from it, the colour scheme also does this, letting you see the main feature - the piece of work, which i'm sure is what they intended when they make the pages.
The typography on the page is simple also, it is a type face that links perfectly to the home page where the links have been painted on the flooring of the studio, the block letters gives you only a few options, and then later on when going into different sections of the site, the text gets smaller for example, the works that they have done; CD covers, Film or Advertisement are just a few of the sub headings that can be chosen.
--------------------------
The next website that I am going to look at is Johnson Banks http://www.johnsonbanks.co.uk
from looking at the home page of this it very simple, but colourful too, highlighting links that you can click on to go to parts of the website, this way of making the navigation I think is different but clever too, its something you automatically just click on without noticing that there isn't actually a proper navigation bar, so I think the function of this site works well. This site would again be for potential clients and people with a general interest in design.
The visual aesthetics of this site are good, when I clicked into 'Identity & Brand' I liked the way that it was set out. I think that the lines that they have in between bits of work works really well to divide up the page and pieces of work.
from looking at the home page of this it very simple, but colourful too, highlighting links that you can click on to go to parts of the website, this way of making the navigation I think is different but clever too, its something you automatically just click on without noticing that there isn't actually a proper navigation bar, so I think the function of this site works well. This site would again be for potential clients and people with a general interest in design.
Although I have said before that I think that a page looks a lot better when there isn't any scrolling and the page looks less scruffy, but on this one, because this is so well laid out, spread out so I think that makes quite a lot of difference.
The images on this site also work well, there is only ever a few on show at any one time which I think is a good idea, so that the viewer isn't totally distracted from the surroundings.
The typography on the site is quite simple and the colourings of the text is really good, the grey doesn't make anything to bright and distracting from the images which for this site is a lot more important.
No comments:
Post a Comment