Research into Optimising for Small Screen (Mobile)

I will need to do some research into optimizing websites for small screen, so that I will be able to fit the website onto a mobile device.
Therefore the mains components that I am looking for is the layout and mainly the size of what they should be.
After looking through different websites, I found this website which helped me understand what I would have to do.
http://designshack.co.uk/articles/css/quick-tips-for-creating-a-mobile-optimized-site
This website is very useful, in the sense that it give me the information that I will need, for example under the heading Use Fluid Layouts this tells me that the best things that I could do, within CSS/HTML, is to not use pixel dimentions for my website, instead I should use percentages. This is because there are many different screen that the website would be viewed on, and this allows for the webiste to adapt to the different screen sizes.

There was then a link that I clicked on to show what kind of layouts would be best.
http://matthewjamestaylor.com/blog/perfect-multi-column-liquid-layouts
There are many different layouts that I could use, for example:

Left Fluid Layout

Blog Style

'Holy Grail'

Full Screen

Each of these layout I feel would be very effective in creating my website, however, I feel that I would most likely use, either the Full Screen layout, and then have the buttons running along below the Heading, or the Left layout. This is mainly becasue they would be simple and easy for the viewer to see where everything is, especially as they would be viewing it on a small screen.

I think that for my website, I will use 1024 x 768 px as a basis, and then I will make it smaller to fit the screen using ratios etc.

Research into Using Social Media (Meadowlands)

Meadowlands are currently using different types of social media to expand their branding and get their name out in the public's' eye. The social medias that they are using are Facebook, Twitter and My Space.

Here are some screen shots from te different social media sites that Meadowlands are using.
Facebook:

Twitter:
My Space:
These are the pages at which I found using the meadowlands festival website. I feel that even though they are on the main websites, they are not really using them to their full potential.

Also, what I have noticed is that they have not got a YouTube channel where they would be able to show off different advertising videos, as well as some videos of the bands that would be performing at the festival. This would allow them to expand and get people inetersted in the festival, also maybe even get them to go to the festival.

For example:

http://www.youtube.com/ReadingFestival1 This is the YouTube page that Reading Festival had set up for the 2010 festival, this shows different videos before and after the 2010 festival. Having a YouTube page means that other people who haven't been to the festival before can see what it is like, as well as seeing who has performed and who will be performing.

Research into Internet Coverage

To allow us to make a website that will be optimized for mobiles, and then be used at the festival, which will be held outside, we have to look at what the internet coverage is like around that area. Therefore I looked on the internet, via Google, and found this website, which shows what the coverage is like in this area through different servers, such as O2, 3G, Vodafone, Virgin, T-Mobile and Orange.

http://www.compare3gmobilebroadband.co.uk/3g-coverage-uk.htm

Using this website I was able to find our that 3G coverage is good indoors and outdoors:
Orange has got bad coverage round that area:


Vodafone has got good coverage:

Therefore I have found that will should be able to create a website for mobiles, which can be used at the festival. Also as we might be attending the festival, so that we could film at the festival and create post-festival videos that can be shown for next years festival.

Research into Other Festivals

There are many different festivals that I could use as a reference to create the pre-festival videos etc. To get the most effective way of advertising I will be looking at the most famous festival that are held in the UK.

Glastonbury: http://www.glastonburyfestivals.co.uk/ On the website that I have shown here, there is a History page that shows the history of the festival. For example Glastonbury started in 1970, and during that first festival there were about 1,500 people who attended, and the ticket prices started at £1 including free milk from the farm. Then when you look at those statistics and then compare them with 2009, when there had been about 135,000 people that had attended, 37,000 tickets for crew and performers, and then 5,000 tickets sold for Sunday and the ticket prices cost £175 each.
This information shows that festivals can grow over a period of time; the amount of people who attend including the artists, crew and workers, and the prices of the tickets.

