Final evaluation
Upcoming SlideShare
Loading in...5

Final evaluation






Total Views
Views on SlideShare
Embed Views



2 Embeds 75 43 32


Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Final evaluation Presentation Transcript

  • 1. Final Evaluation Laura Edwards
  • 2. Sounds
  • 3. Examples of Sounds – Edited Versions Beat 1 Drums Piano 1 Beat 2 Guitar Piano 2 F e m Beat 3 Sound Effect Piano 3 a l e V Disco Effect 1 Female Vocals 1 Recorded 1 o c a Disco Effect 2 Female Vocals 2 Recorded 2 l s Disco Effect 3 Female Vocals 3 Recorded 3 4
  • 4. Full Ejay Song Full Ejay Song Unedited
  • 5. Sound Log Sound Description Obtained FormatBeat 1 Sound of drums being played to a Made in Ejay WAV fast rhythm with a base in the backgroundBeat 2 Sound of another fast beat, Made in Ejay WAV similar to the firstBeat 3 Sound of drums being played Made in Aviary WAVDisco Effect 1 Sound of a whiney disco effect, Made in Ejay WAV played by a keyboardDisco Effect 2 A fast sound played using a Made in Ejay WAV keyboardDisco Effect 3 A disco effect similar to the first Made in Ejay WAV disco sound effectDrums 1 A jazzy drum sound effect Downloaded from WAV Royaltyfreemusic.comFemale Vocals 1 Female singing Made in Ejay WAVFemale Vocals 2 Female singing Made in Ejay WAVFemale Vocals 3 Female singing Made in Ejay WAVFemale Vocals 4 Female singing Made in Ejay WAVGuitar 1 Guitar playing a cool western Made in Ejay WAV sound effectGuitar 2 A cool music track played by Made in Ejay WAV guitarGuitar 3 A nice soundtrack played by Downloaded from Spotify WAV guitarPiano 1 A few keys played on a piano Downloaded from Spotify WAVPiano 2 A nice sweet sound effect of keys Made in Ejay WAV being played on a pianoPiano 3 A nice little music track made by Downloaded from WAV playing a few keys on a piano Royaltyfreemusic.comRecorded 1 Sound of hands clapping Recorded using a webcam WAV microphoneRecorded 2 Sound of a whistle being blown Recorded using a webcam WAV microphoneRecorded 3 Sound of someone wolf whistling Recorded using a mobile phone WAV voice recorderSound Effect 1 A cool sci-fi sound effect Downloaded from WAV
  • 6. Sounds Made In EjayBeat 1 WAVBeat 2 WAVDisco Effect 1 WAVDisco Effect 2 WAVDisco Effect 3 WAVFemale Vocals 1 WAVFemale Vocals 2 WAVFemale Vocals 3 WAVFemale Vocals 4 WAVGuitar 1 WAVGuitar 2 WAVPiano 2 WAV
  • 7. Sounds RecordedRecorded 1 Hands WAV ClappingRecorded 2 Whistle WAV BlowingRecorded 3 Wolf Whistle WAV
  • 8. Sounds Made In AviaryBeat 3 Aviary WAV
  • 9. Sounds Downloaded From Royalty Free Websites Guitar 3 Spotify WAV Piano 3 Royaltyfreemusic WAV .com Sound Effect 1 WAV Drums 1 Royaltyfreemusic WAV .com Piano 1 Spotify WAV
  • 10. Making Sounds
  • 11. Making Sounds In EjayDance Ejay 5:• Dance Ejay 5 provides a new dimension in music creation. The program provides an incredible new interface and the first-ever 3D engine, plus a whole multitude of brand new features. However, Dance Ejay 5 still remains easy to use, in order to inspire the flow of musical creativity. The programme provides 5,000 brand new royalty-free dance samples to choose from, providing music samples from trance, techno, house and dance genres. The whole spectrum of dance music is covered.• Along with these features, Dance Ejay 5 also provides new features such as a polyphonic synthesizer, the “Grove Generator” (a drum computer for programming drum loops), Chord Generator and Bass Generator.
  • 12. Song/sample track Dance Ejay 5Samplesof royalty Backgroundfree graphicssounds Control panel
  • 13. Making Sounds In Ejay I dragged the sound samples from the library to compose a song. Instead of making individual sound samples, I decided to make an entire song, and then edit the track down to capture individual sound clips that I could incorporate into the website. By making an entire soundtrack instead of making individual sound files, I made sure that the sounds would work well together. By making a whole song and then editing it down, I made sure that the sounds work well together. This works better than just making different individual sounds, since the sounds can work together to make a song. If I had just made individual sounds then there would be the possibility that the sounds would sound jumbled and messy when they were put together in the website.
  • 14. Making Sounds In Aviary Another method of making sounds that I used was making sounds online through Aviary. Aviary provides a multitude of different functions, such as vector editor, graphics editor, music generator, music editor, etc… Aviary may have a slightly more complex interface than Ejay, however, I can still use this program in order to create suitable sound beats. The sounds that I made were done through registering online. Sound libraryMusic soundtracks along an edited timeline Imported sounds
  • 15. Making Sounds In Aviary The sound maker in Aviary is only used for making drum beats and making music loops, therefore there are limitations in using this method. I can only make drum beats in aviary, therefore this won’t be the primary sound software that I will be using. I will be mainly using Aviary for editing sounds.
  • 16. Ejay & Aviary• Ejay and Aviary are essentially the same program, since they both follow the same basic principle when it comes to making music.• Aviary is essentially the better program since it comes in a package that includes a graphics editor, music editor, etc… However, the two programs both work in the same way.• For instance the programs both provide a library containing a multitude of royalty free sounds that can be used to make a sound track. Also they give the user full control over their music.• However, Ejay was the primary website that I used to make sounds, as I only used Aviary to make one or two sounds. At the time I wasn’t particularly used to Aviary as it has a more complicated interface than Ejay, therefore I only used the program as a means of experimentation.• Incidentally, I wanted to provide a variety of sounds, therefore I also wanted to provide a variety of ways of making and recording sounds. The way that I have done this has been for experimentation purposes as it has all been about finding out different means of preserving sound quality, which means that I wanted to try different recording methods to see which method worked best.
  • 17. Recording Sounds
  • 18. Recording Sounds• I recorded three sounds using a voice recorder, which was also used for recording the help file for the website.• I recorded the sounds using this simple voice recorder, and then uploaded the sounds on to a computer for editing. The final sounds have been saved onto a computer as WAV files. The voice recorder automatically saves the sound files as WAV files, therefore when I upload them onto the computer I can then convert the sounds to MP3 files.
  • 19. Recorded SoundsRecorded 1Recorded 2Recorded 3
  • 20. Problems With Recording White noise is random signals capturing during recording. White noise is made by combiningWhite Noise different frequencies of sound together. For instance, during a recording a person’s voice can be recorded as well as background noise. White noise is made by the different between these two frequencies of noise. Sound studios sound proof their recording studios so that no background or low frequency noises are captured during the recordings. This is a method of preventing white noise. Because white noise is made up of different noise frequencies, white noise can also be problematic as it drowns out or masks lower frequency sounds. White noise prevents the recording being clear and sharp.
  • 21. Other Method Of Voice Recording Quality controls Progress bar Record buttonAviary can also be used to record voices, along as you have a microphone on your computer. To startrecording, click on the “Record” button. This will then open the option box as appears above.Note, before beginning the recording, test the microphone. An easy way to see if the program isworking is by speaking to the microphone and checking whether the speaker bar goes up and down.In this feature you can also adjust your volume and reduce the echo.When you start properly recording the progress bar will gradually fill up, showing how much time youhave left during your recording. The current time available for all recordings is 2 minutes. If you requiremore time then you will need to start another recording and then join the two together in Aviary’s soundeditor.
  • 22. Editing Sounds
  • 23. Editing Sounds In Ejay I made one song in Ejay and then edited it down so that I could get parts of the song to use as individual sounds. The reason that I did this is to make sure that the individual sounds can be mixed together to make a suitable song. To get individual sounds for this I saved the main song, reopened it into a new Ejay file, and then deleted different elements of the song to get individual sounds.
  • 24. Editing Sounds In Ejay For example if I wanted to make a sound of just the vocals then I reopened the original song file, deleted out all of the other elements of the song, and just kept the vocals. For example the vocals in yellow were the part of the song that I wanted to keep, so every other sound file I deleted. I then saved this sound file as a new file and labelled it “Vocals 1”.Part of the vocals that I wanted to keep I then repeated this process until I had all the sound files that I needed.
  • 25. Editing Sounds In AviaryTimeline Imported song and “Import” sidebarImport the sound file into the program by clicking “File”, “Import” and then followingthe procedure to upload your files. Note that if you select “Everyone” from the dropdown menu, when the options box asks for the security settings, this setting willallow everyone on the internet to see the sound file.Once the file has been imported it will show in the “Import” sidebar, which will allowyou to drag the clip onto the timeline.
  • 26. Editing In Aviary Adjustable optionsEditing thesound in realtime Effects drop down menu I recorded this sound, therefore it needed editing and fine tuning in order to be used in the website. For instance, there was a lot of white noise within the clip and the volume was low. Aviary provides a convenient feature called: “Parametric EQ”, which allows you to fine-tune your recording. To use this feature, open the “Effects” window in Aviary by double clicking your sound recording. From the first drop down effect, pick “Parametric EQ”, which is displayed in the print screen above. You can play the sound as you are adjusting the settings in order to test out the different effects in real time. In this example, the lower frequencies of the sound needed to be boosted whilst the higher ones needed to be lowered in order to balance out the sound nicely. Once finished with the effects, click on the “Apply” button in the bottom right hand corner of the window to apply the effect to the sound.
  • 27. Editing Sounds In AviaryThe sounds that I made and recorded needed to be edited down and reduced in order to be suitable for thewebsite. Some of the sounds either needed the ends trimming or the pauses in the recordings need to bedeleted, so this is where the “crop” or “trim” option becomes most effective.To “trim” a click, I hovered the mouse over the top corner of the clip (as shown above), where a smalltriangle icon will appear. Then I dragged the icon down to the part of the clip that I wanted “cropping” or“trimming”. Then drag another triangle icon to the end of the clip, and this will then clip the sound.I then deleted the part of the clip that I had trimmed to get rid of it.
  • 28. Saving The Sounds In AviaryWhen saving sound files in Aviary, you can click the “Save as” option,however this will not export the sound as an MP3 or a WAV file. Therefore toexport the sound file, save the file and then click the “Mixdown” option whenit appears after clicking “Save”.The “Mixdown” option will then flatten the sound so that it is no longer onmultiple layers, and this will then allow you to download the song as a MP3or WAV file. This is for listening to the song outside of Aviary instead ofhaving the file saved as a regular .Egg file to use when editing in Aviary.
  • 29. Original Sounds Compared To Edited Sounds
  • 30. Comparison [Videos]Original Recording Edited Recording
  • 31. Comparison 2 [Videos]Original Recording Edited Recording
  • 32. Comparing Full Song To Individual Sounds Original song [video] Individual sounds
  • 33. Editing Obviously the original recording isn’t clear and has a lot of white noise. Also the whistle is repeated which is unnecessary for the website, so I need to trim the sound as well as reduce the white noise. I edited the sound in Aviary and used the “Parametric EQ” feature in the effects option. I used this feature to –not completely get rid of the white noise – but to reduce the lower frequencies completely and raise the higher frequencies. This reduces the background noise and makes the whistle sound sharper and clear. I also cropped the sound down so that I just had the sound of one whistle instead of two.
  • 34. Technology & Programs
  • 35. List of Programs Used Photoshop CS3/7 For Image Design Aviary For Sound Editing Dreamweaver CS3 For Site Design Dance Ejay 5 For Making Sound
  • 36. Creating Image - Tools
  • 37. Making The Graphics Interface
  • 38. Creating Image
  • 39. Graphic InterfacesDesign 1 Design 2
  • 40. Graphic Design 1Why I Chose Design 1:• Personally, I think that Graphic 1 is better, for the simple fact that it provides so much more material that I can work with. Meaning that I can incorporate more than one genre into the interface by providing a variety of instruments. (Guitar and drums connote rock genre, whilst having disco sound effects connote dance or techno.) I can include dance music into the interface by mapping disco sound effects to the images of the flowers.• Graphic 1 provides much more material than Graphic 2, such as: – More colours in the colour scheme – More instruments available – Bigger image – Blends well together• However, Graphic 2 is still a good image to work with as it is more specific to theme. Yet, I still feel that despite Graphic 1 only attracting a female audience, Graphic 2 would attract a niche audience, since people who are only interested in Jazz music would be drawn in by the website.• Incidentally, this is what makes Graphic 1 significantly better than its counterpart, because it adds more variety as it can attract audiences that are interested in more than one genre.
  • 41. Image ProductionRough Image First Draft Final Image
  • 42. Producing Website In Dreamweaver
  • 43. Producing The Site The beginning stages of making the website are very basic and simple. Firstly, I started by opening Dreamweaver and then created a new HTML file. This creates a basic, blank webpage that I can easily work with. The website that I am creating doesn’t require the use of side bars of banners, therefore I don’t require the use of a CSS or any other forms of templates.
  • 44. Basic Setup Of SiteThis acted as the basic setup for my website. Once the newHTML document had been created, I selected “Insert”, “Table” andthen added a table with the dimensions “3x3”. The centre squarewill be where the image will be located, and the surroundingsquares will acted as placement guides for the borders.The website with have a basic square structure during finalproduction, but that merely adds the overall simplicity.
  • 45. Final WebsiteThis is how the website turned out in its final stages via following the method of using a basictable to organise the different components. As you can see this method has saved me some timeand effort, as I haven’t wasted time merely trying to place the components in the right positions.The basic table has helped me to place borders and a banner around the central image.The overall website may come off as blocky and rigid, however, it merely adds to its simplicity.After all I am not focusing on attracting an older and mature target audience. The website will betargeting children aged 11 and under. Incidentally, I am focusing more on the quality of soundsand how easy the interface is to interact with, rather than its general appearance.
  • 46. Image & Website Dimensions Image Dimensions Height: 1000 px Width: 800px Website Dimesions Height: 1339 px Width: 408 The website’s dimensions have increased in comparison to the image dimensions since borders and banners have been applied, which account for the extra pixels. However the image contained within the website still has the original dimensions attached to it.
  • 47. Average Website Dimensions Smallest screen size: 800x600 Average (Most Popular) screen size 1024x768 Largest screen size: 1280x1024
  • 48. Average Dimensions Compared To My Site • My website will aim to fit around the 1024x768 mark, since this is the most popular screen size. • According to research around 79% of people who own a laptop or PC have a monitor size of around 1024x768 • Therefore my website will be aiming for these dimensions in mind since this screen size appears to be the average –if not the most popular dimensions for computer monitors.
  • 49. Average Disk Space & Bandwidth• 5GB of disk space with a 100 GB worth of bandwidth should be enough space for an average size website.• If I upload my site to a website host then the website would cost me roughly around £4.95 per month.• If more disk space or bandwidth is required then I would have to transfer my site to another account – one that would support a website that exceeds the average bandwidth.• The only disadvantage to this method would be that if I decide to improve my site, or add more to it, then obviously the bandwidth and the amount of disk space needed would go up, which means that I will have to switch to another internet hosting company, which could charge me extra per month.• The average payment for large websites or grouped websites would be around £65 per month.
  • 50. Adding Hotspots
  • 51. Creating Hotspots ForWebsite – 7 StepsStep 1 – Add an image to the website
  • 52. Creating Hotspots ForWebsite – 7 StepsStep 2 – Click on the image to highlightit. From the properties menu, click onone of the three hotspot drawing tools– rectangle, circle or polygon.
  • 53. Creating Hotspots For The coordinates for each point withWebsites – 7 Steps be recorded in the HTML code.Step 3 – Select the right tool and thendraw the shape you want on yourimage.
  • 54. Creating Hotspots ForWebsite – 7 StepsStep 4 – In the properties window forthe hotspot, type in or browse to thepage that hotspot should link to. Toadd a sound, click on the behaviourspanel, by selecting Window ->Behaviours. Click Add A Behaviour andthen scroll down to: Play Sound.
  • 55. Creating Hotspots ForWebsite – 7 StepsStep 5 – Browse through files andfolders and select the sound that youwant to attach to the hotspot.
  • 56. Creating Hotspots For In this case I want the sound toWebsite – 7 Steps play onMouseOver, so when theStep 6 – Add the sound that you want mouse hovers over the hotspotto attach to the hotspot. Select howthat sound will behave from the drop the sound will play.down menu.
  • 57. Creating Hotspots ForWebsite – 7 StepsStep 7 – Save progress, and check thatthe hotspot works properly by pressingF12.
  • 58. Adding Sounds
  • 59. Adding SoundsAfter creating all of the hotspots for the website, I then needed to attach the sounds to the mappedareas. For this I simply clicked on the “Behaviour” tab, clicked “Add Behaviour”, “Play Sound” andthe browsed through my files to find where the sounds are located.In this example I added a hotspot to thefemale face within the image, therefore Ineeded to attach one of the sounds thatincluded a female singer.For this example I picked “Female Vocals4”, after browsing through my files andfolders, and then clicked “Ok” once I hadselected the track that I wanted.
  • 60. Adding Sounds & Selecting Behaviours After adding the sound to the behaviours list, I then made sure to select the correct “Behaviour”. I scrolled down the optional behaviours and then selected the “onMouseOver” behaviour. These activation behaviours describe how the sound will be activated when the user interacts with the website. For instance in this example, I select the onMouseOver feature, which indicates that when the user hovers the cursor over the selected area the sound will play. Of course, I can change the behaviour to make the sound play differently when the website is interacted with, for example I could change the behaviour to onMouseClick, so that when the user clicks the mapped area, the sound will play when the mouse is clicked, not when the cursor hovers over the area. I chose the onMouseOver behaviour because this is what I had original indicated in my plans and I wanted to stick to my plans as closely as I could. Also I feel that using this behaviour makes the website easier to interact with, fore if I had chosen the onMouseClick option then users might become confused about which areas they can click on and which areas they can’t.
  • 61. Testing Website
  • 62. Testing Website During ProductionObviously during the production stages I needed to make sure that the sounds and behaviours worked correctly. Forinstance, as I selected the behaviours used to activated the sounds when the website is interacted with, I needed tomake sure that these worked practically.To make sure that the website works, I saved all of my progress so far, and hit the “F12” shortcut. This then opensthe website in Internet Explore and shows you the website how it would appear if it were uploaded onto the internet.This also helped me to test the website so that I can make sure the hotspots are attached to the appropriate areason the graphics interface, as well as making sure that the sounds worked clearly and efficiently, and the rightbehaviours are applied.I have set up the website’s behaviours so that when the cursor hovers over a hotspot the sound plays automaticallywithout having the user clicking on the area.
  • 63. Skills I Have Developed
  • 64. Time Plan & Organisation 18/10/11 21/10/11 01/11/11 08/11/11 15/11/11 18/11/11 25/11/11 Rough Images Recording Sounds Editing Sounds Final Image Creating Website Applying Image To Website Applying Sounds To Website Finish WebsiteThrough consistent organisation, as evidenced by the time plan shown above, I have been able to work effectively and use time to myadvantage so that I can get the most out of lessons and out of outside work. I have stuck relatively within this time plan –if not I haveworked quicker- and have made sure that I have stuck to deadlines.This time plan was a rough estimation on how quick I could complete the work set, and obviously I have given myself a little bit toomuch time to work with –since I have completed the tasks before the final deadline that I have set.I think that these time plans are exceptionally helpful, as they give you a rough estimation of how fast you will be working. It also givesyou motivation to work with, as you are constantly checking the flow of your work, making sure that you are consistently organised andup to date with deadline. Simply put, it just helps you to organise your work that much more easier, so that you can be in full control.
  • 65. Improving Knowledge Of Using DreamweaverMaking Hotspots• Before I started this project I wasn’t familiar with Dreamweaver. I only had a basic knowledge of how to use the program.• I wasn’t particularly familiar with how to make hotspots for the website, however, now after completing this project, I can admit that I know how to add attachments, links and behaviours to a website.
  • 66. Improving Knowledge Of Using Dreamweaver• Another method that I wasn’t particularly familiar with when it came to using Dreamweaver, was the feature of using behaviours.• I experimented with the different behaviours in order to see which one would be suitable for the website and make it easier for the users to interact with.
  • 67. Knowledge Of Sounds• After completing this project I have developed and improved my knowledge of using sounds, their formats and how to preserve sound quality.• My planning and research shows how I have researched into the advantages and disadvantages of using sounds so that I maybe able to gain the full advantage out of my sounds.• By carefully planning and researching into sound files, I am able to use the best possible file formats in order to preserve sound quality.
  • 68. Knowledge Of SoundsExamples of planning and research that have helped to improve myknowledge of digital and analogue sounds
  • 69. Improving Knowledge Of Using Aviary• Before starting this project I had no knowledge of how to use the program Aviary. Also I had no knowledge of how I could possible improve sounds using Aviary.• The program exceeded my expectations and I found that it could help to improve sounds so that they have better quality than the original recordings.• My original recordings contained a lot of white noise and interference, and I was surprised how this error could be improved so easily by using Aviary. White noise is the main problem that corrupts sounds, however, I was surprised how it could easily be erased just by turning the low frequencies up and lowering the high frequencies down.
  • 70. Planning & Research
  • 71. Evaluation Of Mission Statement
  • 72. Mission Statement• "One Man Band" is a website designed to explore sound interactivity and how sound can be used within different media formats. Not only is the website designed to attract audiences aged 11 and above, but it is also designed to attract employers and to showcase my creativity and multi-media skills.• Incidentally, the main objective of the "One Man Band" website is to construct a simple interface that relies on visuals, such as computer graphics, to employ a variety of sounds that can be used both simplistically and help audiences to explore the uses of sounds. The simplistic visual interface will allow users to interact with visual objects, producing sounds on interaction. An example of this type of interaction, would be the user clicking on an image of a guitar and then hearing the guitar strings playing. Moreover, I could easily incorporate an example like this into a simple interface, however the music instruments that I will use will vary from genre to genre.• Furthermore, the "One Man Band" website will primarily act as a form of entertainment, not to mention also incorporating educational values into the website, for instance, audio based tutorials will be provided. Not only will the audience be capable of enjoying the website, but they will also develop understanding of how sounds can be used in a variety of ways, through creating their own music. Hopefully, the audience will develop on their skills, realise how music is made and understand how to use sounds effectively to create good quality music.
  • 73. Target Audience• After evaluating my “Mission Statement” I have made a basic outline of my target audience:• Age: 11 – 16• Gender: Female• Occupation: Student, High School Student• Demographic: E (unemployed, students in full time education)• Sexuality: Any• Ethnicity: Any• Interest: Needs to have an interest in making music, or have an interest in the music genre provided.
  • 74. Secondary Audience• The secondary audience would be anyone that has an interest in making music. It doesn’t have to be teenagers in particular, for instance, children below the age of 11 will be capable of using the website because of the simple interface.• I think that the general design of the website targets a young audience range because it is simple, basic and has bright and vibrant colours to make it eye catching. Because of the interface’s simplicity and the fact that there will be an audio based tutorial available, young children will be able to use this interface with ease.
  • 75. Evaluation Of Target Audience• "One Man Band" strives to attract a young audience range aged from 11 to, possibly, 16. This is the primary audience. Secondary audiences could venture as far as employers looking for examples of how sound is employed, or a study of multimedia elements, to older audiences looking for a form of entertainment.• Also, since the website primarily targets a young age group, the initial designs need to focus on how it will attract the audience. Simple, cartoonish graphics depicted using bright colours could be a method of interesting a young audience. Another, method of generating audience appeal, is through using a variety of sounds. Consequently by incorporating different musical elements into the website, it is elevating the website by showing uniqueness, meaning that the website wont be tied down to one particular genre.• Another focus point is the gender of the audience. Initially I will be focusing on attracting a uni-sex audience, which will help to deliver a product suitable for a wide audience range.• Moreover, acknowledging the age of the primary audience, the website needs to focus on simplicity rather than complexity. An overly complex interface would disinterest or possibly even intimidate a young audience range causing them to abandon the website. Obviously, the website needs to focus on entertainment value, for instance I need to include a variety of sounds and instruments that will keep the audience entertained no matter how many times they visit the website. Furthermore this sense of variety means that the audience have a wide range of options that they can explore, which means that in order for them to understand the different sound effects and genres of music, then they need to visit the website more than once. Consequently, this is a primary value of attracting a wide audience range as it could attract a more mature audience, whose sole interest is music based.
  • 76. Evaluation Of Draft Images
  • 77. Graphic InterfacesDesign 1 Design 2
  • 78. Graphic Design 1Why I Chose Design 1:• Personally, I think that Graphic 1 is better, for the simple fact that it provides so much more material that I can work with. Meaning that I can incorporate more than one genre into the interface by providing a variety of instruments. (Guitar and drums connote rock genre, whilst having disco sound effects connote dance or techno.) I can include dance music into the interface by mapping disco sound effects to the images of the flowers.• Graphic 1 provides much more material than Graphic 2, such as: – More colours in the colour scheme – More instruments available – Bigger image – Blends well together• However, Graphic 2 is still a good image to work with as it is more specific to theme. Yet, I still feel that despite Graphic 1 only attracting a female audience, Graphic 2 would attract a niche audience, since people who are only interested in Jazz music would be drawn in by the website.• Incidentally, this is what makes Graphic 1 significantly better than its counterpart, because it adds more variety as it can attract audiences that are interested in more than one genre.
  • 79. Image & Target Audience • The client has asked for the website to primarily target children as its main audience –aged 11 and above. Consequently, this has greatly influenced the design of my interface since I have gone for the more simplistic look (i.e. using bold shapes and grouping them together to make a basic interface). • Incidentally, the bright and vibrant colours that make up the background are going to be utilised as a means of catching the audience’s attention. The bright colours should be interesting for the audience and should be used as a way of expressing variety and excitement. The bright colours should make the design look funky and original. • Since I am attracting a more feminine audience rather than males, I have focused on colouring the graphic pink, purple and yellow, also adding a bit of blue to the array so that the colours will contrast well together. The blue and white only serves to represent that the secondary audience can be males as there is nothing preventing anyone from using the website if they want to.
  • 80. Image ProductionRough Image First Draft Final Image
  • 81. Evaluation Of Development Log
  • 82. Development LogMonth Date Key Events Tasks No. HoursOct Tues, 18th Rough Images Make two rough drafts 8 – Outside/ of graphic interfaces Homework and then decided which one to use, giving justifications for choiceOct By, Fri, 21st Recording Sounds By this date have all 2 – Class work sounds recorded to be 6 – Outside/ used on website HomeworkNov Tues, 1st Start Editing Sounds Edit all of the sounds so 2 - Class work that they are 2 – Outside Work appropriate for the websiteNov By Tues, 1st Finish Image Make a final copy of the 6 – Outside/ graphic interface to be Homework used on the websiteNov Tues, 8th Start Making Website Begin to make website 4 – Class work in Dreamweaver, since all components have been finished by this pointNov Tues, 15th Making Website Start applying the image 2 – Class work to the websiteNov Fri, 18th Making Website Start applying sounds to 6 – Class work the websiteNov By, Fri, 18th Finish Applying Sounds Finish off applying Class work sounds to the websiteNov Fri, 25th Finish Website Finish off making 2 – Class work adjustments to the websiteNov Fri, 25th Upload Website Start uploading the Class work website to the internet
  • 83. Development Log – Flow Chart 18/10/11 21/10/11 01/11/11 08/11/11 15/11/11 18/11/11 25/11/11Rough ImagesRecording SoundsEditing SoundsFinal ImageCreating WebsiteApplying Image To WebsiteApplying Sounds To WebsiteFinish Website
  • 84. Problems With Development Log• Looking at the time schedule, some of the tasks have been given more time than others, for example when applying sounds to the website, I have given myself more time to work with, since a lot of problems could occur at this point, such as programming could corrupt, or sounds could distort, etc…• I could probably do this whole project with shorter time constraints; however, I have given myself extra room to work in, just in case there are any problems along the way.• Note: that at the end of the time plan, my work will consist of class work projects rather than outside homework, which is due to the fact that I don’t have Adobe Dreamweaver at home, therefore I can’t work on the website outside of college.
  • 85. How I Have Changed My Planning & Research Do To Development Log• I was originally going to make the website in Adobe Flash in order to make the website a lot more professional, and “flashier” to work with. I was then going to import the Flash file into Adobe Dreamweaver as a template complete with rollover buttons that would help to improve user interactivity.• However because of time constraints and keeping consistent and organised with the development log, I didn’t have time to improve the user interface.• If I had more time to work on the project, then I probably would have improved on the interface by using other programs.
  • 86. Evaluation Of Sounds
  • 87. Considering Possible Sounds For this research I made a list of possible sounds that I could record and then tested and considered them in order to see if they would work well within my website.
  • 88. Sounds That Would Work…• All of these sounds taken and played as individual noises would not work successfully without being played alongside other noises. Natural noises, such as bird song, and background noises, such as traffic would not work well to make music. Sounds that would work to make music include short and easily recognisable sounds, such as:• Hitting metal posts, bins, bottles, tin cans, etc...• Rustling bags, tin foil• Slamming doors, hitting floorboards, tables, etc...• Sounds that create short plosive sounds could work well in a combination used to create music sound tracks, since they can be used to make certain notes and tones. A combination of different notes produced by hitting tin cans could create a beat.
  • 89. Sounds That Wouldn’t Work…• Unsuccessful sounds that could not be used to create music include sounds that are used as background noises. This includes sounds like:• Sounds of traffic, train stations• Peoples conversations• Natural sounds, the wind, leaves rustling, birds singing, etc...• These types of sounds would not work for this simple fact is that the noises are too random. For instance, the sound of people talking together could not possibly be contributed to making a rhythm, because the noises created wouldnt be regular. This is the same for noises like traffic. Incidentally, the noise generated by traffic would be loud and droning, which would be inappropriate to make music.
  • 90. How This Has Changed The Website Designs…• I found that the short sounds, such as hitting bin lids together or clapping, work well to make music because they work as single notes that could be combined together in a multitude of ways.• Therefore long sounds, such as background noise, wouldn’t work for the website, since it would be difficult for the user to stop the music if it were played on a loop and it wouldn’t work well with similar tracks.• These are the reasons why I decided to make my sounds as sort and simple as possible so that they could fit together and be combined in a number of different ways instead of sticking to one song or genre.• This will give the users more of a variety to work with rather than keeping the music to just one genre. For instance if I created a simple drum beat, the user could combine different elements of other music genres –such as dance, pop or rock- along with it. So it gives the users better options and more variety.
  • 91. Examples Of Good Sounds For my planning and research I looked at examples of good sounds and found that sounds used for alerts, such as ringtones and fire alarms are the most effective sounds to use. Hence this is another reason why I decided to keep my sounds sort as possible.
  • 92. Changes Between Planning & Final Production
  • 93. Changes In Interface Because of time constraints within the development log, I couldn’t work on the interface as much as I would have liked, and more importantly the interface didn’t turn out quite as good as I had planned. I intended for the interface to have flashing rollover buttons and have an interface that really showed that the user was interacting with the site. For instance, without the rollover buttons that I wanted to include, - as a user- you can’t really tell what you are interacting with, until the mouse cursors changes. This doesn’t prove to be user friendly as the user would have to be constantly watching the mouse cursor in order to determine what parts of the interface they can interact with
  • 94. Making The Interface In Flash & DreamweaverI originally wanted to make the website in Adobe Flash:1. Because I am more familiar with the program than Adobe Dreamweaver2. Because I can improve the interactivity of the user face3. And make the overall website look professional• However, as mentioned before, I couldn’t carry out with this idea because of time constraints. Therefore, if I were to do this project again, I would ask for more time, and probably experiment more with the different programs, perhaps combining the two programs together in order to gain the most out of the interface.
  • 95. Image ProductionRough Image First Draft Final Image
  • 96. Changes In Image Production • The client has asked for the website to primarily target children as its main audience –aged 11 and above. • Consequently, this has greatly influenced the design of my interface since I have gone for the more simplistic look (i.e. using bold shapes and grouping them together to make a basic interface). • However, I didn’t quite intend to focus on just a feminine audience, as the client asked for attracting children aged 11 and above –not specifying whether they wanted it to attract males or females. • I designed the interface hoping to include elements of pop and dance into the interface, therefore, I included a female singer and flowers, which serve as more feministic traits rather than masculine. • Also the colour scheme is made up of more pinks and purples therefore it serves to attract females even more. • The blue and white only serves to represent that the secondary audience can be males as there is nothing preventing anyone from using the website if they want to.
  • 97. Sounds Compared To Plan • As established from my planning, the sounds that I used as examples that I could have used, included sounds made from raw materials, such as bins, clapping hands, metal posters, etc… • However, in comparison to the sounds that I actually used in the website, there is an obvious different as I didn’t use sounds that were recorded from natural sources. • I decided that because I wanted to go for a more musical element that gave the user a sense that they were using proper music tracks I decided to scrap the idea of using natural sounds and went to working with music programs.
  • 98. Recorded Sounds Compared To Final Design Recorded 1 Recorded 2 Recorded 3
  • 99. Recorded Sounds Compared To Final Design• Because I thought that recorded sounds made by natural resources didn’t sound particularly professional I decided not to use them in the actual final production of the website.• This was because, I thought that the sounds didn’t work with the theme that I was going for, as the sound of whistling would not particularly go well with dance music. It might make the music sound original, however, it would make it sound good.• I also made and recorded more sounds than was necessary for the actual website –not to actually use in the website, but to experiment with recording and making sounds and seeing which methods would work best in preserving sound quality.
  • 100. Final Reflection
  • 101. Reflection At The End