PROJECT THREE- MUSEUM WEBSITE

Research

With Muse, I was able to learn the basics to help me form a website. So firstly, I created a document with a fluid width of 1000 pixels wide, 20 pixel gutter and 4 columns. I was able to draw a rectangle over the header and fill it with a colour, insert a horizontal menu widget and was able to place and size an image on the site.

File Types

JPEG is a commonly used method of lossy compression for digital images, particularly for those images produced by digital photography. Usually not used for text or sharp edges and it does not support transparency.

GIF is more suitable for images with flat colour area backgrounds like cartoons and animations. Can be loaded very quickly to be shown and is usually repetitive. They also support transparency and they are lossy.  

PNG (Portable Network Graphics) is for raster graphics file formats which do support transparency 
and are lossless. Mainly diesgned for online streaming and work well with graduated colours.  

SVG (Scalable Vector Graphics) is created for the web to be a versatile, scriptable , vector format.  

Website Analysis

*The  Watford Museum webiste is overall quite bland and basic with no obvious theme. Each page has a different colour background which has no relevance to the other pages. The welcome page has little information. However, there are links to different pages of the website which suggests that the website designer made sure that the points they wanted to focus on within the site were noticed properly. They could improve the page by adding my images presenting the site and more information, like a summary, on what each highlight they mention on the page is about. Instead of having a separate page for a welcome message, I think they should have wrote this message on the home page so it's more interesting than having a faded picture of museum on the page. To save pages and collect information quickly they should have merged their visitors info page and welcome page if this message was going to be so short. It needs to be more eye catching and interesting to the reader and convince them why they should come and visit the museum and what they have to offer. At the moment, the website does not present this. They should have some GIFs to be able to show what they offer in an interesting way rather than just having images placed on the site. 



The Latest News page has lots of information about the most recent things happening in Watford Museum. They post about interesting local and historical events. They even have a email address to message if you'd like the updates sent to you personally. Which is a good way to communicate with the audience to find and get opinions of their website and service. It includes pages of people's work and free events for children and adults to attend to. What I would change is the background first of all because it does not match the rest of the website. There is no consistent theme which does not usually occur on other websites. Each page on this website is a different colour with no patterns or anything to show the consistency within the site. I would change the way the information is presented, I would change the way the images are shown and use GIFs to show updated pictures or timeline in the history. I would use videos and voice clips of people showing their expertise in different.    

The activities page shows different types of activities available in the museum. However, like the latest news page the information is outdated by about 2 years. The colour is still very basic with no pattern. it is poorly presented and it looks like their target audience is for elderly people with the majority of images about elderly people. The pictures have very bright and eye catching colours. What I would do to improve this site is to add different patterns and add a theme to the page as none of the pages are corresponding. As this website is poorly presented this shows how they do not have much sponsorship or funding to help improve their appearance and help them become more well known. 

*http://www.watfordmuseum.org.uk/

**The Natural History Museum (NHM) has a very gender neutral theme and doesn't use colours which are hard to see and read for people who have difficulties of reading. They should have an audio option so they are able to hear the text making the website more accessible for everyone. They have up-to-date articles and it seems like their target audience are young children or people interested in natural history. The sliding articles have contrasting colours against the main theme of the website and have a good use of bright primary colours. What I would improve is having audio to impress the audience even more for example, having a snake hissing every time you hover your mouse over the image or the image turning into a video to make the website even more interactive and appealing towards the audience. Both website could be more diverse by featuring more people with different ethnic backgrounds on their websites. NHM address their audience with simple direct language as if they are talking to children which is good. However, it is more likely for they're parents to read the website meaning that the language should be a bit more advance for the majority of adults reading the website. To improve, they could make a children's version of the website with the same information but, a different way of presenting the information so children can understanding it more.

The NHM carries on having the same neutral theme by having bold primary colours around the site. Having multicolored birds as the main image shows the diversity within the site and the museum in general. It contrasts with the orange theme on the page as it is a plain dark colour and the birds are bright which can be seen as different personalities shown throughout the museum when visited. Again, it uses language children would understand and relate to and would slightly make the adults feel undermine because of how the website is portrayed. Using the children website idea would work because it benefits young children and adults using the website. The page is very calm,not plain with lots of information which branches out to other sub pages which are obvious to click on. Pictures are child-friendly which is helpful for children to know what they are looking forward to and parents to know what their child is going to do.

