Random inspiration

Over the christmas holidays I've been doing some random work on my portfolio. Here are 2 websites that have caught my eye.

http://www.ikon-images.com/ This site is really good because of its side ways navigation. A simple touch but unique. Maybe good for a show real or a series of illustrations.

http://www.camellie.com/index.php?x=browse&category=2&title=work Again I like this website because of its simplicity. I love how there is a subtle animation along the side of the work that you can scroll down. The colours also all co-ordinate well to unify the brand.

Designing a charity website

To achieve a popular, interesting website that informs people of a charities purpose and goals it needs to have-

• pictures/ videos of the charities purpose
• a donation button
• links to social media
• clear menu that is easy to navigate
• a description of the charity and and mission statement
• contact details
• and if I have time a news letter that can be updated (at the moment I have scheduled for the pictures to be updated-PHP).

The purpose of my website for wish upon a star is to make donations easier digitally as not a lot of people will remember or have time to post cheques. I want the audience to be able to donate spontaneously in a matter of seconds.

http://uk.virginmoneygiving.com/giving/

I like this charity website because it gives the target audience a step by step, easy to follow guide of how to donate. It also steers away from making it tedious by presenting the instructions with pictures in a cartoon form along with photographs so that you can see the effects that fundraising has. Also one of the other first things that I saw was the game that can be played on face-book. This engages all ages and give the audience somewhere to discuss the charities goals etc that is familiar to them.

I also like the home made feel to the website (paper clips on photos) they make it look more personal. Additionally, the website isn't cluttered as stories are separated into small boxes with a 'read more' option.

http://www.everyclick.com/

Although I generally find the design for this website dull the one thing that attracted me to it is the use of the logo pointing at the 'raise money for charity' message. I think that it is good use of advertising as it gets the message/goal of the website over quickly.

http://www.rapidataservices.com/services/edirectdebit/

Again I am not a big fan of the overall design of the website but I do think that The contact details are well placed as it is in the range that is usually observed first on a website. Also the image quickly attracts the audience as it stands out against the background. Maybe for my website I would create something brighter that is animated? Something that the audience can interact with?

Ipad finger painting

This video is an amazing example of what can be done with the ipad. It takes finger painting to a new level. He has added all of the formal elements in a sophisticated way.

interactive drawing changing education

Both of these programs struck me to be amazing educational tools that could change the face of how images assist education. Although they are aimed at children who need extra circular assistance when it comes to physics it is an amazing way to teach children visually so that they can apply how physics works to their everyday lives. This technology has led to interactive white boards being used in art lessons.

Dissertation Timetable

Above is the Gantt chart I've created to keep my self on track. My aim to complete the dissertation before the end of term one so I've got the Christmas holidays to proof read etc. I've got a lot of work to do!

Final Website: Simulated Client Project

Overall I am very happy with the design of the website. I feel that it represents Apples brand and policy about digital piracy. It uses bright colour to make the most of the clean design and draw the audiences attention to the issues. I think the interactive itunes interfaces reflects the damage to quality that downloading illegally causes. It was one of the hardest parts of the project (as3) but I think the interactive elements gets the audience more involved with the issue.

Illustration for Apple

Home: Viruses can destroy your computer. Download from Apple (someone you trust).

About: Enjoy apple products. Destroy problematic viruses and illegal file sharing.

Contact

Imagery for interactive fake itunes

As part of my website about the effects of digital piracy I have created a 'fake' itunes where I have created bad quality song/altered images.

I am changing the cover of one of the albums to visually represent what downloading unreliable files does to the quality of music that you listen to.

I have changed the itunes interface subtly so people get the impression that you should be able to trust where you download your music from. I have created a little mp3 player with the play, pause and next button. It plays well known songs but in bad, jumbled quality. I think this is a good way to get the message across that if you want quality you need to buy song from a quality retailer such as apple.

Change of design

I felt like my design wasn't 'Apple' enough. Apart from the logo and the clean, white space I thought my design didn't fit in with apple design criteria. A few of the aspects of the Apple website that stand out to me are the bold text, bold imagery followed by the small images and text. The text is broken up by the series of small images and the white space is broken up by the off grey background outlining the white. It is also a centered design.

http://www.apple.com/uk/itunes/

I thought I'd try the boxes on the side (The main images is a bit stretched as I was just trying out the dimensions). Still not apple enough, it isn't centered and there is too much white space.

Building it in dream weaver, following Apples formula centered design, space for text and images, text with small images underneath.

