Back to college evaluation

The week back has been a busy one. Screen designs have been on my mind for this assignment for a while. I had a really good idea but couldn't manage to project my views on a digitalised piece. My first attempt was rather poor, due to the image I had in my head was not found at all. I decided to take another approach and found several images that would be useful.

One thing that I am trying to do is to use another style rather than the usual bold image header, horizontal navigation and the Trebuchet font. Breaking away from this theme was harder than it sounded. I have now come up with an idea almost complete but I am feeling agitated towards building it as it is totally different to any other design that I have created.

One thing I would do next time is to search for more pieces that could be useful, rather than grabbing a select few and playing around with them. This method cost me time as I couldn't get the image across how I wanted it.

I am now feeling a little behind schedule as most people have started their building, and I have yet to complete my final screen design. To solve this I am going to have to make sure I catch up during self study time. This shouldn't be a problem, although the amount of work I have to do for the other assignment could get in the way. I.e. meetings with client, photographs of the shop, etc.

Evaluation week 4 beginning

This week I feel I am still keeping up with my time management. I am on target as far as I have seen and no one else seems to be any farther in front. I am relieved of this, and it has made me more relaxed and focused. The idea’s generation development I have completed today has been excellent, although I would say that I have created far too many concept sketches, which took up a lot of time. If I was to do this again I would select my genres first and then start exploring those chosen genres. Instead I started exploring them all first and chose the best developed genres.

I am nowhere near having any final designs yet, which I feel will slow my progress but I feel that this amount of work is merit criteria. It is also the part I enjoy the most.

I have come up with some ideas that I have never tried before.

Last weeks self study didn't go as planned, although I managed to complete everything that I needed. I was constantly getting distracted by parents wanting to use the computer during my study. In the future I must either do the work elsewhere or stop them from using the computer during my study time.

Over next weeks self study I will need to finish my sketches and start to develop some ideas, as well as create digital versions of the finals and a site map. I also need to upload my delivery requirements, and combine it with my goals, target audience, competitive analysis and the screen designs into one document. My references also need logging properly.

I will also look into a new technology that I have not used before. This could include a flash rotating banner, as well as the sliding doors technique and tabs. I look forward to the building stage of this assignment.

Everything is going smoothly

Goals

• To use XHTML 1.0 Strict and CSS 2.1
• To validate to XHTML 1.0 Strict and CSS 2.1 with no errors
  
• To create and use a Flash banner/advertisement

Visual Cues

Visual Cues are intended to help the viewer in a number of ways. Mostly they are used to emphasize that something is there and what it does. They can also be attractive, making the site appeal more and become easier to use. Without visual cues people would get lost or bored of the site very quickly. It would also be hard to figure out where hyperlinks are, or certain important words.

The first ones that are probably the most used are the font-styles. Things like bold and italic are used regularly to emphasize key words or phrases. They can also represent links as they will be in a different style compared to the body text. Underline is also another style that is set to a hyperlink by default. This allows viewers to easily differentiate between body text and navigation links.

Another widely popular visual cue is the rollover feature. This is another method of letting the viewer know that the hovered over object is a hyperlink. These rollover effects can be quite complex or even something as simple as the font changing colour.

Underlining is the most common way to interpret that a link is actually a link, and not just some body text. Most sites keep to this method, and most users are aware that a hyperlink is underlined. There are sites that have other methods to show navigation. For new users this could be a bad thing because they will be used to the underline. It could disorient them and make them want to leave the site. However, more and more sites are moving away from underlining as it looks unprofessional and so much more could be done in its place.

I think that we are coming to a time where links are not just obvious by an underline, but by various font weights and rollover effects. They are becoming more popular and more people are getting used to these new methods. I feel that moving away from underlining is something that must be done, and one that is already taking place.

Because of this I will be using a simple method of navigation that should be clear to the viewers, but not by using the underline method.

Flash banners and advertisements are also a widely used visual cue that can be very frustrating for new users, especially if they are required to download a new plug-in to make it work. This is one of the most off putting things for new visitors, as they will be unaware of what they need or how to get it.

The good thing about banners is that they allow visitors to see top features or special offers without having to browse for them. It also shows some interactivity and entertainment especially if it requires users to interact with it. These banners can be a great way to keep visitors on your site and to keep them visiting to see something new.

For this reason I will be using some sort of flash banner, but it will be for a low plug-in version. This will keep my guests entertained and updated with the latest features and releases. It will also give me some knowledge in Flash, as I will need it for the final major project.