**http://www.nhm.ac.uk/visit.html


Analysing Audio in Advertisement

***To understand which audio would really help make my website go further and more accessible; analysing an advert will help me understand what is really needed for the website to work and how the audio should be used. Firstly, I chose this advert as this was a popular advert in 2016 promoting the use of the app 'Just Eat'. It is targeted at people who order fast food and offer an alternative way to order food quicker than before. I believe this was a successful advert because of the song they used. They used an old 90's songs called "Everybody (Backstreet's Back)" by Backstreet Boys which was a success and is still recognisable to this date today. They used the song to know that people would sing along to the song, especially as they make a parody of the song, the audience would like it more because of how they changed it up to make it relevant to the company. Beginning of the advert they are all sitting down while the TV is on loud and making noise which is a diegetic sound because it is actual sound that would come out of any TV. Going into the advert when the first guy starts singing, They use a non-diegetic sound to let the audience know that the scenery has changed. The use of the sound helps create this dramatic effect as if they are actually performing when they are really in the living room. The sound also suggests that they going to pretend to be the band [Backstreet Boys]. The use of auto tune on all their voice connotes that this is definitely a parody as their voice, clothes and music change. During the advert, one of the men say "king prawn chow mien" in a lowered voice which shows a lot of auto tune placed on it for effect. 

Different Types of Microphones

Dynamic microphones

• Construction is simple and comparatively sturdy. 
• No power supply is required.
• Relatively inexpensive.
• The Dynamic Microphone is a good all rounder microphone which can be used for vocals, recording drums as well as guitar amps
• Most common types are the Shure SM57 and the Shure SM58
• Overall a dynamic microphone is a sturdier and more reliable microphone option for those who play live, record their vocals or guitars at high levels and swing their microphones around due to the fact if you drop them they’ll be fine.

Condenser microphones

• Good sensitivity at all frequencies. 
• Power supply is required. Ideal for recording vocals or acoustic guitars
• Perfect for precision recording and capturing subtle nuances on pianos or acoustic guitars
• Very sensitive to breathing and “popping”
• Not suitable for high volume recording i.e. a guitar amp
• Condenser microphones are extremely sensitive and due to the fact they use a conductive diaphragm which vibrates with sound pressure and uses capacitance to create the audio signal.

Ribbon Microphones

• Extremely sensitive microphone
• Great for vocals, choirs, piano, strings, and woodwind
• Perfect for recording multi-instruments in a room
• Often described as a more vintage vibe
• Can be quite expensive
• Ribbon mics are for the recording connoisseur (and those with a little extra funds to spare), and often those who want a vintage sounding vibe to their recording. 

****

Planning and Pre-production

Part of the work is to add an audio to our website which could be anything related to the website. I experimented with adobe audition so I know how it works around and what I could do to edit files to make the audience be able to access them to listen to for them to catch up on more information. I learned the different functions like to create a new multi-track and to add effects to a clip. Also, to make a certain part of the clip louder than the rest which is useful for when you have someone talking into the mic and they move away so you can't hear them, you can adjust that certain part of the audio to match the rest of the audio so the audience isn't having a hard time hearing information; especially about the watford museum and its history. Using an iphone to record the audio was easier to use than professional equipment. Even thought I would have like to record the audio with professional equipment, there was none to hire when it was time for me to record my audio section therefore I had to use my iphone. I would have preferred to use a dynamic microphone because it is known to be more reliable and more useful for vocal audio. 
  