Reading: http://www.readingfestival.com/
Reading Festival is another famous annual festival that is known to the target audience, which is the younger generation. This website is from the Reading Festival 2010, and now there is a website that will be online soon, that will be advertising the 2011 festival. However, I am using this website as a source to find out how other festivals are advertised and seen online. On this website, there are many tabs explaining different parts of the festival, for example Tickets (how much they cost and how to get them), Line Up (showing the different performers who will be at the festival, including where and timings), and due to this website being about last years festival, there are tabs that show what happened at the festival, they are Photos and Videos, and therefore if viewers look at these tabs they would want to buy tickets for the next years festival, which is this year consequently (2011).

Creamfields: http://www.creamfields.com/

Again this is website is from the 2010 festival, therefore there are tabs like Photos and Videos that will be used to entice people to go in 2011, however, in comparison to the Reading Festival Creamfields festival have already set up a website for this years festival (2011). On that website there is information about the history of Creamfields, for example when the festival began, which was 1998, and there were about 25,000 people who attended, demonstrating the rule of word of mouth and advertising, because all it needs for one person to notice the advertising and then they tell their friends and so on.

T in the Park: http://www.tinthepark.com/To show how popular festivals can be, I have found this website, which is promoting T in the Park, which for a festival that started in 1994 demonstrates how advertising and most likely word of mouth can help make a festival as popular as this one. You can see how popular this festival is that the tickets have already sold out! In this website, there are different elements that are the same as the others, there is a tab called Line Up, this tells us what performers will be there. However, there are aspects that have been renamed, for example instead of just having Photos or Videos, they have got Gallery, which I feel is better because you are able to place everything under one banner, instead of looking like you are trying to fill the space.

V Festival: http://www.vfestival.com/ This is the final website that I have looked at, this is another popular festival. This is most simplistic websites of all of them, mainly because there is only 4 headings, which contain all of the information within them. I feel that this is an effective way of laying out a website because it is simple and easy to understand for the viewer, also it lays out the vital points that everyone would want to know. However, I feel that they could have included maybe some images or videos of past festivals to entice people to come this year and the next year and so on. However, that could have been something that the creators would have wanted because they might have been using word of mouth to get their popularity, instead of showing what has happened previously.

Live Brief - Meadowlands

On Thursday 17th February we met with Mark, who began in the corporate world, with a musical background. Due to the musical background, he then decided to move away from the corporate world into the music business, for example festivals and radio.

He is currently working for a company called Meadowlands, who hold an annual music festival between 27th May and 29th May. There is currently a website that people can go to to get information and tickets, this website is http://www.meadowlandsfestival.com/.

Mark had told us that we are having to create something digital that will help advertise Meadowlands Festival, so that younger people will be more inclined to attend it.

Therefore in the briefing that we had with the client we were bouncing ideas around, so that we could come up with something to create, as the client did not really have any ideas to work with.
Some of the things we had come up with were:

• Viral Videos (Pre-festival Promos), (should be funny/shocking/mysterious) - Interviews with bands, Setting up Festival (Sped up), Location. Real Life/Animated. One or a series of them.
• Leaflets
• Billboards
• Posters
• Facebook/Twitter/Blogger
• Online Banners (to be on similar websites)
• Sticker Campaigns (for on the paths etc)
• TV Adverts
• Badges/Stickers (to be given out as gifts)
• Bottle Jackets/Phone Socks? (maybe given out at festival)
• Advertising in the local papers
• Advertising on clothing (T-Shirts)
• Mapping onto buildings
• Competitions (winning tickets) via Radio/Online/Newspapers etc
• Games/Applications for IPhones or Ipods or Smart Phones

We then had to think about costings, as Mark had previously told us he does not have a lot of money to spend for advertising. Therefore we had to eliminate the ideas that would cost the most money. Therefore these are the ideas that had to be binned:

• TV Adverts
• Bottle Jackets/Phone Socks? (maybe given out at festival)
• Advertising on clothing (T-Shirts)
• Mapping onto buildings

This then allowed us to adapt and work on the more viable ideas. This is when we came up with what we will be doing for our brief, which is to first create 1 or more short pre-festival promotional films, to that they could be shown on Facebook/YouTube etc. They could be either real-life or animated films.

We then have to create a website that can be optimized for mobile use. And maybe a application for IPhones and IPods, that can be used as people are at the festival to retrieve information, for example schedules for when and where bands will be performing.

