Web analysis - Pixar

As I could possibly be redesigning or keeping to the general theme of Pixar I thought that this would be a good place to start my research. The reason why I picked Pixar as a starting point was because like I have probably said in many of my other blogs I will be applying for internships and Pixar was one of the first sites I looked at, liked and wanted to apply for.

What does it look like?


When the site is first opened you are greeted to a very slick design with minimal imagery. There is alot of white space but having this has already drawn the users eyes towards the main content. All of the pages have kept to the same layout and from what I can see they have tried to mainly focus on the imagery (animation) which is the main hub of the company which I think is a good idea because when users open the website that is the content that they want to see. From when I look at the site I get the impression that they are trying to give out the feeling of a pixar film itself, from the whole layout.
A very small problem that I could point out is that even though I personally like the white open space some people may not like it as much and see it more as a waste of space.


How easy is it to use?


From entering the website you can clearly see where to find the main content that users need i.e. careers, feature films etc what I like is that they have put their most recent work (wall-e) as the main image also giving it a seperate link to the movie website. They have inputted a bit of Flash content to add a bit of animation making it interesting.
The buttons have been clearly labeled however what I came to realise is that even it looks like its all simple to navigate however when I clicked onto the 'company info' I greeted to many different links and when you click on each link you are faced with a lot of information, so overall when you research more into the site its not so clean.

How clearly is the content organised?


Overall I found the content was organised in a successful way. What I noticed is that they have actually arranged the buttons from shall I say from the end process right back to the start. For example the first button is labelled 'Home' but it is followed by 'feature film' to 'short features' and so on until it get to the information on the artists. I never thought of doing it like that but when you look at it it makes good sense arranging it that way.


From looking at this site I think that I am going to take some of these ideas to work with my ideas but from looking at the site I feel that I would like to go do a more artist approach i.e. sketches.

Design Exercise 3 - design work

Brief

Create a FLASH website for a new band called 'The Grocery Shop Boys'. The site must include 3 videos and 3 music tracks. The site must also include a simple animated introduction with a skip button. Sections that must be included on the site must be:
- who are the 'grocery shop boys'
- see us perform
- sample tracks
- contact information


I found this project quite enjoyable to do because it was bringing back everything that I learnt from my first year. Looking at my finished site now there are some improvements that I would like to make. I would definately change the layout of the pages, I was aiming to go for simple look because that is one of my ideas for my main project and I'm pleased with the outcome of the main front page because it is simple, to the point and not packed with lots of imagery.

The majority of the animation was through motion tweening which I am really getting the hang of now but like always I 'm always practicing. What I found difficult was trying to get an idea out of my head and create something completely different. I couldn't get the word 'grocery' out of my head and so any ideas that I thought of would have a grocery theme. So I looked at other band sites to try and get some inspiration.

Below are my sketches that I first created before developing my drawings into computer designs.









As you can see my above designs are all to do with groceries, this is one of my weaknesses that I need to keep trying to avoid and so if you look blow I have created some designs that do not relate to a grocery but more a band website.





And finally my computer design images I did not use any of these but I wanted to experiment on different types of media.





My final idea I will upload with my other exercise work but I am still trying to work out how to upload links to the work. As for the project itself I enjoyed it mainly because I learnt quite a few definitions i.e. variables and I am slowly starting to learn coding, I know I am still a long long way from fully understanding but I comming to terms with it. I found uploading the mp3's the toughest thing to do but after researching the internet (and with help from Ashley) found a website full of simple tutorials that breaks down the code, explaining each piece. I did use this code but the main thing is that I understand it.

Maybe I could add this in my main project? who knows.

The start of the design!!

Well I'm not going to lie its taken me time to get back into the swing of things or, shall I say uni life. But I am back and have started creating many ideas for the first major project. It is only design paper work but thats where I always start off and I am not going to change that.

