Front Page

For the front page of the website I would like to create something eye catching and vibrant. I would also like to make the viewer think when they view the first page of my project. This will encourage them to think about the rest of the websites content but also give them a good initial impression. I hope to create an impact through the initial viewing as this will be beneficial for the rest of the project.

As the first page, I would like to create an image of an iceberg sitting in the ocean. This will display a small iceberg sitting on the surface of the water with a view from under the water as well. This underwater portion of the drawing will show that the small iceberg is in fact a large iceberg with the majority of it underwater, not visible from the surface. This has a great symmetry with MS as a number of MS symptoms are invisible, and cannot be seen by outsiders. This image will be accompanied with a phrase along the lines of “What you see on the surface does not show the whole picture”. I feel that this would be an effective first page as it portrays one of the struggles that people with MS face and also educates the audience partly in invisible symptoms. This would prepare them for the further information that will be present in the rest of the project. The iceberg will consist of a number of triangles, that will be in the place of shading, in a similar way to this image of a mountain. This would be appropriate for a website as it will be visually attractive and, additionally, it will be easy to load quickly through a browser.

Iceberg Inspiration

Invisible Symptoms

Whilst I was prompted to promote the invisible symptoms of MS by the MS Trust charity I felt that it would be a great way in which to bring awareness to MS. I think this will have a greater impact on people as it is something people would only know if they looked into the subject. I will make a large portion of my website around this theme and I will develop a few looping animations to show some of the invisible symptoms. These animations will feature a character that will be involved in the problem. For example with the symptom known as the MS hug, a squeezing sensation on the chest, I will show a character hugging the person with MS. This character will have to be presented as a bad character in order for the message to translate appropriately. This will make a good explanation for the symptom without patronising the audience.

incognito  Invisible symptoms Invisible symptoms2

When initially looking into making a character for these invisible symptoms I took inspiration from the incognito man used in the incognito browser modes. This is because I feel this would achieve the desired effect. I think that by designing a character to appear in this style people would assign the same thoughts to it. This would encourage the audience to see that character as invisible, which would make them more willing to see this character as a symptom rather than a person. I believe this aesthetic will achieve the desired effect.

Invisible Character

I believe this character achieves the aims that I set out. I feel that this character will be seen by the audience as an invisible element that the other characters in the animation are not aware of. This offers an interesting way in which to portray the invisible symptoms to an audience that was not aware of these symptoms of MS. I also feel that this character will be suitable for animating in this project and is suitable for my target audience.

Website Research

Throughout this project I have been looking into a number of different websites that will help me develop my own ideas. These examples use bold colours and visually appealing illustration to make them stand out and engage their audiences. The star wars example uses bold colours and eye catching images to draw in their audience. They also use nice icons and an effective layout to present their information in a visual manner. This makes it more enticing for the user when coming across this website. It also encourages them to explore the rest of the website and discover further information. The Business Logic Group website includes a number of animations on its site. They are drawn in a simple yet effective manner that catches the user’s interest. The animation shows what the company does. This is an interesting way in which to present this information. I have also looked into one page site such as this promotional site for a graphic designer. This site includes a number of nicely designed illustrations. This webpage presents all the necessary information very nicely through the use of a good layout and well placed images. It also adapts fluidly across devices and does so with ease because of the well thought out layout. This Sharp website appears very commercial but is very effective in making it appear different from its competitors. It does this through the use of subtle animations on the images and text. An example of this is on the main page where the title “SHARP” appears from behind the image of a set of mountains. This is a good way of differentiating themselves and appearing new and up to date to their audience. This has a constant colour scheme throughout that makes a cohesive experience across the website. The layout of the text and images makes for a nice visual experience.

 Website1 Website2 Website4Website3

Example animation

Example Animation 1

 

This animation shows how i could potentially animate an animal for this project. This example shows a simplistic drawing of a small fox walking from one side to the other. This was useful in helping me get more experience with working in Adobe Animate and producing a looping animation. This example also gave me more experience with the workflow from illustrator to animate. Whilst this is a very simple animation with nothing else in the scene it gives me further ideas of what i could achieve with my final animation. It also helps me with determining how long a time period it would take to create a professional looking animation.

Character Research

Character 1 Character 3 Character 4 Character 5 Character 6 Character 8 Character 11 Character 15

As you can see from these examples i have been researching a number of different art styles that could be applied to a project such as mine. The main aspects that i found appealing of these various illustrations is the way in which they use colour. This would be very important in my project as this will initially grab the attention of the viewer and intrigue them to continue exploring my work. The simplicity that is used in these illustrations is also very appealing to me as this lend itself better to being animated. The use of animation is how i intend to encourage people to invest their time in learning about MS, therefore making the development of a simple yet visually appealing character incredibly important to the success of the project. These characters each offer a different illustration style but i feel that all of them would be suitable to portray a message such as the awareness for MS. The illustration will have to have to include enough features to make the art subject obvious to the user so i should be aware to not oversimplify the drawing if I were to take influence from these examples. The character with the umbrella is a good example of how i could make an effective, aesthetically appealing illustration that will fit the purpose of this project. This example is not accurate when comparing to a real person but nonetheless is impressive in how it stands in for a human character. It has enough identifiable features for the audience to focus on which will be an effective tool when animation is considered. The use of colour on this example is good as they all compliment one another to form a coherent illustration. The way in which shading has been applied to the character’s hair is a nice touch that adds an extra layer of depth, enhancing the illustration further.

 

Character 2 Character 7 Character 9 Character 10 Character 12 Character 13 Character 14 Character 16

These example illustrations show how I could use animals to portray my message to users of the website. This would offer me more creative control over what i can draw due to what id find most suitable for this project. These examples of illustrations show a number of of different ways that i could portray these animals. All of these offer a visually appealing portrayal of their respective animals with each of them featuring enough characteristics that make it easy for the audience to identify the subject matter. For example i find the illustration of the stag very effective. This is because allow being very simple in it’s construction it comes together to make a cohesive, visually stunning design. I like how very simple shapes have been used to construct the face of the stag, with only a few blocks of colour to differentiate the face from the body of the animal. I also like the colour pallet used in this piece of illustration as the selected colours compliment one another very nicely whilst taking care to make the colours reflect the real life counterparts of the animal such as the antlers and ears. Like the examples of people illustrations these characters would also lend themselves nicely to animation as they do not consist of too many elements which would lead to a simpler animation experience. This would also allow me to develop the project further, perhaps through the creation of more animation or interactive elements for the user to explore.

What type of illustration to use for this project?

This project will be most successful by capturing the audience’s attention firstly with a vibrant and professional art style and then holding their attention with animation and other interactive elements. However, in order for this project to be considered a success the message of the project would have to be passed onto the audience effectively. The main way in which i would have to do this is by making the animation and other elements impactful. This would mean that with a high impact website i will have a greater chance of people spreading this project, and therefore awareness for MS, through word of mouth and social media. To achieve this impact on my audience i have to consider what kind of character to include in my animations. If i were to include a nonhuman character such as an animal then i worry that the audience may distance themselves from the message that i am trying to portray through the animations. As several animated films and tv shows have shown, a highly emotional story can be told and achieved through the use of animal animations. However i question whether the audience is likely to associate the problems portrayed in that animation to their real lives. I believe that with the use of a human character, the animation’s message will be more likely to impact the audience on a personal level and therefore they would also be more likely to share the campaign.