Production Stage
My first stage of developing my website is to create a smoke animation. I created this in Photoshop and Flash mx. As my website is based on smoking I want to have an animation incorporated in my website that represents the act of smoking. I want this animation to be fun, but not too distracting at the same time, as the information I intend to provide is more important than entertaining my viewers. However entertaining my viewers will not COMPLETELY dismissed!
The first thing I did was to create a cigarette in Photoshop. This took me a very long time, as I haven't used the programme for a while. I decided to create my own in photoshop as opposed to using a cigarette image from the Internet. As I will not be taking photographs of my own, I will use my own created images as a replacement.
This is a Cigarette I created. I began by creating a white rectangle, then by adding a brown rectangle at the end. I added some grey colouring (on the white section) and some darker brown colouring (on the brown section) at the bottom section of the Cigarette to create the effect of shadows. This makes the Cigarette appear 3-Dimensional, and makes the Cigarette look more realistic. I created 'ash' at the end of the Cigarette by adding reds, greys, yellows, oranges, and blacks. As a final touch I decided to draw a black line around the white section of the Cigarette to make it look like the manufacturer's label (company name).
This is the smoke I used in Photoshop. This will move up and down from the Cigarette. Making the whole image look real.
I am unable to blog the actual animation, so I have put the smoke and the cigarette together as an image with a black background (similar to what my website will look like).
This is what the two look like when put together!
My first stage of developing my website is to create a smoke animation. I created this in Photoshop and Flash mx. As my website is based on smoking I want to have an animation incorporated in my website that represents the act of smoking. I want this animation to be fun, but not too distracting at the same time, as the information I intend to provide is more important than entertaining my viewers. However entertaining my viewers will not COMPLETELY dismissed!
The first thing I did was to create a cigarette in Photoshop. This took me a very long time, as I haven't used the programme for a while. I decided to create my own in photoshop as opposed to using a cigarette image from the Internet. As I will not be taking photographs of my own, I will use my own created images as a replacement.
This is a Cigarette I created. I began by creating a white rectangle, then by adding a brown rectangle at the end. I added some grey colouring (on the white section) and some darker brown colouring (on the brown section) at the bottom section of the Cigarette to create the effect of shadows. This makes the Cigarette appear 3-Dimensional, and makes the Cigarette look more realistic. I created 'ash' at the end of the Cigarette by adding reds, greys, yellows, oranges, and blacks. As a final touch I decided to draw a black line around the white section of the Cigarette to make it look like the manufacturer's label (company name).
This is the smoke I used in Photoshop. This will move up and down from the Cigarette. Making the whole image look real.
I am unable to blog the actual animation, so I have put the smoke and the cigarette together as an image with a black background (similar to what my website will look like).
This is what the two look like when put together!
My created Cigarette and created smoke.I have decided to do some research on the reasons why people start smoking for my 'Why Do We Start?' page! I have also been researching the effects of smoking - to present in my 'Smoking Related Illnesses page'. These are some of the useful sites I have been looking at:
Each of these websites have provided me with appropriate information, in which I will incorporate into my website.
Splash Page
My Splash page is going to be the most animated section of my website. It is now completed an opens with 'Smoking... We are aware that its glamorised...But are we aware of it's effects?' This is portrayed with a number of the images that I previously edited. These images are of celebrities, to reinforce the fact that they glamorise smoking.
These are the images I decided to use on my 'Splash' page!
The font of the text portrayed in the 'Splash' page is 'Stencil STD' I feel that this font is readable and fun at the same time. - I need a font that isn't too boring, the first page is the most important as it determines whether a consumer will continue to look through my website. As my target audience is teenagers, I will need an element of fun and animation to arrest their attention.
This is the first thing my viewers will see when they open my website. This is the first section of my 'Splash' page. The Stencil Std font stands out, it is large enough to gain attention and be read. The gradient colours black and white add to the sombre tone of the website. The little grey section behind the text is smoke, this moves up and down, it is presented as though coming from the Cigarette. The images above fade in and out one by one.
Home Page
I have started work on my 'Home' page - at the moment it is extremely simplistic. It has a black background, with a blue rectangle which has my page titles (buttons leading to those titled pages) on it.
I have started work on my 'Home' page - at the moment it is extremely simplistic. It has a black background, with a blue rectangle which has my page titles (buttons leading to those titled pages) on it.
My buttons are simply the titles of the pages - for example, the button for the 'Questions & Answers' page is 'Questions & Answers'.
This is the the first draft of my 'Home' page. At the moment it seems a little boring. Almost as though something is missing. I'm happy with the appearance of my title and the 'buttons section'. I feel that the blue stands out, this will prevent any confusion as to where my buttons are. The consumers eye will automatically be drawn to the button section! The text included on this page is a brief description of what each of my pages contain.New Idea
While researching websites I've noticed that most organisations have 'About Us' and 'Contact Us' pages. As I am promoting an Organisation (Luxury LungZ), I think it will be appropriate for me to create these additional pages. I also feel that my website will be quite empty without them, as once my consumers have viewed my 'Splash' and 'Home'page they will be left with only three more pages with informative content. I don't feel this is enough, particularly as I am supposed to be providing a service (offering info on smoking). My consumers need to feel as though they can learn more of what is presented on my website, I will do this with the presentation of a 'Contact Us' page.
I will also provide information on what my company is and what it aims to achieve and who it is aimed at in my 'About Us' page.
About Us Page
This is my about us page. While designing it in Flash, I decided to add my logo to the page. This reinforces the identity of my organisation (Luxury LungZ). However before adding this I edited it. My original logo had very little smoke, which was almost unnoticable, however I have now edited the image making the smoke much more clearer. My Logos - Old & New:
This is my first logo design.
This is my new (and improve) logo design. Smoke much more noticeable, making overall image more effective.Contact Us Page
I've also created my 'Contact Us' Page.
This is my Contact Us page. It also contains the company (Luxury LungZ) logo in the background. These two pages are extremely simplistic and contain no animations. I feel that they are straight to the point, reinforceing the idea of the information being the most important aspect of the page. Smoking Related Illnesses Page
This page will contain detailed information on the dangerous effects of smoking. It will also contain disturbing images of people who suffer from smoking related illnesses. The aim of this is to instill fear into my viewers, as according to Hans Wilhelm (2008) "…the sensation of fear is identical to the one we have when we are excited". This is the reaction I would like to evoke as excitement and anxiety are quite similar. I aim to excite my viewers into wanting to absorb more of the information presented on my website.
WilHelm, H. (2008) Facing The Winds Of Change. [Online]. Available at: http://www.hanswilhelm.com/hans-pages/pure-inspiration.html (Accessed: 29 Oct 2008).
WilHelm, H. (2008) Facing The Winds Of Change. [Online]. Available at: http://www.hanswilhelm.com/hans-pages/pure-inspiration.html (Accessed: 29 Oct 2008).
This is my 'Smoking Related Illnesses' page so far. I'm aware that each page will follow a certain template, which is the buttons on the left side (as shown in image) with title of the page in large white 'Stencil Std' font, however I am unsure at the moment of what information I will include and how I will present it. While creating this page, I decided to work on what may make my pages more interesting. I decided to have my company name (Luxury LungZ) at the bottom right hand side of the page. This flashes so that it goes from being apparent to being invisble consistently. I feel that although I initially planned to have a theme of black and red the extra colours, white and green make the website appeal more to my target audience (teens).
Why Do We Start Page
This page will not contain any animations. As my organisation aims to prevent people from starting to smoke, this is in a sense the most important page! All the focus must be on the reasons why people start to smoke...
I feel that perhaps if people were aware of the reasons people started to smoke, they may not start themselves for example, many people start smoking as they hear it relieves stress. Perhaps if potential smokers were aware of this, they may make attempts to prevent themselves from becoming stressed, thus preventing them from needing to smoke to relieve their stress.
This is my 'Why Do We Start' page. Although there are no animations, the (large amount of) text in a sense makes up for it.
Questions & Answers page
The research for this particular section was the most tedious. I had to walk around my University and home area asking 13-21 year olds what they would like to know about smoking. I asked 40 different people the same question (and record the answers) to gain a range of answers in the hopes of presenting the most asked questions on my website.
This page I feel is also one of the most interesting (along with my splash page) the layout of the page is extremely attractive. I have added a similar animation(similar to splash page animation) of smoke rising up the page. This page appears motionless at first sight, however it is saturated with rollovers. The question is presented in red text and the answer is presented in white text once the viewer rolls over the question with their mouse. I have presented 13 questions on this page. Initially I was worried that my viewers wouldn't be able to find the answers to the questions presented and would ultimately become frustrated. However after showing the page to some of my peers, it appeared that in order to find the answers to questions, people naturally ran their mouse over the questions. Also due to the positioning of the buttons (which are on the left of the page), I learned that as most mouses require right hand use, most people feel more comfortable to move the (mouse) arrow to the right hand side of the screen after pressing the buttons (on the left). In doing this, they were ALL flashed with the answers before reading the questions.
The page is very busy and in correspondence obtains a simplistic theme. The animation of the smoke and the logo (Luxury LungZ), in a sense brings the page to life.
Back to the 'Smoking Related Illnesses' page
I've decided that this page will be similar to my 'Questions & Answers' page with the consistent use of rollovers. The page is categorised into four sections. Each section focuses on particular smoking related illnesses. There is A 'Cancer', 'Diseases of Cardiovascular system', 'Diseases of Respiratory System', and an 'Effects on Pregnacy' section. I have added images, to each section so that when readers rollover the text, they are presented with a visual version of what they have just read. For example, the Cancer section has a list of different Cancers that can be caused by smoking, when rolled over with the mouse a photograph of a man with a neck tumour is presented.
These are the images used for this page.
This is presented in my 'Cancer' section.
This is presented in my 'Diseases of the Respiratory System' section.
This is presented in my 'Diseases of the Cardiovascular System' section (represents idea of possible amputation).
This is presented in my 'Effects on Pregnancy' section.
This is my 'Smoking Related Illnesses' page. I feel that the extreme contrast in bright colours again reinforces the fact that my website is aimed at teenagers. It obtains a cartoon - like theme - the use of bright colours.
I've been reviewing my website before adding sound and I feel that the word 'dangerous' needs to be emphasized on my splash page (...But are we aware of it's dangerous effects?).
I've decided to make the word 'dangerous' flash from black to white quickly, adding an element of horror to my Splash page. This also reinforces how dangerous smoking is...
The word 'dangerous' starts on the colour black...
...and flashes to red. This continues until the words eventually fade out!
No comments:
Post a Comment