The design and illustrations put in... now its looking like a campaign that apple would launch. I have done my own style images to make the website my own.

Monster Mock-ups

Today I have developed my mock-ups to see how the illustrations and website layout will work together to clearly show that downloading products from a reliable source, such as Apple is the right thing to do.

I want to show that just because something seems like the real thing doesn't mean it is. My website design shows this through logos and clean, simple design that replicates apple but is clearly in a different style. This shows that I can design for a company, such as Apple but can also use my own design initiative to get the message across that downloading is wrong.

Home Page: now that the audience have clicked the option to 'download' something that they aren't sure is trust worthy it goes onto a page about the consequences of downloading. The Image takes up most of the page so that it is easy to see. It is also something eye catching for the audience to get the message across quickly and easily with out boring them with a lot of information.

About itunes: This page is about the benefits of downloading with itunes. It is reliable, easy to use, you get what you pay for and it is always of good quality.

Below are close ups of the illustrations used to show the pros of itunes and the cons of downloading illegally. At the moment they are only black and white so that i can get a flavour for how they look on the page. I am going to use bold colour to draw the audiences attention to certain parts of the message the illustration holds.

The image below gives the audience a visual aid to the message that by downloading you are destroying your computer.

itunes=good

downloading+file-sharing= evil, monstrous viruses.

Just Because It Looks Like Apple Doesn't mean It is...

I have developed the concept of my idea so that I can utilize more of my skills, such as illustration and interactive flash skills. I am still doing a project for Apple but I am coming from a different angle. The project is going to be aimed at 17-24 year old (who are more likely to download). My concept is that I want people to be aware that "The Only Apple Is The Real Apple". I am going to get this message across by luring them into 'downloading' and interacting with my website. The images are hand drawn to represent apple as it is such an iconic logo people will recognise it immediately but they will realise it isn't real. As you can see from the sketches below they will go through each stage to inform them of the pros and cons of purchasing products from Apple.

The message of my website is the only true Apple is the real Apple.

I was inspired by the Volkswagen adverts that say if its like Volkswagen it is the real Volkswagen therefore you aren't getting the real experience.

Apple Mock-ups

My idea has developed slightly. Instead of over complicating it by constantly comparing the real itunes and a illegal downloading system such as vuze I am going to create a fake apple website. It is going to be in my own illustration style (see below).

Start page. It shows if people choose to carry on and download they need to learn more about illegal downloading.

This is obviously a fake apple style website. It is all going to be about the consequences of illegal downloading and how this results in bad, unexpected quality.

Wireframes

Wireframes one: Too cluttered

Wireframes two: Simple, clean, makes the audience focus on the content

Wireframe three: Animated banner is the wrong shape. Too wide.

Wireframe four: Too much content?

Wireframe five: Animation and information presented clearly

Wireframe six: Could use background to illustrate digital piracy

Wireframe seven: Content too central

Wireframe eight: Clear and simple layout

Apple Research

http://www.apple.com/itunes/

The Apple brand is

• Clean
• Simple
• Web 2.0 style in terms of use of colour to highlight certain points
• Easy to use through clear navigation
• Easy to use and download products (highlighted in blue)
• Easy to read text. Bold. To. The. Point.
• Main information on the page so you don't have to scroll down

All the above bullet point are attributes that I am going to need to put into my website design. Although i want to create something that represents Apples brand I want to put my own creative flare into it though layout, colour and typography (in the main site).

Another reason why I have chosen to create an anti piracy website for Apple is because so many young people, all over the world connect digital, portable music with Apple (ipod and itunes). people listen to what Apple have to say as it represents the unlimited, free nature of downloading through itunes.

“Apple is about imagination, design and innovation. It goes beyond commerce. This business should have been dead 10 years ago, but people said we've got to support it." Mark Globe

Apple is about clever marketing. It persuades the public that it is worth paying extra for easy to use, fun, cool products. This is what my website needs to shout out.

Client Simulated Project

Brief: Produce a short multimedia piece that informs or illustrates about digital piracy....

My first idea was to create a website informing people about the consequences of digital piracy. One of the pages would include a simple question to test peoples knowledge of piracy. The questions would be presented with an illustration to get the information over quickly but depending on your final score it would come up with a different poster. The idea of the posters came from the anti drinking campaign so a person would be pictured with a slogan, such as "more video games than friends but you won't experience the real thing" or 'maybe you'll end up in her bed tonight" (next to a picture of a fake Angelina Jolie).