So to start off the website, I experimented with photoshop to start making website banners for the museum website I am making. I came up with this idea as it work with a theme to have dark colours on the website. Especially , with people who find it hard to see, I thought about making it simple, yet effective. I thought that making it simple would be easy to recognize so the audience or customers would be able to easily recommend visiting to friends and family. Originally, I planned having a colourful background making it unique and memorable. However, I could have difficulties placing on the website firstly, making it web safe to use. It would have to have web safe colours so I wouldn't have a problem placing and advertising the images and colours on the internet. Secondly, I would have trouble making it accessible for everyone. Especially, people who have difficulty with their sight might find it to bright and flamboyant for their sight. I figured that if I find colours which matched which weren't too bright or dark and was easy to see for everyone viewing the site. I ended up with this yellow/green colours with a white to black fade design because it would make it very recognisable and easy to read. A connotation of lime green colour used is growth. This website shows the history of Watford and shows the growth and development within the town with the images and information shown suggesting that lime green should be a good colour to represent the website and to be presented on the site too. The banner was originally pratcie with the size and colour etc. However, I thought about how it would look on other devices like tablets and smart phones and figured it would need to be smaller or adjustable to the users screen size.  

So for my first design I decided to keep the colour theme and have lime green to surround the text and the background too as it matched the website banner. Originally, I thought this was a good idea but when I asked some students in my course; they suggested that it was a nice idea but overwhelming the whole site and I should have some variation of colour on my site to look better and not make it look so much as an eyesore. I made the picture of Watford Museum faded because I didn't want that to be the made attention and the picture is so detailed. At this point in the project it was very boring and nothing really added on the the rest of the pages because I was still trying to make my plan work. I figure that the lime green background only suited the banner so I'll see what other colour suit the background and I'll experiment on the software muse or I'll search about different colours that might match or go well with the colour scheme that I have.

After, I'd experimented with different colours and I came up to the conclusion that having a white background with a dark banner and footer would not make the page overwhelming to look at. I also realised that the navigation bar was longer than the banner so when going on a larger screen it would very odd. I was able to adjust the size and get the banner and navigation bar to be responsive with the size of either the screen or the browser size. I wanted to have the museum features on every page of the website; slightly fade so it is not the main thing the audience pays attention on. I researching on different audios to add to this page and I figured that I would use a voice over, which would have the option of turning it down or off, mainly there for people who are hard of hearing so it can be accessible for them to use the website or, for people who have difficulties with their sight so they can have the chance to be able to access the information. I added social media and sponsors on the footer which converts to the conventions of a website because usually all websites have their sponsors or available social media accounts on the footer of their websites. I still need to add my images because at this point it looks quite boring and bland.

Originally, I wanted the all the pages to differentiate from each other via images presented on them. I thought about what would usually go on a contact us page on a website. When doing my research, I thought about what they two websites have in common. I figured that they would need the detailed presented in a easy way to read. All the  websites included a map. I am going to modernise the website by adding google maps onto the site instead of making on and scanning it into the computer to put on the page. Adding google maps will be easier because the audience would be able to adjust the map and move the map to however they like to plan routes on how to get to the museum. I am going to add a contact us box so it helps people gather information and collect the information right from the museum so they know it is reliable. Adding these function, will help the run the website as smooth as it can and would help the audience/costumers/visitors feel comfortable using the website. 

For the audio aspect of the project, I recorded my friend reading the text on the home page. I recorded the audio with my iphone and placed it into adobe audition. If I was to do this project again I would make sure I had enough time to find out what microphone to use to get the best sound. Using an iphone to record was more compatible for myself as I know how to use and change the files already.  I realised that I needed to change a few things about audio like the volume. So I placed the recording into a converter which would have allowed me to change the file type so I would be able to work with it and place it in audition and muse. After converting the audio and placing it in to audition, I was able to change the decibels to turn down the loudless so I wouldn't be overwhelming for the person listening. By adding audio I have been able to make the website more accessible for the audience and visitors involved. After making changes in audition, I had to add the audio onto muse. What I had done is downloaded an audio widget player from the adobe website so the software would be able to play the audio which is saved as a .wav. 

My history page consists of information about St Mary's Church, Watford Market and Cassiobury House. I looked on the watford website to find images about these locations on their website. My next step is to change the background so the writing is easier to see. By doing this I would be improving the accessibility  

To make the audio wave file more interesting I decided to multi-track my original watford recording with royalty free and copyright free music I downloaded from Youtube Audio Library. Using the file "Mirror Mirror" from https://www.youtube.com/audiolibrary/music I used  50 seconds from the music file and I uploaded it to audition. How I was able to use ducking and fading to create the file now is that I selected the music file and I applied effects amplification and compression then dynamics processing. 

