Solved

How to create outline for any object in Flash?

Posted on 2004-10-15
21
639 Views
Last Modified: 2012-06-21
I would like to know how to create outline effect (or Glow, I am not sure what they call it), but i can explain how it looks.

It the outline (white lines) on the edge of an object which move to give the object glow effect.

Okay if can get me please check the link below and the effect I am talking about will happen when the house in the like appear.

http://www.templatehelp.com/aff/preview.php?aff=freesitetemplates&skin=21&locale=en&currency=0&pr=yes&src=yes&nt=yes&help=yes&sample=yes&faq=yes&nmg=yes&auth=yes&down=yes&chm=&hide_flash=0&search=&PHPSESSID=49c8b80bfa467ada2419de7d9c10f266&referer=http://www.freesitetemplates.com/templates/premium.php/Real%20Estate/&i=5488

Thanks for your help...
0
Comment
Question by:BINZAYED
  • 8
  • 4
  • 4
  • +3
21 Comments
 
LVL 5

Expert Comment

by:badrulnm
Comment Utility
I think the trick to do that kind of effect is to trace the outline of the house in Flash using Pen Tool (P) with Stroke color set to white and Fill color set to blank. You can also do it with Line Tool (N). Then, with a litle bit of fading animation, you're done.
0
 
LVL 6

Expert Comment

by:nishasrilankan
Comment Utility
0
 
LVL 8

Accepted Solution

by:
Cerf earned 250 total points
Comment Utility
I have done it the same way badrulnm said, the result is good.
Tip: put your image in a Layer, lock it, add a new layer, and play with the zoom to get closer lines to the image.
Images tend to distort a lot when zoomed but if you follow them you'll end up with a nice outline.
I have used the line tool (N) and then the selection tool (V) to make the curves.

There are probably better methods but this one works.

I would love to see what other people do,

Cërf.
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
Okay, here's my 10 cents!

Follow badrulnm's first step in tracing the image, and drawing the windows in a new layer (have
the house image in a layer at the bottom) - make this new layer a mask layer.  Then add diagonal soft
shaded lines (white lines, dark background) in the layer to show through the outline mask, and animate it left to right.

If you look closely, you can see that there are two shaded lines beneath the mask - one going left,
and another angled in the opposite direction, and also moving in the opposite direction.

A semi-transparent layer on top, just covering the windows might have been used too...

muso
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
Actually looking again, it looks like there are 2 separate masked layers, with the house outline
highlight going left, and the window highlight going right.
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
Sorry, yet another note - you can't use the line tool for a mask - it would have to be a cut-out shape, although
I'm not entirely sure how this would be made (maybe someone else could help with that!)
0
 
LVL 7

Expert Comment

by:fixitben
Comment Utility
Wait Muso You had it right but once you create the thing using the line tool you need to select all the lines  Then  go up to Modify>shape>convert lines to fill that will convert all lines to fill that way you can use it as a mask


Fixitben
0
 
LVL 7

Expert Comment

by:fixitben
Comment Utility
Also the best way I have found to do this is to either draw it in like someone said or go into photoshop and create a stroke then hide image and then you will just see the stroke then export that then show image with out stroke and export that.  Then import both into flash and make the stroke the mask layer that masks  a faded image that goes from say alpah 50  to 100 in the middle and 50 again on the edges that will give it the effect of shining.  Check this out http://teenz4god.com/prayer.asp  this is with out the alpha tweening but you can get the picture look at the button.  Also Check out my preloader at http://theyac.org on the photogallery  that was how I got the outline of the yak was doing the photoshop thing.

Hope this rambling stirs up some thoughts

Fixitben
0
 
LVL 8

Expert Comment

by:Cerf
Comment Utility
cool!
>> Modify>shape>convert lines to fill
never took the time to see that!

Cërf.
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
> Then  go up to Modify>shape>convert lines to fill that will convert all lines to fill

Nice one fixitben ;-)

muso
0
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

Author Comment

by:BINZAYED
Comment Utility
WaaaaaaaW

Thanks Guys
0
 
LVL 8

Expert Comment

by:Cerf
Comment Utility
No prob,
glad we could help,

Cërf
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
Hi BINZAYED,

Glad we helped, but just out of interest, who's suggestion are you using, or likely to use, for the "glow" effect?
0
 

Author Comment

by:BINZAYED
Comment Utility
Dear Muso,

Could you elaborate more? Please.

thanks
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
Comment from Cerf:
>  I have done it the same way badrulnm said, the result is good.

I only asked because whilst Cerf did well in explaining how to draw the outline, he was also
backing up badrulnm's original comment which went into creating a "glow" effect.  I just felt
that if that suggestion worked for you then maybe the points could have been split between those
two!  That's all!

muso
0
 
LVL 8

Expert Comment

by:Cerf
Comment Utility
I agree
0
 
LVL 5

Expert Comment

by:badrulnm
Comment Utility
Thanks muso & cerf for giving me some credit on my comment.
Glad I could help, but, may be I could use a litle bit more explanation in my post.
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
This may be too late to be any use, but I now have just found this tutorial which creates the exact required effect...

http://www.tutorialoutpost.com/count/305

Just thought I'd add it in case someone here found it useful :-)

muso
0
 
LVL 7

Expert Comment

by:fixitben
Comment Utility
Yeah Muso That is where I found that convert to fill thing Along time ago.  That is the only reason I found that Convert to fill thing.  It is a small world.

Fixitben
0
 
LVL 10

Expert Comment

by:muso120999
Comment Utility
It's a good tutorial, but you didn't suggest it for this question!!

> It is a small world.

and a lot smaller with the internet!
0
 
LVL 7

Expert Comment

by:fixitben
Comment Utility
yeah I couldn't find it again that is why.  But that is where I remebered the convert to fill thing from.

Fixitben
0

Featured Post

Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
How to disable  HTML5 video in chrome 2 1,525
HTML 5 or Flash 7 475
FLV versus SWF 11 263
adobe flash plugin has crashed while listening to pandora 2 62
In my long career of working as an actionscript developer, I had spent sleepless night often working hard to solve some small problems which actually took a lot of my development time; later found out the solutions to be a line or two. Here are s…
The last time I worked with Flash and Socket connections was in AS1. A recent project required flash connecting to a Socket, and sending receiving information - we figured it would be easy enough - we all know about the socket policy documents and c…
The goal of the tutorial is to teach the user how to set there setting in Adobe Flash Media Live Encoder and YouTube for optimal video and audio quality.
The goal of the tutorial is to teach the user how to select which audio input to use. Once you have an audio input plugged into the laptop or computer, you will go into the audio input settings and choose which audio input you want to use.

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now