The idea for my web site is quite random but I am happy with it. As I have been looking into internships and Pixar was a strong candidate so, with some advice given to me it came to the conclusion that creating a Pixar website would be the ideal project. However I will not be redesigning the actual website, I have decided to create a website of my animations and how I would interpret pixar animations if I had not seen pixars designs.

Below are some of my initial designs that I have experimented with. I found it quite hard because I was trying to be more open minded about my designs and be more experimented.



I started off by mind mapping ideas or things to consider when thinking of pixar. Most of these ideas were based around the pixar website (I will be blogging about my findings) from these I was able to pick up ideas that I felt could be enhanced further.




One of my first ideas was from the the pixar website, well the theme and layout. I have kept to the theme of the film reel however pixar did not use the reel to frame the work. I also decided to design Polaroid photos the idea behind this would be for potential new animators be able to upload their work in the frames for the public to view. I thought that this would be a good idea because I feel that there needs to be more sites that promote new animators, get people to actually see their work.


For this design it was more trying to promote my work. The intended idea would be for my sketches to be the interaction when the character is clicked on it could either show a pop up or be a link to another page, so now thinking about it it could potentially be an idea for my main page, however the only thing I worry about this design is that it maybe to 'in your face' so I could tone it down a little.



I'm going to be honest, this was not my best idea but I thought it so I may as well show it. Keeping to the theme above about trying to enhance/promote potential new animators I thought why not create a forum/faq page, somewhere where people can ask questions about the subject animation. If I had to describe it I would say like facebook but for the arty people. However after talking to people I get the feeling that this could be very difficult and time consuming and with the skills that I have I may not have enough time.

Now that I have started making ideas I thought I would attempt the minimal look, but not too minimal I don't want it to look plain so these next four sketches are pretty similar but I like them. What I am starting to think is what would look good throughout the whole project site, because the first ideas I felt were good but where would they lead on to? how would they link to the other pages? Looking at these designs I feel that these ones could be the ones that I could improve and make further designs for.



Each image would fall out into a drop down menu, could be one of my widgets.



The main imagery on either side of the main content. This would keep the users focused on the main piece however it looks quite overcrowed with all of the imagery. And so thats why I decided to reverse it.



I prefer this idea, having the animation peak from behind the main content, keeps the audiences eyes to the center of the page and also I feel would give a 3D look to it. But like I said I am going to redesign these or try and improve the idea.

These last two images are not my best but as I was told to blog everything I thought that I would show them, they are only quick sketches sticking to my ideas above so I don't really need to explain them again but I've done the work so I may as well show it.






I am going to carry on sketching because this is how I get my better ideas, I have also done some research into different websitea, mainly focusing on the animation theme so I could compare my ideas to others. So until next time enjoy the work.

Interaction Design - evaluation

After finishing my final banner I felt that my final design was a successful design following the brief to the requirements. I felt that the design work helped me get to the final stage because my end outcome consisted of my sketched ideas combined together . Having done this helped me meet the requirements needed in the brief.

I think this was a successful piece of work for me as I actually self taught myself how to create a basic firework animation. This was a combination of motion tweening, movie clips and different slides. Having taught myself this allowed me to expand this idea to the sparkler enhancing the animation. As for the interaction I decided that a simple button click would be a good interaction as I know from experience users lose interest very quickly so I thought that using a button click was to the point and simple for the users to work and so I felt that the whole design succeeded in my opinion.

However looking back at the final outcome I felt that the design work could be improved on. I feel that I could have made my fireworks look a bit more realistic as with the sparkler. But I feel that this is just a case of me having to keep practicing and do more tutorials to get the results that I really want. I would also like each page to flow into each other easier, when I look at it now all I feel that it looks very rigid, maybe a simple fade effect would help this.

Overall I am happy with the results that I did. It fits the brief and also shows what I can do on flash, I am still working on flash but in time I belief that my skills will improve.

Interaction Design - firework banner task

Create a simple FLASH animation that promotes safety and should consist of between 6-8 separate flash sections that include animation and some interaction.