From going onto dynamic processing I changed point 1 to -20 decibels to try it out and see the effect of that. My final decision was to use a preset of soft limit -24 decibels =. I figured it was the right decibel because it wasn't too loud or too quiet when I had my computer volume at half way 50 decibels.  I did experiment different decibels to see how I could make it more obvious so I kept on changing the decibels to see what difference it would make but the image which is shown is the final decision in what was going to feature on the website.  Afterwards I created a new audio route called a send. It sends the voice-over into the side-chain of the dynamics processing effect, I selected the track and added the side-chain > Dynamic Processor. I tested the track and I developed a skill on how to duck a voice-over on adobe audition and uploaded it onto the museum website on the home page.

So after I made the track and played it over to see if there were any mistakes, I thought about how long it needed to be for the home page and how it should end. So what I had done is made the track shorter from 3 minutes to 50 seconds and I had made a fade so the ending of the track can be clearly heard and the audience would know when the track has ended 

. The Final Product

Home Page

Contact Us Page

Watford History Page

Watford FC Page

The Cassiobury Collection Page

Evaluation

Introduction

The objective of this task was to create an improved website for Watford museum featuring our own photos, audio and research. Using the research I was able to show an understanding of what needed to be improved about the current website now. I was able to show my understanding of coding for example, using html tags and how to use that practice upon the website I created and able to improve my skills on adobe muse to create the website as well.

Research

During this task, I was able to produce different types of research to show my understanding of the website. I had done some research on how muse works and I was able to learn the basics to help myself form a website, this helped me develop my skills with muse and start off having the main basic features of conventional website. I had done research on file types and which ones would be appropriate to use on the website.  My primary research was to go to Watford museum myself and take pictures to feature on the website. By doing this, I am able to find out more information about the exhibits. Also, recording some of the information either by taking pictures or recording the information by video record to present accurate facts to the public.  Using the primary research helped me to understand more about the visual codes of a website. What I would have done differently to collect better primary data is to collect more information about some of the exhibits especially on Watford FC and The Cassiobury Collection so I am to differentiate the information from the original Watford website and the information I collected myself. Also, I would improve the quality of the photos by getting a better high quality camera instead of a smart camera to take the photos.  My secondary research was to analyse the original Watford Museum website with a bigger well known museum which was the Natural History Museum (NHM). What I had learned about the two different websites is that the Watford Website was very basic and bland. It looked like it hadn’t been updated for ages. It showed little information about things. In contrast, the NHM had lots of information and was very colour and had an obvious theme to show. I thought about what I could add from both websites to improve my website. I believe adding an obvious theme and simplifying the language used would help vary the audience from young children to the elderly. I added audio to help have more accessibility on my website. If I had more time I would be able to add more audio on each page and not just the home page. Also, I would have researched more about the different microphones I can use to make the speech more clear and crisp. I would definitely have the same person talking on every page. I would not have the volume of the speaker too overwhelming because that would make people turn off the audio. I also analysed audio in an advertisement. Overall, I think I had done significant research to start planning the website and choosing what needs to be involved and what doesn’t need to be featured.

Planning and Pre-Production