The layout and structure of the text is also important. It shows what information is significantly more important than other information. Things like titles and subheadings should always be noticeably larger or emphasized more than body text. Links should also have their own style. Things like the copyright statement should be the smallest size compared to the rest of the font sizes.

For this reason I will make sure that my text is structured properly. I will use clear headers and sub headers to show importance and separation of paragraphs. The copyright statement will be the smallest font compared to the rest. I will also use a font that is easy to read. This is most likely to be a sans-serif font.

The use of colour on a site is important. Sites that cause eye strain due to uneven or contrasting colour combinations will most likely make the viewer leave. Colour is probably the hardest one to get correct. The colours should be used in moderation and not too much colour in the same site should appear. The use of too many colours can also cause frustration or confusion. Sites should try to keep their colour combinations to a maximum of 5 colours.

I will look at the themes of the iTunes pages that I will be working on and choose appropriate colours for that scheme. The site will not be dark and will not cause eye strain.

Progress so far

The assignment so far has been somewhat different to the other assignments I have done so far. I feel this way because all my work is up to date and has been completed to my target times so far. This is because I have been able to manage my time properly. I also have a printer at home, so whenever an essay has been completed I have been able to print it off straight away and place it within my folder.

My old method was to print everything at the last minute, which was a handful, especially when I found errors in the work. I would find that more than likely it was too late to change. I did it this method before as I preferred to print all my work off in one go, rather than having to print off sheets and sheets each week. I can clearly see the benefit that this has given me. I hope to keep up the good time keeping.

On a bad note, my USB broke today, which stopped me from completing my visual cues on time, although it allowed me to type up my other essays and proof read them. I was glad that I backed up all my work the night before, so nothing was lost.

Next time I would write up my draft copies in my sketchbook, instead of on word to show my progress and any notes I have taken whilst browsing the net.

For the rest of the assignment I wish to keep up the organisation, and to keep on track with my planning. I also to look into as much of the merit and distinction criteria as time will allow.

Sound Cues

Sound features are common throughout the Windows Operating system, and several on the Mac OS. The sound features allow warnings to the user, and are particularly helpful for people with visual disabilities. These sounds can come in many different varieties, including chimes, bells and pings.

The pitch and length of the sound usually refers to what type of alert or acknowledgement has happened. Friendlier sound effects are used mostly for welcoming you onto the operating system or notifying the user that they have clicked on the “up a level” button.

Warning sounds are higher pitched, created to grab your attention. Things like closing a program without saving your data would often result in this type of sound. These sounds are helpful, especially with things like forgetting to save your work.

Users benefit from these sounds, and they don’t occur repeatedly which means the user will not get annoyed at hearing the sound over and over. More benefits of these sounds are that they alert and make aware the user has done something, especially something wrong.

Sound throughout the web, however, is a different story. Sites tend not to use sounds on their websites as they are usually annoying and frustrating for the viewer. Sites that use sounds tend to choose unnecessary and weird sounds and sometimes full soundtracks, thinking it improves their site, when really it just tells people to click back as soon as they hear it.

Sites with soundtracks are also a way of turning people off. There is probably a small percent of viewers that actually find music on a website a good thing. At least with some sites you have the option to mute the sound. This shows that they have thought about the consequences of sound on the net, and have found a way around it for viewers that don’t want to hear it.

Sites with soundtracks
Diggerland website
Various Myspace pages

A lot of web designers don’t use sound as the music files themselves can be quite large, slowing the loading speed of the site.

One good thing about sound on the internet is its use on the browser you are using. When you click back or forward you will hear a little notification click that lets you know you have pressed it. This noise also appears on some site links, letting you know that you have pressed it.

Another, is for interactive websites made directly at children. Children need sounds and movement to learn. I feel that the sounds implemented on these sites helps them dramatically, as well as making them entertaining and fun to use. The Winnie the Pooh site and the Cbeebies site do this very well.

Conclusion
Using this feedback I have received, I have come to the conclusion that sound is good for the right things, and off putting and annoying for the rest. Sound is also good for receiving error messages. Putting sound on the website would be a big mistake, as it’s unprofessional and annoying. I will not be using sound, although I do feel that I will have to learn how to implement sound into websites at some point as it will probably be needed in the future. I will also not use it as it will make the file size of the site larger, increasing loading times.

Competitive Analysis

Site 1

