Group Assignment - Travel Website

So this is my individual progress and task for my flash group project, Cloud 9 which is doing traveling. We agreed to use the same design and layout for each page to synchronize our website. Then our group leader has been divided the task for each of us to proceed with the flash design and I'm responsible for page Home, Destination, About us, page navigation, button and animation

PAGES & ANIMATION

(1)
1st, I import the La Vie Page as our home page.

(2)
Then I design a button to link it to travel page. When mouse over the Travel button, our home page thumbnail will fade in.


(3)
For our home page, I create a images slide show on the content page. There is 5 images and the animation will stop at the last images.


(4)
For the Destination page, 1st I crop the aeroplane image and import it to flash gallery. Then I import the image of the cloud and do the animation which is the clouds moving slowly from right to the left and a soft animation for the wording.

There is 4 buttons at the bottom and this button will link to other group members pages.


(5)
The Last page is About Us. The concept is quite simple and i just add a simple animation for the content and a static image for the La Vie logo.



BUTTONS & SOUNDS

From the feedback that we got from student in class, most of them likes the button effects. I would like to share a little bit about the buttons. This is the roughly explanation how to create the effects using Adobe Flash cs4.

(1)
For this page, I design a button to link it to travel page. When mouse over the Travel button, our home page thumbnail will fade in.


Then import the travel page image and put on top of the Travel area and convert the image to button.


Inside the button, convert the image again to movie clip and for the UP keyframe, set the alpha to 0%.


The animation will play at the OVER keyframe, then go into the symbol (converted image to movie clip)



Set alpha = 0% at the 1st keyframe and alpha = 100% at the last keyframe and insert classic motion tween in between of the keyframe. Do not forget to set function stop() at the action script layer.


I put a button's sound effect at the HIT keyframe.


(2)
For the Home, Destination and About Us button, i responsible for the rollover effect. When the cursor moving over the button, there is transparent layer will fall down slowly.
When we clicked the button, there a soft sound effect.


1st, using the text tool write Home then convert it to a button.


After created this transparent and gradient object as below using Adobe Fireworks, I import to the stage.


I re-scaled the image at the UP keyframe.


At the OVER keyframe, I convert the transparent image to a movie clip and go into the symbol. I created 2 keyframe and at the last keyframe, I re-scaled the transparent image as below then insert a classic motion tween in between both keyframe.

For the sound effect at this button, I'm using the same method as before.
I'm using the same way to create Destination and About Us button and only change the color.


(3)
The La Vie logo will slowly appear when we mouse over the La Vie button. The way i create this button quite similar as before but the idea is different.


(4)
For this 4 buttons at the bottom of the page, it linked to the other group members. Design and animation done together by all the group members. We put some rollover effect which is the country logo will appear when we mouse over. The method also quite similar with other button.

This button linked to page Malaysia - Abu Suffian

This button linked to page Indonesia - Nur Shasaqin.

This button linked to page Thailand - Nurul Izzati.

This button linked to page Autralia - Amelia.

Finally i would like to thanks especially to my group members; Abu Suffian, Nur Shasaqin, Nurul Izzati and Amelia and not forgotten to our lovely lecturer, Dr. Neo Mai and our 3 lovely assistants, Miss Heidi, Miss Joyce and Miss Sally

___________________________________________________________

JOURNAL REFLECTION...

Some question about this project :-

1. How is your understanding of the topic after doing the project? Understanding about interactive multimedia?

I have learned a lot after finished this project. This is a Flash website, so after doing this project, I know well how to create website and animation using Adobe Flash CS4. Besides, I used Adobe Photoshop and Adobe Fireworks as well to make this website perfect. Now, from what I have learned in class and online module I know how to use the design knowledge such as designing the interface, creating a layout that follows proper design principles, using the right icons, knowing when to use videos/audio/images/animation/text and so on

2. What were the problems faced since Proposal 2? How did you/your team solve your group problems?

There is a problem that I faced when starting to do the website. When I create the website and test movie (ctrl+Enter), it is working perfectly as I wanted but when I publish the html and swf files, when I play, the swf file keep looping. Then I check actionscript and everything in the flash file, but everything looks ok. I try to find the solution at publish setting as well. I have been wasted my time one night for this problem and at last I have found that the problem caused by a flash player. There is Flash player 8 in this computer clashing with flash player 10.

3. What would you do differently next time?

Next time before I start everything, I have to make sure the version of the flash player.

4. How is your motivation level?

Before I figure out the solution for my problem, I am a little bit down but after I know it is caused by a tiny mistake, my motivation level excellent.

5. How was working with your group / group leader?

Overall, it was absolutely great working with my group members.

6. How was it working on the project?

I enjoyed doing this project because it was fun but a little pressure due to the dateline.

8. How were your teammates/Group leader?

Cool and we were close but we are professional in work.

9. Personal evaluation of your own effort and that of your team

A lot of experienced learned how to design a web and animate it using Flash.