For the planning and pre-production of the website. I experimented on audition and used sample tracks and audio to help me to get used to the way audition works so I could add audio to the website fairly quick and easy. I believe that experimenting on audition helped a lot because I would have been wasting valuable time trying to work the software while that time could have been done improving the site. I also made a plan about what my ideal website should be. It was a very rough version and what I should have done is created a neater version and posted it on the blog. I should have posted more about the steps on how I came up with the design using a trial and error method. During planning the website, I was doing a lot of trial and error on the website for example, at first I decide to make the webpage a lime green colour because I thought it would help match the banner but then I thought about how the colour might make it hard to see the fonts and images so I changed the colour to white. I believe that if I had more time I would have created more themes to feature on the website and think about the conventions of the theme of the website to see if it conforms, subverts or develops, them. Analysing audio in an advertisement also helped as it helped me plan the different types of microphones I could use. Also, different types of effect like how the music video included a lot of auto tune and diegetic sound i.e. water pouring onto one of the men. I made me think about any effect that I would like to add into the museum. I thought about how that could affect the visitor and how they would want to turn the music off. So the audio had to be useful so I decided to add a voice over reading over the home page audio. This would help people with problems with their sight as they would be able to listen to the information presented on the page. If I had to do this task again, I would change the way I present information as on some pages it is very readable by having enough space between paragraphs however, on other pages it is very clustered or the image behind is very dark. What I tried to do to fix the problem is to make the image behind fade into the white background so the writing is readable while you can see the background image. I thought this was effective because everything was made clearer. I also had a problem with the social media links as Watford Museum had social media but looked like they were inactive and not used. Also, viewing in internet explorer did not show the Facebook, twitter or the google maps. As I couldn’t do much I made google my default browser as Google Chrome is the most popular web browser according to Gizmodo and ZDNet. Therefore, more people would be able to view the features on the website. I found that muse resources helped me find widgets that I could add onto the website like contact us box and the slideshow however, some of the widgets I wanted to add I found difficult due to my experience with muse. What I had done is looked on YouTube and Google to search for tutorials to help me add the feature and I found that I was able to add much more then what I could before because of those tutorials. Overall, I believe that the planning and pre-production stages could have been better because I should have posted more about the steps I took instead of taking pictures of the next to finished product. Also, to feature everything I done as I didn’t have enough time to post everything I had done and to explain what I had done a little more instead of it being brief. Another  challenge I had is that when I recorded the audio is that when I first listened to the audio it was very loud because I placed the Iphone microphone too close to the speakers mouth. How I solved this is that I converted the MPEG-4 file into a MP3, using an online converter, and uploaded the file onto adobe audition and adjusted the decibels and made the audio quieter. Then converting the MP3 file into a Wave file I placed the audio into a muse audio player. What I would do next time is to a trial and error and see how the same audio sound with different effects featured so I know what makes the audio clearer. Using the iPhone microphone was more convenient for myself because I was felt more comfortable working with an iphone but I know for future reference I should use more professional equipment for better quality sound.  During the production I figured that many people would want to know more information about any images so for that I hyperlinked most of the images presented and made sure it opened to a new tab so the audience could easily get back to the site.

Product

My target audience is mainly for everyone who is visiting the museum or anyone wanting to know about Watford’s history. My website doesn’t really represent any certain group or ethnicity because they don’t feature any visitors on the website. If I did feature anyone, I would have many sure it everyone from all different types of ethnic backgrounds to represent the diversity of Watford. I believe that this website conforms to the conventions of a website as it includes a banner of the place which could be considered as a logo, all the sponsors and social media is placed on the footer of the page, easy to use navigation bar and separate sections of the website to present information in a small and easy to access segment. It converts the conventions by having the option to listen to what you’re reading making it more accessible to the audience visiting the website. Some websites have the feature of audio. Also, by having a google maps and contact us box, that differs from other websites because some just have their details posted and viewers would have to go into their emails to contact, however my websites offers quick and easy access for communication and responses back to the viewers email. The website is a little dark which subverts the codes and conventions because most websites are bright and eye-catching. I made it dark to help it to become readable to people with problems with their sight. I believe that I could have done more work adding more audio to pages and adding more people enjoying the facilities that Watford museum have. I added hyperlinks to the images of the sponsors to make direct links for extra information about who is sponsoring the museum which informs the visitors about how their council's money is being spent. I have added rollover to each picture on the website to help people with a better description of the image. I used an Iphone to record the audio on the home page as it was convenient and easier to understand and use in a short space of time. I believe it was able to record everything and the only thing I had to alter on the audio was how the volume was loud so I lowered the decibels on adobe audition, I used an Iphone because all the professional equipment at the time was being used and had been hired out meaning that an Iphone was what I had to use. If I had to do this project again, I would make sure I would take more time to produce better audio and be more prepare just in case I have no time to hire any professional equipment.

Bibliography 

*http://www.watfordmuseum.org.uk/

**http://www.nhm.ac.uk/visit.html

***https://www.youtube.com/watch?v=7ClI2bp__Bs 

****http://www.yamahaproaudio.com/global/en/training_support/selftraining/pa_guide_beginner/microphone/

*****https://www.youtube.com/audiolibrary/music