The only problem with this idea is that it left me wondering who the would be employing me to do this type of work and why? What is its purpose and who is it's target audience?

My second idea is to design an anti piracy website for Apple so I can focus on their advertising, marketing and branding. With apple it is always about the people as Apple represents innovation, imagination and a sense of community. By designing a website for Apple it give me a sense of what and why this product is being made. I want to be able to communicate to the audience how digital piracy effects brands that are part of their everyday life and how this effects products that we use. The website will include 4 pages including home, iexperience (about), what is itunes and contact.

On the iexperience page I plan to create 2 instances of what will happen if you choose itunes to download your music from or if you choose to download illegally. Both will be a flash animation.

I was inspired by flash animation of stick men interacting with with interfaces. I want to create a similar effect but with a more sophisticated character. Fir example if you click on the illegal download option something might blow up.

This will show the audience that if you download illegally there will be consequences. Also the 'fun', free movement of the stick men go well with apples creative brand as it won't take away from the content but it will illustrate anti piracy through guiding movements etc.

Portfolio Choices...

I like this mock for the portfolio page because people can easily click through all of my work but this might become a bit tedious when more work is added. Also I'm not sure if it'll end up looking a bit too cramped if I stick to this layout..

This portfolio mock up might work better because its in a cleaner layout. I would want people to scroll though the content in the same area e.g. the line stay in the same place so it doesn't seem like the audience is scrolling through pages of images.

You would click onto one of the images and go on to an info page about it. There would be an option to see multiple screen shots or go to the live version of the site I have created. I think the flowers flowing through the content are a nice touch to guide the audiences attention.

Portfolio Inspiration

www.adhemas.com

I like this website purely for the introduction and it's outstanding use of illustration. The illustration grabs the audiences attention with simple colours and movement from the first page. The only thing is its navigation, it's hard to find and use as its over powered by the image.

http://www.garethdickey.com/

This site inspired me for its simple layout but it feels very personal because of the image of the guy (that I guess is meant to be Gareth). It stands out because of the good use of yellow and simple navigation. I like the little touches he's put in so you get a sense of what and who he is for example, the Belfast crossed out and his current location put in. Also the simple navigation that lights up when you mouse over.
http://hugsformonsters.com/

This one is my favourite! I love the use of illustration that is used on the front page and guides you through their portfolio without over powering the work. I also like the introduction line, to give the website a personal edge. So you know what the website is about he has got his work on the index page as a preview. I think this shows the audience what talents he has and tells them automatically what it is about. One last thing that strikes me about this site is the bold yet gentle use of colour.

http://www.madetokill.com/

I like the sense of movement as you navigate through each section. Also it has a sense of simplicity as each piece of work has a description next to it. The work is also defined by a pattern in the background to draw your eye towards it without over powering it.

Gaia Logo design

Here are 5 different variations of my Made Like Gaia logo design.

logo 1: Bold colours that I think represent my personality. Plus it will make the logo stand out against the page. Also i have added a bit extra 'decoration' in the form of leaves to represent the meaning of Gaia (earth mother) and to show the 'growth' of my website design etc.

Logo 2: same colours, same leaves but placed differently. Maybe looks too much like an army print though...
logo 3: Simple spotted pattern. I don't think it represents my personality though. Too standard and doesn't stand out against competitors.

Logo 4: Maybe the winner so far. Simple bold colours with a slight texture to represent my brand. I am going to experiment with the texture behind these bold colours.
Logo 5: Stripey patterned paper to represent my home made, creative style.

Portfolio Mock-ups

So far I've done three mock-ups. I want to create something simple with a clean layout yet shows people my creativity/ skill set automatically.

Mock-up 1

• I don't like this at all the trees send out the wrong message. The original idea was to have my tools 'growing' out of them but this doesn't suggest website designer to me...
• I like the position of the logo though. People will instantly see it.

Mock-up 2

• I'm getting there... So far I think the different segments for an illustrated header, navigation and a few pieces of selected work compliment each other because the audience automatically get a taster of my website design at the same time as my illustration skills.
• I don't think the blue works. It separates the page too much.

Mock-up 3

• So far I like the banner with my illustrations. I chose images that represent me but I may play about with them to introduce text. Maybe make the illustrations change every once in a while to keep the audiences attention??
• The navigation is easier to see due to the hand drawn line guiding the eye.
• At the bottom I have done arrows so that the user can navigate through the previews
• Maybe add more colour into the logo to link it to the illustration?
• Add text introducing myself in the illustration...