Saturday, October 2, 2010

Website of choice

Website reviewed: "Tracy Apps Design" http://tracyappsdesign.com/

  • This is the website that I took a lot of my inspiration from for project two in GUI this semester. It is the website for a small design studio in Wisconsin, America, founded by designer, Tracy Apps.

  • The thing that I like the most about this site is how different it looks. It is so refreshingly unique. It is fun and really promotes the designer/company’s style.

  • The moment you open the website, you are immediately drawn to the colourful swirls in the top right hand corner. This is surrounded by colourful gradient “rays” that really add light to the rest of the site, which is a dark brown. This entire area is absolutely beautiful and acts like a light to the rest of the site. It is not heavy or overbearing. This is surrounded with a very unique menu, which follows the general curved shape of the swirls. This makes the site a little more interesting than most, but it is still easy to find – it really stands out against the background with relatively large text.

  • This makes navigation around the site very easy – there are only 5 main pages and on each page, the menu stays the same and in the same position so one doesn’t have to keep looking around to find it. The rest of the site is also like this – most elements stay in the same place. This is a very simple solution to a website, but it works very well. It seems that all unnecessary content and elements have been taken out, which is really good.

  • Again, rather unconventionally, the logo is positioned at the bottom right half of the page, and is locked onto it, so when one resizes the window, it moves with the bottom – it doesn’t disappear. The logo has its own space and also brings in the swirly and colourful elements from the rest of the site, so it draws a lot of attention.

  • The homepage of this site has been done well – the content takes up most of the page, but is surrounded by a lot of open space. It has an inspirational design quote that frames what can be assumed to be one of their most recent projects. Below this is a short description of the company and a link to get a “free consultation”. I think that this is really well done – all the content that a viewer could really want to see what the company is about is available straight away, in a clean and clear layout.

  • When moving the mouse over menu items, a small image appears and the text changes colour – this is really effective and lets the user know what they are doing and where they are. The only thing I could think of to improve this would be to keep the image there or the changed colour when the user has navigated to that page, so that if they have scrolled down a lot in a certain page and look over at the menu, they can still see immediately where they are, instead of having to scroll back up to check the title.

  • I also think that on the portfolio page a lightbox effect could have been employed to display their work. Instead, their work seems to have been organized in a blog with images, videos and a fair amount of text.

  • Another issue with the site is that when you re-adjust the window size, you can lose a lot of content. For example, if the window is too small (whether it has been adjusted to this size or was already the default setting), content can be obstructed with the logo or menu.

  • Overall, I really love how simple this site is. All irrelevant information has been taken out. I also love the colours and the playfulness of the design. I think that this site very effectively promotes the design company who made it.

Film promotional website

Website reviewed: "Donnie Darko" http://www.donniedarkofilm.com/

  • Donnie Darko is one of my favourite movies, because it’s so weird, so different. I decided to do this section of the brief on Donnie Darko because I assumed that the website would be equally as interesting. In the end, it both was and wasn’t.
  • This website really is very different, and definitely appropriate for the movie. It is completely unconventional, which is really a nice change, but also means that one has to learn how to navigate/what to do when you first use it, as it is not all that clear.
  • The first page is mostly white space with grey spikes/triangles at the bottom right corner and a little video box/window with a jittering image of Donnie and a red “record” button. There is nothing else. Except for a small, red flickering dot, a few lines randomly placed on the screen, and “--->” at the top left corner of the page. These seem really random and don’t seem to serve a purpose. The “--->” seems to be a coding error?
  • The site doesn’t give the user any instructions about what to do now, but forces the viewer to experiment in order to move on. This can be both frustrating and rewarding. This website seems to be all about the experience, rather than information, so I guess that this helps it achieve just that. This seems to be a good site if you have a lot of time on your hands and you want to figure out a puzzle.
  • After clicking on the red “record” button, which is flashing at you (drawing your attention), it moves on to show how much time has passed since Donnie supposedly died in the movie. There is red text reading “proceed” – when you click on this, a pop-up window appears allowing users to enter a password to immediately move forward (to level 1). This is very very good for previous users, allowing them to skip a lot of time and somewhat pointless content – to move onto where they might have left the site before.
  • Overall, the site seems to have been made using Flash elements and definitely work well to sell the movie. It is mysterious and confusing and interesting, but very frustrating if you get stuck on one of the quiz elements and can’t move on. There are even blogs over the internet which can give you a walkthrough of the site, and there seems to be many issues between browsers (I couldn’t move on from level 1 to 2 because of this).
  • The design, however, is brilliant. There is always a lot of open, empty white space, which really seems to enforce a feeling of loneliness. Most of the content appears in the bottom right corner of the window and elements such as letters (presumably from the movie) shake, or the writing blurs to make you feel like you are Donnie – you are sleep walking.
  • The site also has amazing audio. This comes in before you reach level one and is incredibly creepy. It includes full songs from the movie and eerie sound effects, such as a heart-rate monitor. It creates a really good environment for the site.
  • I had to give up on the website, sadly, after only finishing level one because of issues with the browser (I read that a lot of other users encountered similar issues with certain browsers). I think that the site is great for promoting the movie – it has a very strange and interesting aesthetic, is beautifully designed and makes you feel like Donnie Darko. However, it gets frustrating fast – if you want to get to a certain area, you have to go through a lot of pages to do so. Everything is slow – the animations take a while to finish and you can’t move on until they have.
  • This site could have been greatly improved if it provided viewers with a "skip" button, or an easier way to access the information/page that they need.