I tried to aim my banner for all ages. Mainly aiming it at families. With the interaction, animation and imagery that I used I managed to design a simple banner that is eye-catching yet gives out some standard firework safety facts. I hope the the animation would attract the audience at first with the 'click' word popping up and, as they click through the banner they are greeted with other interactive parts that are simple, quick and to the point, as I've come to relise that people can lose interest very quickly and so that is why mine was intended to be a quick advert.

Before I chose my final design I designed a few different ideas that I thought would work for a firework safety banner.



An image of a fire engine where the user/audience can click on a certain part of the truck and either a safety fact or story would appear. However I did not included animation with this.



Trying to focus more on the animal welfare when it comes to firework safety. The users would click on the animal a speech bubble would appear, like the fire engine stating a safety fact. What I would have liked to do though was for the animal to change when the cursor moved away from the animal however only know how to do a change once.



A simple animation where the fireworks would pop up as well as the safety firework code. The firework code would pop up and fizzle out like a firework, good animation but little interaction.



A simple image of a child/teenager and when the user would highlight over certain piece it would quote a fact, very much like the fire engine ida though.



Image of a bonfire (animated) and then instead of the sparks flying out we would have the fireworks facts and code flying out good interaction with a bit of animation could have been a possible idea.



A simple kids comic book each with an image demonstrating fire safety, however there is animation but stronger interaction.

Once having done the sketches I thought I would try out a few on photoshop to get a more computer feel to the designs and maybe help me finalise my idea. below are the images that I designed:







Once designed all of these images I thought that it would be a good idea to maybe link a few of the ideas together so it would involve interaction, animation and stick to the brief. I will create a link for this shortly.

Artist Critique

I chose this image becauase having been to New York and I remember taking the same type of shots but never managed to get a powerful shot like this image presented here.

The main part of the image that caught my eye has to be the contrast. With such a powerful contrast the photographer has given the image a clear look bringing all of the small detail more visible. However with more black and white tones used and very little grey tones can give the image a more 2D effect rather then the 3D look that I guess the photographer was trying to achieve. The viewers eyes are immediately drawn towards the center of the page following the path and the shadows before viewing the rest of the image.

What I did think was that the photographer was trying to make the two people in the image the main focal point however I do nor think this was successful because of how strong the contrast and composition is, instead the poeple are absorbed into the image and become part of the image rather then a focal point. I feel that the main focal point of this image was more the patterns created from the bridge itself and the shadowing. They are very varied and give alot of detail for the audience to see.

This is a typical New York photo that everyday 'tourists' would try and capture but the its the strong contrast that captures my eye but the more I study this image the more I wonder whether it has computer edited to get this effect. As I see most New York photos in black and white I'm guessing that the photographer was trying to keep to this theme, I feel that this was a conscious descion as this makes what the image.

Its Started!!!

Now heading into November I was starting to panic about what my potential ideas would be for my project and after a chat with shaun I now know what I'm doing. I have been talking to quite a few people about my plans to apply for summer internships, Pixar being a choice and this was one of my ideas, once shown what my ideas were Shaun told me it was clearly the best option because when I think about it, it could help my chances.

Having the past day starting brainstorming ideas for the website I can't stop thinking of possible ideas that could help me, some I feel are a bit tricky but some I think could really work. The main idea that I am trying to get away from is sticking to 'Pixar' imagery so that is where the idea came up of how I myself would interpret the characters that have been seen in these films.

I have looked through the Pixar website and came across how they produce a film, maybe I could pitch an idea via my project but a very basic one as we do not have as much time as these animators had. I thought if I could mix my skills that I have learnt through sketching, photoshop and over the past year I think I have something to work on.

Other ideas that I could think of are things that are based in everyday websites but I would interpret into my own site. Like FAQ page where potential undergraduate computer programmers/animators could ask questions on how to get into the business. Another idea like the FAQ it could be a forum where undergraduate students can talk to each other and maybe give each other other.

I'm still coming up with ideas but I shall past them later when I have produced more ideas.