And lastly we will be creating some short post-festival films so that Meadowlands can use them to promote next years festival.

PDF - Websites

This year YCN have decided to have all of the enteries send in their work as a PDF, instead of on boards, therefore we are having to create a PDF, which demonstrates our understanding of the brief (which we have chosen), the overview of developed ideas, sketches and progress, Final project (maybe in a form of some screen shots of the relevant parts of my video), and how it would be used in an advertising environment.

Here are a few websites that I have used and looked through to get an idea of how to use grids for the layout:

http://www.welie.com/patterns/showPattern.php?patternID=grid-based-layout - Grid-Based Layout

http://www.markboulton.co.uk/journal/comments/five-simple-steps-to-designing-grid-systems-part-1 - Five simple steps to designing grid systems - part 1.

Both of these I have found using
http://www.suebamforddesign.co.uk/vislang_yr1/week8/week8.htm which is a website that I was shown within my first year of doing Digital Media Design FDA.

They are both very helpful for me, because they help me understand how grips work, and what would work successfully for this PDF, that I have to create for my project, and for YCN.

Problems I have had & Comments from Crit

In the 'Crit' session, I had plenty of comments that I could use to make my video better. For example, I had overlapped 2 of my people, so that one finished the other's sentence, I did that twice. The first comment, was to add more of the overlapping people so that they are all telling one part of the story, at least, also so that it would make it a continuous event that happened throughout my video.
Another comment, was to add more of the stop motion animations to my video, so that they would look more consistant and make my video even more interesting.
The next comment was to get rid of the beginning part, because everyone didn't find it relevant to my video, and would take the attention away from what I was trying to do.
The last comment I had was I had to change the voice over of Julie Hall, because she was a different quality to the others, and it didn't sound good at all, therefore I had got my mother to redo some of the parts that Julie had said, this is so it wouldn't sound that bad.

Lastly, the lighting in Robert's interview was terrible, which then meant that the video was grainy and pixelated.
I therefore had to re-shoot his video, or not use him visually. Therefore, I had to contact him to see if he could do it in the time space that I had, and luckily he was free, and therefore I was able to re-shoot him. However, this time I decided to use a black background, which would make Robert stand out more, and I changed the lighting a bit, so that again he would stand out better.
Luckily, this time it worked. And therefore I changed the videos from the old ones to the new ones.

I was able to make all of the changes and more to then make my video to the best of my ability. I also got a comment from another lecturer, saying that I could have added more effects to make the video more visually interesting. I feel that if I had more time I could have done that, however, to due to the issues that I had with getting hold of people and getting people filmed, I ran out of time.

Programs Using and Used

I have used different programs to create the different elements for my video.

For the video itself, I am using Final Cut Pro.

Final Cut Pro allowed me to cut my videos up and place them into places that I would like them to be. However, because I have only got a PC at home I found it very difficult to carry on using Final Cut Pro, and therefore one of my Lecturers showed me a way to use Adobe After Effects in the same way.

I began using Adobe After Effects to create my stop motion animations, therefore I was very comfortable with using it, and I also had it at home, which then allowed me to work on it as much as I wanted. Creating the different stop motion animations ment that I had to use different features within After Effects, for example the In and Out points to cut up the different parts of the films.

Lastly, I used Adobe Illustrator to create some of the graphics, and to modify some of the images to make them lighter or darker.

Questions Used for Interviews

For the Four Children:

1. What is your name?


2. What school do you go to?


3. What do you think FairTrade means?


4. What have you done for the FairTrade Festival?


5. What do you think that Anthem is about?


6. What lines did you help create?


7. What do you think it means?


8. What did you enjoy most from this experience?

For Robert Eggleston:

1. What is your name?


2. What do you do for FairTrade (Job)?


3. What is a FairTrade Town?


4. When did Burgess Hill become a FairTrade Town?


5. How and Why did Burgess Hill become a FairTrade Town?


6. When was the first FairTrade Festival?


7. How long does the Festival run for?


8. What events are there at the Festival?


9. Do people volunteer or do you have to ask them?


10. What type of people volunteer?


11. Is there a commitee of people making the decisions about the festival?

For Julie Hall:

