real time drawing in flash?

Discussion in 'Web Design and Development' started by wmmk, Mar 7, 2007.

  1. wmmk macrumors 68020

    wmmk

    Joined:
    Mar 28, 2006
    Location:
    The Library.
    #1
    Hi everyone, I'm doing a photo site, and have what I think is a good idea, but am not quite sure how to execute it.

    To summarize, my family calls my large jewfro 'the mop.' On that basis, I am naming the site MopCreative. I want to draw myself, then draw Chicago's skyline in the background, then draw the site text and lines. After that, text and lines will shape tween into helvetica text and straight computer lines. I am not too sure about how get the real time drawing type of thing. How might I go about doing this? Receding layer masks, or what?

    Here's my beautiful sketch, hopefully the real thing will be a bit better...
    [​IMG]

    EDIT: I also realized that the side of a building makes it look like I have three legs. Sorry to disappoint, but I only have two legs:(
     
  2. Fearless Leader macrumors 68020

    Joined:
    Mar 21, 2006
    Location:
    Hoosiertown
    #2
    hmm... wow... thats hard. Let me think for a while. (just wanted to let you know someone was thinking bout this)

    <chicago look a bit more different than I remember>
     
  3. Aperture macrumors 68000

    Aperture

    Joined:
    Mar 19, 2006
    Location:
    PA
    #3
    That would be quite the project! As I told you before, I would draw the whole thing out on the stage, then use 8 million motion tweens to reveal certain parts at certain times, or as you "draw" them. One question, Is it going to look like that little guy (you) is drawing it? Or is it going to look like you are there and then just writing on the page. Btw, you are bad at drawing. :p

    Edit: Idea... what if you went and took a pic of the Chicago skyline, then traced the picture. The lines drawn of the skyline could eventually fake out and turn into the real pic you took. Just a thought
     
  4. Fearless Leader macrumors 68020

    Joined:
    Mar 21, 2006
    Location:
    Hoosiertown
    #4
    wow no nothings coming to me, though flash isn't my area of expertise, er least confusion. Yea it looks like it would be a bazillion motion tweens.
     
  5. redeye be macrumors 65816

    redeye be

    Joined:
    Jan 27, 2005
    Location:
    BXL
    #5
    You could try not to go for the shape tweens, but leave something to the imagination of the viewer.
    Top layers is collection of drawings.
    Bottom layers is collection of type and lines.

    Then you could make each part(s) of the top layer(s) fade out to transparent, to reveal the underlying type and lines layers.

    If you do it right and maybe add a few motion tweens to show people what to imagine the effect may be just as good.
     
  6. wmmk thread starter macrumors 68020

    wmmk

    Joined:
    Mar 28, 2006
    Location:
    The Library.
    #6
    hmmm...
    the motion tween from drawn to text isn't as important to having things being drawn in real time to me. might I want to do a screen video of the drawing in photoshop, convert that to .flv, overlay a vector identical to the completed drawing at the last frame of .flv, then have that shape tween? or would that take too long to load?

    EDIT: Thanks to kevin (aperture) for the actual photo idea! that's really cool. I'll have to get a good, creative night shot. I've also decided that I'll have 6 lines moving at once to speed things up.
     
  7. redeye be macrumors 65816

    redeye be

    Joined:
    Jan 27, 2005
    Location:
    BXL
    #7
    If you want to draw stuff, you might get around by having a top layer move out of the way (it will be tricky and multi layered for writing though).

    --
    goes to
    -----
    by having a white layer on top move to the right. If you catch my drift.
     
  8. Sdashiki macrumors 68040

    Sdashiki

    Joined:
    Aug 11, 2005
    Location:
    Behind the lens
    #8
    In flash, type some text, then break it apart.

    now you have objects you can tween with something else earlier in the timeline, like a skyline.

    its alot more complicated than just that and will definitely take some trial and error. but having flash "morph" text into a shape or vice versa, is what it does best.
     
  9. wmmk thread starter macrumors 68020

    wmmk

    Joined:
    Mar 28, 2006
    Location:
    The Library.
    #9
    If I understand you correctly, that'd be sort of like my layer mask idea, right?
    Hmm...
    I'm not so sure I catch your drift. Could you elaborate?
     
  10. stoid macrumors 601

    stoid

    Joined:
    Feb 17, 2002
    Location:
    So long, and thanks for all the fish!
    #10
    To get the 'drawing-line effect' you have to work backward. Draw out the whole thing, then add a frame before it and delete a little bit, create new frame before it and delete a little bit until you are down to a frame with nothing. I've done work like this, and remember finding a series of keyboard shortcuts (a combination of three functions I think, that inserts a frame, creates a keyframe of the new frame, and then moves the playhead back a frame) that makes the work go astonishingly quick.
     
  11. wmmk thread starter macrumors 68020

    wmmk

    Joined:
    Mar 28, 2006
    Location:
    The Library.
    #11
    ooh, very cool! you get a virtual cookie from me! can a wacom tablet draw in flash? also, is there any way to make vectors look like handwriting, or will I have to do this all in bitmap?
    thanks so much!
     
  12. Sdashiki macrumors 68040

    Sdashiki

    Joined:
    Aug 11, 2005
    Location:
    Behind the lens
    #12
    A font is a font, text is text. In Flash.


    If you want to morph something, say a circle, into a square, thats easy because both are shapes. And shapes are lines, fills, etc etc.

    Text, is editable as text, so its not lines and fills, its just text.

    You cant morph text.

    If you "break apart" (its under a Flash menu somewhere) the text, you will NO longer be able to type and edit. But, the text is now lines and fills, so you can morph it.

    If you dont understand tweening at all, google a bit before trying this.
     
  13. wmmk thread starter macrumors 68020

    wmmk

    Joined:
    Mar 28, 2006
    Location:
    The Library.
    #13
    Oh, now I understand. I know what tweening is. I am competent, but not advanced in flash. I also get the part about text not being editable as a graphic and editable as text at the same time. Text behaves in the same manner in photoshop. Thanks.
     
  14. MiniMan. macrumors regular

    Joined:
    Jan 2, 2007
    Location:
    UK
    #14
    "you cant morph text"
    Sorry to be rude but your very wrong! If you type some text in flash then brake it apart then brake that apart again then it becomes a fill then it is able to be "morphed" aka Shape Tweened.
     
  15. redeye be macrumors 65816

    redeye be

    Joined:
    Jan 27, 2005
    Location:
    BXL
    #15
    yep, nice


    I think he explained that.
    So you're both right!
    :D
     
  16. Sdashiki macrumors 68040

    Sdashiki

    Joined:
    Aug 11, 2005
    Location:
    Behind the lens
    #16
    Wow, you didnt even read my post. AND YOU QUOTED IT!

    I said exactly what you did, right after you said Im wrong.

    thanks.
     
  17. MiniMan. macrumors regular

    Joined:
    Jan 2, 2007
    Location:
    UK
    #17
    Sh#t im really sorry! i did read it but i must have miss understood. i make an officaly apology, im very sorry.:eek:
     
  18. Sdashiki macrumors 68040

    Sdashiki

    Joined:
    Aug 11, 2005
    Location:
    Behind the lens
    #18
    :p

    no need to apologize, we are all mad here. (in both senses of the word)
     
  19. wavehawk macrumors newbie

    Joined:
    Feb 25, 2008
    #19
    is this the same effect as in the beginning of animator vs. animation?, where he is drawing the victim?
     
  20. Malfoy macrumors 6502a

    Malfoy

    Joined:
    Nov 1, 2005
    #20
    Disclaimer: I am not very knowledgable in flash currently, i plan to be in a few months though.

    I used to play around with 3ds max and maya a bit and with everything that was done, there was a command equivalent that could be easily accessed. If you capable of doing the whole thing in vectors. vectors are just 'math' commands being executed. If you can get access to the 'command history' all you would have to do is draw it once. get all the commands and have them timed to appear in a certain order.

    This is a broad oversimplification but it makes sense to me because I'm saying it. :eek:
     
  21. Artful Dodger macrumors 68020

    Artful Dodger

    Joined:
    May 28, 2004
    Location:
    In a false sense of reality...My Mind!
    #21
    Yes for the Wacom drawing question in Flash as I do all my work using the tablet and the brush or line tool for a hand drawn look. Just scan a ruff drawing into Flash>import to stage>and draw over it on a new layer.
    Any questions or if you need help with your caricature guy, check out my site under the Pet Peeves are cartoons for reference for some caricature ideas.
    www.artjesterszone.com

    Good luck and remember to have fun so you don't end up yelling or barking at the screen :p
     

Share This Page