Mbop
The MBOP website has a clean appearance. Items such as the album covers could be aligned more carefully. They have a lengthy gap below each cover. This could be reduced and more albums could be shown. The album icons are also quite small. It is hard to tell what is being shown in the cover. The website is also very wide. Users would have trouble viewing this website on a low screen resolution setting. The navigation in the top right is out of place. It could be situated a lot better. The featured releases are a good way to advertise best-selling downloads, although it will constantly need updating. The design itself could have more colour, or one that is more inviting than gray. The site has good contrast, and the use of colours is well suited.

The logo has a very groovy feel, which is down to the font used. Its very smooth and sleek, the angle of the font also creates a better effect.

Clicking on an album will give you a copyright statement, prices, a larger version of the album cover, track listing and even a preview button. The preview button will let you hear the track before you purchase and download it. This is a good idea if you wish to hear certain tracks you have not listened to before. The preview also allows you to check the quality of the sound before you download.

Features
The news bar on the right side is a great way to attract people’s attention. They appear just like a newspaper would advertise the. A bold header, a few short sentences on the article and a link for the full story (A “go to this page” in a newspaper). This would also need updating regularly. I feel that it could be positioned in a better place and could be more attractive if the fonts were edited and a bold “News” title appeared above it.

The dropdown boxes I feel are useful, as the mage already has many links showing. This method keeps things tidy. This particular dropdown menu helps to specify what genre the search should look in. This is a great idea as the huge amount of albums this website would make a simple search difficult. It also helps create a faster search for the viewer if they know what genre they are specifically looking for.

After a search has taken place an extended alphabet search will appear. This feature also helps cut down searching times for the viewers who know what they are looking for. However, I do feel that viewers who are searching for something new would get lost in the amount of detail this type of search method goes into.

The alphabet also scrolls across the full width of the page as well. This can be very uncomfortable for the eyes.

The basket on this site is fairly straight forward. It is always visible which is good, as you can always tell what you have in your basket. This is good for visitors who have a large list of things added, and cannot remember what they have bought already. It is also handy for if you forget what you have just clicked on. The X symbol took a while to get used to. For adding the selected music download to your basket the icon is set to a +. These symbols are very similar and people could get confused easily.

The log-in system makes the site easier to use for returning visitors. It allows visitors to sign in and see their previous downloads and current downloads. Signing up is free and easy to complete.

Improvements
The site makes use of the whole page, which would affect users with a low resolution screen setting. There is a lot of white space between different areas of the page. This white space can easily be removed by aligning the other areas closer together. This will also make less of the screen used so the site can be used by low resolution monitors or settings.

The text in some areas is stretched throughout the whole page. Dropping this onto several lines will increase the readability of the page and make the alignment more professional. Keeping the text consistent is one that the site needs work on. There are various different text sizes. They need to be kept to a few standard sizes. The “Advanced Search” link is too small. It needs to be enlarged as viewers with eyesight disabilities will struggle to read it. The text in the grey sub header bars are aligned right up to the left, with no spacing. This can also make the titles harder to read. Align the headers a few pixels to the right to solve this.

The corners of the logo are cut off because they are so close to the edge of the page. Aligning the logo a few pixels in from the top and left would sort this problem.

Some of the album cover images have been reduced to artefacts. They have been compressed too much, and will need to be restored back to a better quality. The images are also fairly small, and cannot be enlarged by clicking on them. I recommend having full size or a bigger size of the album art for when the thumbnail is clicked. This will give the viewer a better view of what they are downloading, as most song’s genre can be told by the album cover.

Having multiple scroll bars will confuse novice users. The news should be expanded so all can be seen, or set to its own page.

There is “Genres” written underneath the links in the top right. I have no idea what It is for. It isn’t a link, and if it was a link then it should be placed on the same line as the other links. It should either be removed or mended and placed on the same line. The links at the bottom of the site have a “Press Release” link but not at the top.

The “Music download” section text is like a welcome note. It needs to be taken out of the box at the bottom of the screen and placed above the “Featured Releases” part to give new users an inviting welcome.

The purple highlights over the links are good for people who are novices, as it allows them to clearly see that they are highlighting a link. It should stay consistent though, as some of the links don’t have the purple highlight.

Overall I give this site 6 out of ten. It’s easy to use and good for novices, but there’s plenty of room for improvements.

Site 2

Juno
The website has some alignment issues. The content looks unprofessional because it has not been arranged in a good way. The website expands and contracts to the browser viewing the site. This is good, as it can be viewed in many different sized browsers. After a certain size, some of the links and images start to overlap on top of each other. This can make it difficult for viewers who have low resolution settings. Certain links are underlined. This makes it hard for the viewer to read the links easily. The green used is a very off-putting colour. Fonts and font sizes are different for each section. Some of the options at the bottom are links, but they look identical to the other headers, which aren’t links. There needs to be some recognition for links. You can change the currency depending on where you are from, which shows that the company is used by a range of people from different countries.