Online newspaper/magazine

website reviewed: "Femail Magazine" http://www.femail.com.au/

  • This site doesn’t immediately scream “we are all about good design.” In fact, at first glance, it seems to be boring and cluttered with too much information. However, it has a very standard layout – bold header at the top, navigation bar directly below/inside it, content in three sections at below this, and footer at the bottom.
  • The simple colour scheme (red and white) seems to have been used relatively well – it distinguishes the header and footer (which are a bold red) from the content (which is white). All headings are in red and other information is black, so the different sections stand out.
  • The logo is on the left-hand side of the header(as is also standard). This isn’t very well designed – it seems cheap and rather unflattering. The text in the logo is large and bold, so it does a good job of grabbing attention, but the image part of it seems to shrink back into the deep red of the header. To the right of the logo is a search bar and two menus – one on top and one below it. While these also somewhat clutter the header and seem to be quite randomly positioned and uneven, they immediately provide the user with access to specific pages. The search bar is a good addition here though, since it really stands out against the red. If it had been placed below the header, one might have had to search for it. However, its positioning also seems very random and uneven. The worst part of the header are two yellow buttons on the right side which read “join our VIP club” and “enter competitions”. These are really ugly, not just in terms of positioning, but in terms of colour.
  • The content area has an absolute information overload, which further gives the site an unsophisticated feel. This space is divided into three vertical sections. Again, these seem random and uneven, and are divided with dots (…..). This is quite ugly, but at the same time, it seems to divide the sections in a very subtle way. The left section is dedicated to random-links/menu – but this is not very clear and looks messy. For some reason, the login has been placed quite far down the page – it would have made more sense for this to be at the very top so that viewers don’t have to search for it, but can see it straight away.
  • At the middle/ section are google adds, which firstly look really ugly, but also could confuse the user, especially if they are new to the site. Below this is the main content – articles with bold red headings (this is good – it highlights what each section is about), an image and text, with links to allow the user to read more. This allows the user to get an immediate sense of what the site has to offer in terms of current news and articles. The viewer can take in a lot of information quickly before deciding where they want to go next.
  • The right section of the content area is reserved for flashing, moving adds. This is probably fair enough, considering that magazines are very much about advertising, but it doesn’t do a lot for the design of the site. These attract a lot of attention (again, I know that this is the point), and therefore take away attention from the actual content of the site.
  • Navigation can be done by either using the search bar which is positioned inside the header, or by clicking on the horizontal menu buttons at the bottom of this, or by clicking on one of many (possibly too many) links in the content area. This offers users a lot of flexibility, but can also seem overwhelming. However, navigating back to the home page is always easy as there is a button for this.
  • With a site that has this much information in it – especially in terms of adds, one can easily get lost when looking through the information. You go from reading one article to another, to another and if you wanted to eventually go back to the first or second article, you can’t – there is no back button on the page, and no way to really track where you have been.
  • Overall, this site isn’t great. It is very confusing and busy and has been designed rather badly. It doesn’t have many strong points. I only really like how the search bar is in the header, so it is very easy to find, but even this hasn’t been done very well.

Online Store