1. What is your name?


2. What do you do?


3. Do you do anything outside of Burgess Hill to promote FairTrade?


4. What are you doing for the FairTrade Festival?


5. Why are you involved in the Festival?


6. Are you more aware of FairTrade by doing the Festival?


7. Would you ever do the festival again?

Using these questions that I have come up with will allow me to create a story between all of the different people talking.

Progress of Brief

I have currently started creating my animations, from my sketches and storyboards that I have created, the first one I have created is a chocolate stop motion animation, which will co-inside with what Robert Eggleston has said, when he was explaining how fairtrade works.

I created my stop motion animation by firsting having to make sure that the camera was on a tri-pod so that the framing hardly moved. I then made sure that my positioning of my objects were in the frame, and that you could see the products.

For example in this test shot you cannot see the chocolate that well, therefore I decided to use a white sheet or something to make the chocolate stand out from the carpet.

For example in this photograph here, I have put a white sheet below the chocolate and therefore the chocolate stands out.

After showing my video to my tutors my video and the progress, they had said that I should include more stop motion animation. Therefore I had decided to go through my video to pick out the parts that I can animate.

I then used the idea of when Robert was explaining about the different events that will be at the Burgess Hill FairTrade Festival, I thought I could make 3 short animations to go with what he was saying.

Therefore I chose, 'an acoustic evening',

Classic,

And Rock.

I then thought about doing another small animation showing the different types of people who can get involved with Fairtrade, which again goes with what Robert says again.

Also there was a part that was said about how buying fairtrade items won't cost people 'more than a few extra pennies'.


Therefore I chose to do another even smaller animation just showing about 3 or 4 pennies disappearing from this group of pennies.

Also within my video Robert mentions about the different shops that sell FairTrade products as well as Fairly Traded product, and therefore I went around to each shop, asked their permission if I could take a photo of their products and their signs so I may put them into my video. And here are the shops.

I then added the products that had been mentioned. For example: Oranges, Sugar, Coffee, Chocolate and Bananas

Videos and Images taken for Brief

My answer to the brief that was set by Fairtrade, is to create a video that is based around a community, and with Burgess Hill (which is my home town) being a Fairtrade town, I wanted to base it on that. I chose this idea because I feel that it shows what people can do as a community, instead of individually.

I would like to interview different people, children as well. The only way I can film and include is by getting the school's permission and the parents permission. And I have got all of the permission slips for the interviews, and I am still waiting for the slips from the Choir. I have been thinking about, what would happen if there were children that did not have permission, I would make sure that they attend their choir session, however I would also make sure that they were not included in the film.

I have currently done most of my videos, which are:

• Robert Eggleston's interview (The Chairman of the FairTrade Association of Burgess Hill)
• The four children's interviews (The four children, from Birchwood Grove Primary School, involved with creating the Burgess Hill Community Anthem.)
• Julie Hall's interview (Is a performer who will be performing in the Burgess Hill FairTrade Festival).

I have also started on photographing the images that I would need to create my stop-motion animation.

I am currently waiting for an oppotunity to film the Birchwood Grove Choir singing the Anthem, I think that I may only use the music in the background, and then use the choir singing the chorus at the end.

Research for Fairtrade

This video I got from YouTube. This video I have chosen because it is a good way to explain how Fair Trade works. It has also been a good reference into what I could do for my video. However, this is mainly for people who haven't heard of Fair trade, and are not already ethically aware.


Again I found this video via YouTube. I like this video because it makes the inanimate objects, (the different fruit and vegatables)feel more personal, mainly because they each have their own story and jobs etc. Each of the fruits represent the different workers that help grow and harvest the fruit.


This video again I found on YouTube. This video is very explanitory about what Fair Trade is. There is a voice over, and the words from the voice over are displayed, but they are animated so that it makes the video look better and more ineteresting, then if they were just plonked on the screen in the middle.

Each of these video are very helpful because they show me what I may have to do to make my video stand out. However, there are a few things that I will be doing different to these videos. These videos are very informative about what FairTrade is, and I will not be touching on that subject so significantly, there will be a brief description, and then I will move onto different points, which is what I will come up with.