After clicking on an album cover, I received this page. Its alignment is also a big issue, and needs to be layered out effectively. The tabs allow the screen items to be narrowed down. This is great for finding things quickly if you know what you are looking for. The icons aren’t ones that people would recognise, but they do have a very clear alt tag name for when they are highlighted.

Features
The search feature allows users to search for the album/song/artist they are looking for. This method isn’t very friendly for users who are looking for something new. The album songs are spread all the way down the page, which means long scrolls down if your search, has loads of answers.

Its advanced search has multiple options allowing you to optimise your search as accurately as you like. For beginner users it also displays help boxes to the right allowing the user a hassle free visit. The alignment on this page seems a lot better.

The shopping cart can be viewed by clicking the link in the top right. The shopping basket allows the user to see what items they have selected for purchase. This is not, however, shown on the main page. The viewer must access it manually.

Purchasing music couldn’t be simpler. Simply tick the box next to the track you want to download, select what format it should be in then click buy. The site also allows a preview of the songs as well, which is great for if you wish to listen to the rest of the album before buying it.

Juno also comes with a login form. Registration takes less than a few seconds to complete, which is great for novice users, as they don’t have to worry about doing loads of typing. Being a member allows you to have your own settings stored. Things like your shopping basket will be saved until you delete the items from the basket.

The login feature is great for returning customers, as they have no need to fill in their personal details every time they visit the site.

Improvements
Personally, the green is too much of a Mickey Mouse colour. It needs to be darkened to look more professional. The site is also expanded all across the page. This makes it hard for viewers with low screen resolutions. The site is trying to show off too much of its information on a single page. I think that the layout needs some looking into, and maybe not showing as much information.

The site is quite helpful for novice users, as help fields appear, and each section is given a clear header, this helps the user not to get lost in the information.

The fonts need to be kept consistent. Each section seems to have a different font style, which makes the site look untidy and unprofessional. Keep the same fonts for all the sections and just change things like italicized and bold words.

I feel that there should be at least a space left for the cart to be seen at all times. I think it’s essential for the viewers to be able to see what they have already chosen with just a glance to the left or right of the page.

The links aren’t very user friendly either. There’s too much going on for novice users to follow.

I give this site 6 out of 10. Some nice features and the creator have obviously thought about the target audience and users with little internet experience. I do feel that the site has too much content spread over the pages, which is ineffective use of white space.

Site 3

iTunes store
First glance of this music store I could clearly see that new internet users would struggle. The amount of information that hits you on the first page is quite unbelievable. There are so many links and options it’s hard to know where to start. The site maintains good alignment though, as nearly everything is boxed together and neatly placed. Nice clear headers and the links are obvious due to their underline function when scrolled over. All the fonts are consistent throughout the site, giving it a clean and professional feel.

The rotating banners at the top are the first things to be seen. They show some of their newest items for sale. This not only includes music, but games and movies as well. I think it is a great way for advertising.

All the images seem to be in top quality and have been compressed perfectly so that they give a brilliant finish, and the loading times are pretty quick.

On a note I do find that the iTunes program itself runs quite slow, especially when playing tracks at the same time as searching through the shop.

Features
One of the great features of this store is its searching ability. The search bar is a simple one, but with the dark background colour it really stands out. The search also has a power search option, which is great for if you know exactly what you are looking for. The search also lists any popular searching options whilst you’re searching. This is great for easily selecting the word you want to search for without having to type it all in.

One disadvantage about this search feature is that it doesn’t have a button to click on for the search to activate. Many new internet users use that to start the search, and without it they would be lost.

Another feature is the tabs that appear. These tabs allow you to step back to previous pages without having to click through the back button several ties. You can instantly go back 2 or three pages with the single click of a button.

The rotating header shows some of the new stuff to iTunes and is a great way to grab people’s attention. It’s also something different so you never see the same things constantly on.

All the links are given their own header, so browsing for what you want takes minimal time.

Improvements
There is too much information on the home page. You get bombarded with information that simply could be removed or placed in a different location. There are also hundreds of links on each page; it’s really hard to find where to start. Removing unnecessary links and information and shuffling the content around would sort this.

There really needs some sort of search button for novice users, or a quote that says “Press return to start the search”. This would make the site more user friendly.

The large amount of information also means that users may have to scroll for a while before they find what they are looking for. The shuffle of things would sort this, as stated above.

I give this site 9 out of 10.