Website reviewed: "Ebay Australia" http://www.ebay.com.au/

  • Ebay is an overall easy site to use, whether you are a first-time user or an online-shopping junkie.
  • The site has a very simple standard layout – the colourful, iconic logo is positioned on the top left-hand side – its bright colours immediately catch your eye, which effectively highlights two hyperlinks directly to the right with which you can sign in or register. It is good to know that if you are a newbie, you don’t have to look much further than the logo to find the most important part of the site.
  • On the right, still in the “header” area there is a menu that allows you to choose whether you are buying, selling, takes you to your account and offers you help. This isn’t incredibly clear though when taking into consideration the rest of the page, which at first glance seems to be cluttered with information, moving adds and images – all which catch your attention.
  • At the top of the content is a search bar and a drop-down menu that immediately allows the user to search for what they want. This is very important for people who know what they want and don’t want to waste time navigating around the rest of the site. It provides a shortcut for such people, as well as for people who are comfortable with the site.
  • On the homepage is more or less everything you need – a place to search, sign in, sign up, adds, deals, links to the community, links to get help and search categories, which are listed on the bottom left-hand side and are all hyperlinks to other pages. This allows both new and old users with all the information that they need about the site. The only problem here is that nothing things seem very busy and cluttered which doesn’t do much for the site from a design point of view. It is also interesting to note that many of the content boxes in the page aren’t always aligned and that the negative space around these containers are sometimes also un-even. However, each section has a clear heading which helps to order the information and allows users to find their way around instantly.
  • Navigation around the site is very easy and there are many options. However, navigating back to the homepage from a ‘search’ page can take a while to figure out – the link back is quite small and is rather hidden between the rest of the content.
  • Overall, the site is very easy to use, whether you are new to it or whether you are experienced. It is a great site for its purpose – an online store, but the design is very lacking. It is very plain and simple – nothing about it screams good design, but it is practical. This is not the kind of site that should necessarily have bright, bold colours, but perhaps a better design overall would have helped to diminish the site’s “busy” atmosphere. There seems to just be an absolute overload of information.

Graphic/multimedia/creative studio

Website reviewed: "Hipfish Design Studio" http://www.hipfish.com.au/

  • Good colour scheme – use of only a few colours which create a professional yet fun feel (grey, lime green, black and white)
  • Neat simple layout with clear header, footer, navigation and content areas. It is professional but still has some character
  • The logo is quite large and at the top in its own space. On the opposite site of the “header” is large/bold text which summarises what the company is about/what they do. This gives you an immediate indication of what site you are at.
  • Below this is a clear horizontal navigation menu which shows rollover quite nicely. The issue here is with the dropdown menu which is not very clear and which is rather indistinguishable from the rest of the website behind it. It almost seems to blend in. Maybe this could have been avoided with something like a drop shadow or border. Also, when navigating to pages such as ‘about Hipfish’ where there are few further navigation options, the titles of these aren’t clear enough and definitely take away from the design.
  • I like the dashes which have been used for ruling and for separating the areas of the website – it is creative and unique and reminds me of old crafts like knitting/stitching etc which maybe creates a more trusting impression…
  • It is very simple to navigate around the website since all non-essential information/graphics have been left out of it, so navigation is very obvious and user friendly.
  • The homepage has a collection of information that is neatly organised and includes sections such as “what we can do for you”, their latest news and deals, “a snippet of what we do”, access to their portfolio, reviews from clients, access to their newsletter and contact information. This provides potential customers with immediate access to all the important bits of information that would be required for them to consider using the studio for work.
  • I really also like how the sections of the website on the home page have been separated by titles - these divide up the content into 3 equal parts which helps the overall design and keeps everything even and well-aligned, balanced. I think this could have been further improved in terms of usability if clicking on the titles could have taken you to the appropriate page as well.
  • The portfolio page has been done well too – it includes a separate navigation header that navigates to works in their different areas of expertise – it includes a small/short description of what the images are about and showcase the cropped work which, when clicked, show it using the lightbox effect. This clear, simple, neat layout and presentation makes the work the center of attention - extra text or irrelevant information would have damaged this areas good, clear design. When going to the portfolio page, it is almost completely blank – only has a small title and description of the page and a small navigation bar. Maybe they should have had a default page here instead of leaving it blank so that the user is immediately exposed to work. There is clear navigation back to the main website and clear navigation to other areas of the portfolio.
  • Perhaps they could have done more with the interactivity – e.g. rollovers could have done something more exciting than just have the cursor change – maybe the image/text could have been enlarged or changed more dramatically to show that it is an interactive component. This is especially true when navigating through the extra navigation in the portfolio section, and for images on the homepage which navigate to other pages.
  • Otherwise, perhaps the website could have included subtle sound effects for interactivity to let the user know when something has been clicked etc.
  • The language on the portfolio is professional when it needs to be but is otherwise quite laid back – e.g. when you go to the portfolio page the title is “What would you like to be nosy at?”
  • When navigating around the website, several separate internet windows appear – the user is still able to navigate back to the homepage from the window they are currently in, or they could simply close the different windows until they are back on the original window.