Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 300
  • Last Modified:

Flash page design as per Mercedes benz

HELLO ALL/HELLO NEGATYVE,

I am interested in designing a Flash with similar ideas/concpts used in the mercedes benz web page.

If have a look at the following website; http://www.mercedes-benz.co.uk/pc/web_special_en/flash.html and click on info.
You will the car rotating and various word appearing and dissaperaing  upon selection. I would like to use similar technique of
using the words as used here and be able to point to things and red line drwan to point to the objects. Also  create the movement
and positionin of the word as per the web page here.

I would like to know how to do this, with a step by step instructions/guide on how to achieve this effect.

Thanks.

0
krishnapatel
Asked:
krishnapatel
  • 3
  • 2
1 Solution
 
r2farCommented:
The words appearing and dissapearing are real easy... Just use Alpha Blending (Step by step for sample below)

Alpha Blending:
1) Draw whatever text you want in whatever font with whatever color, (essentially draw the end product!)
2) Then convert that text into a movie.  Then double-click to edited that movie
3) Within the movie edited moded: break the text twice (ctrl+B twice), then...
4) Select the first frame (and only frame right now) and start a 'shape tween'.  Then...
5) Place a keyframe at the time point you want the text to be fully visible, then turn of tweening on that frame
6) select the first fram again, then, making sure all the broken text is selected, go to the color mixer and set 'Alpha' to 0.
7) now check it out!  Experiment with tweens 'Ease' property to get just the right effect.

* I'll compile a seperate response for the other part of your question to avoid clutter :-)
0
 
r2farCommented:
Oh, about your movement of words first.  You want the move and fade at the same time... that is easy.  Just take the movie you created in the above steps and motion tween it in the scene timeline (give it it's own layer!).

Now, The redlines are a little more envolved!  Each of those red lines must be a movie clip and each text object must be a button.  We achieve the desired effect by using mouse events in relation to the text buttons which we then use to control the movie clips.

1) First make the red line movie clip, this movie clip needs to have a blank 2nd frame and a bounding region 1st frame and the rest will be the animation.  Select the last frame of the animation, and put the stop(); command in it's actionscript.
2) Then, using the movie clips properties, give it an instance name (to be used later).
3) Now we should have a red line movie clip with a bounding box in frame 1 and a blank 2nd frame.  now make the text that will draw the line.  Make the text into a button (you can perform whatever button animations you wish)
4) now, select the first frame where the text and line will be seen and, in a layer designated for actionscript,  place 'instance.gotoAndStop(2)' where 'instance' is the name you gave it in step 1.
5) now select your text button and goto edit it's actionscript... put the following action script under the button (button must be selected)

on (rollOver){
   instance.gotoAndPlay(3);
}

on (rollOut){
   instance.gotoAndStop(2);
}

now if you run the movie.  and move your cursor over the text button, the animation should play once.  move your cursor away and it should dissapear.

If you really want to get complicated, you could try having a rollOut animation.  where the movie clip has 2 animations one after the other, the last frame of the first animation has a stop(); command.  the last frame of the second clip has a gotoAndStop(2).  and the rollOut event has instance.Play();

Only if you want to of course :-)


Hope this helps!
0
 
krishnapatelAuthor Commented:
Thanks I will try this and let you know, sounds interesting....


0
 
r2farCommented:
Well, I actually performed the steps above, so let me know if you have any problems :-)
0
 
krishnapatelAuthor Commented:
Thanks r2far this is great helpI will try this out now.

I would appreciate if you could send the files, if you have already done this my email is rajesh@qclinic.com

Regards
Rajesh
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now