1. We're looking for feedback on Unity Starter Kits! Let us know what you’d like.
    Dismiss Notice
  2. Unity 2017.2 beta is now available for download.
    Dismiss Notice
  3. Unity 2017.1 is now released.
    Dismiss Notice
  4. Introducing the Unity Essentials Packs! Find out more.
    Dismiss Notice
  5. Check out all the fixes for 5.6 on the patch releases page.
    Dismiss Notice
  6. Help us improve the editor usability and artist workflows. Join our discussion to provide your feedback.
    Dismiss Notice

LWF - an open-source tool for bringing Flash animation to Unity and HTML5

Discussion in 'Assets and Asset Store' started by Kazuki_Sakamoto, Nov 16, 2012.

  1. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    LWF - an open-source developer tool for Unity and HTML5


    [​IMG]


    LWF (Lightweight SWF) is a framework for 2D User Interface and 2D Animation. It is based on an animation data converted from an Adobe Flash SWF file. And it also works well with NGUI. Please take a look at the presentation of LWF and the sample.


    LWF in production

    Press Release from GREE, Inc. (http://www.gree.co.jp/en/news/press/2012/1018_01.html)

    [​IMG]


    LWF Presentation

    Description and Implementation of LWF - http://gree.github.com/lwf/presentation20121115/


    LWF Sample

    Basic2 Sample - http://gree.github.com/lwf-demo/unity/basic2/


    Screenshot (Unity Editor, Flash CS6)
    $unity_flash.png


    These samples also work on HTML5!



    How to import your Adobe Flash data into your Unity project




    LWF on GitHub

    Yes! It's an Open Source! Under the zlib License.

    https://github.com/gree/lwf
    http://gree.github.com/lwf/


    Unity PlugIns from GREE, Inc.

     
    Last edited: Dec 6, 2012
  2. aubergine

    aubergine

    Joined:
    Sep 12, 2009
    Posts:
    2,382
    This sounds awesome!
     
  3. liverolA

    liverolA

    Joined:
    Feb 10, 2009
    Posts:
    346
    only for mobile platform? not support windows standalone player?
     
  4. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    LWF should work on windows standalone player as well.

    However unity-systemfontrenderer( https://github.com/gree/unity-systemfontrenderer ) that is an optional component for LWF, doesn't support windows yet.
     
  5. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
  6. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
  7. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
  8. jazzcake

    jazzcake

    Joined:
    Nov 21, 2012
    Posts:
    8
    Hello, Nice work.

    I have things to wonder, I'm looking for 2d skeleton animation solution now. LWF looks perfect solution for me.

    Have no experience on Flash, but google showed me "motion tween" enable to make skeleton animation. and in presentation of LWF, motion tween may be usable. Is it right? and I'd like to know what version of flash is recommended for making artwork. Thanks ahead. :)
     
  9. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    I'm happy to hear that!

    Yes! It is right. We did it like the following.

    $char1.png $char0.png

    I recommend you to use Adobe Flash CS6, but older versions of Adobe Flash should work for LWF.
     
  10. jazzcake

    jazzcake

    Joined:
    Nov 21, 2012
    Posts:
    8
    Thank you, the image you attached is really helpful for me to understand how you did!
     
  11. mohydineName

    mohydineName

    Joined:
    Aug 30, 2009
    Posts:
    294
    Hi,

    This sounds very impressive but I am missing a point: If I make a 2D UI with NGUI, can I "export" it somehow to HTML5 with your tool?

    Thanks

    Stephane
     
  12. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Thank you for your interest, but LWF is not for that purpose even though LWF works well NGUI.

    LWF is based on an animation data converted from a Flash SWF file. It means that you can use Adobe Flash for authoring 2D User Interface and 2D animation. And LWF works well on NGUI, for example, 2D characters on NGUI panel.
     
  13. dev_peter

    dev_peter

    Joined:
    Aug 9, 2012
    Posts:
    38
    are you planing to add AS3 support or is it just for animations?
     
  14. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    We have no plan to support AS3. I recommend you to use Scaleform if you would like to use AS3 on Unity.

    LWF also supports SWF version 3 Action. It allows to control movieclips or to notify events to the application program, for example, at the end of the animation or when a button is pressed.

    http://gree.github.com/lwf-demo/pdf/FLASHforLWFproductionguideline.pdf
    • play
    • stop
    • gotoAndPlay
    • gotoAndStop
    • nextFrame
    • prevFrame
    • tellTarget
    • fscommand
     
  15. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
  16. kenlem

    kenlem

    Joined:
    Oct 16, 2008
    Posts:
    1,593
    This is an awesome project. Thanks for sharing.
     
  17. janimator

    janimator

    Joined:
    Apr 5, 2013
    Posts:
    20
    First I would like to say that LWF seems very promising and looking forward to using it!

    Our team is currently looking to implement this tool within Unity to implement high quality animations in our upcoming game. We ran into a few issues while testing this program and are looking for solutions to help us get LWF running in our pipeline.

    We followed the Unity install steps outlined in the following video: http://www.youtube.com/watch?v=A_AhTosm1NU
    And we also followed the Flash LWF install steps in: http://www.youtube.com/watch?v=K7awPpMplIk

    The problem we ran into was that the same texture was being placed onto the separate images. I've attached a screen shot showing you an example of the issue we're experiencing: http://i.imgur.com/frlxK8M.png

    We've spent some time trying to fix the issue on our own with no luck, so we're hoping we can get some help from the developers.

    Thank you for your time and creating this awesome tool for us to use.

    EDIT: Our developer found the problem, we were trying to use our swf + spritesheet that we ran through the swf2lwf.rb script with a LWFObject script. We changed the LWFObject to a LWFPlayer and it worked. Our mistake.
     
    Last edited: Apr 6, 2013
  18. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Thank you! :D

    Hmm, it sounds odd to me. LWFObject should work as well. Could you share with me your fla, swf, texture sheet and Unity project?
     
  19. komodor

    komodor

    Joined:
    Jan 2, 2013
    Posts:
    30
    hi,
    this technology looks like perfect solution for exFlash developers moving to unity, that's why we are trying to adopt it for our project
    first try led to few errors, probably on our side, but I am just unable to find where we are wrong, can you please take a look?

    when exporting from flash i get this trace

    Warning shape is contained 1. symbole name = root
    Warning shape is contained 2. symbole name = root
    Warning shape is contained 3. symbole name = root
    Warning shape is contained 4. symbole name = root
    Warning shape is contained 5. symbole name = root
    Warning shape is contained 6. symbole name = root
    Warning shape is contained 7. symbole name = root
    Warning shape is contained 8. symbole name = nohy
    Warning shape is contained 9. symbole name = nohy
    Warning shape is contained 10. symbole name = nohy
    Warning shape is contained 11. symbole name = nohy
    Warning shape is contained 12. symbole name = nohy
    Warning shape is contained 13. symbole name = nohy
    Warning shape is contained 14. symbole name = nohy
    Warning shape is contained 15. symbole name = ostatni
    Warning shape is contained 16. symbole name = ostatni
    Warning shape is contained 17. symbole name = ostatni
    Warning shape is contained 18. symbole name = ostatni
    Warning shape is contained 19. symbole name = ostatni
    Warning shape is contained 20. symbole name = ostatni
    Warning shape is contained 21. symbole name = ostatni
    Warning shape is contained 22. symbole name = telo
    Warning shape is contained 23. symbole name = telo
    Warning shape is contained 24. symbole name = telo
    Warning shape is contained 25. symbole name = telo
    Warning shape is contained 26. symbole name = telo
    Warning shape is contained 27. symbole name = telo
    Warning shape is contained 28. symbole name = telo
    Warning shape is contained 29. symbole name = Tween 3

    Publish SWF completed! 0.88 sec


    when converting swf to lwf in ruby i have this 2 warnings

    C:\Ruby193\swf2lwf>ruby swf2lwf.rb dog.swf
    WARN: Shape(16) is not rect.
    WARN: bitmap(nohy_noha_b_z_natazena.png 96x111) is specified UVWH(0,0)-(5,6).


    and when runing in unity i have this error

    NullReferenceException: Object reference not set to an instance of an object
    LWF.UnityRenderer.ResourceCache.<SetLoader>m__1D (System.String filename) (at Assets/Plugins/lwf/renderer/common/lwf_unity_resourcecache.cs:131)
    LWF.UnityRenderer.ResourceCache.LoadLWFData (System.String filename, System.Func`2 lwfDataLoader) (at Assets/Plugins/lwf/renderer/common/lwf_unity_resourcecache.cs:161)
    LWFPlayer.Load (System.String path, System.String texturePrefix, System.String fontPrefix, Single zOffset, Single zRate, Int32 renderQueueOffset, Int32 cachingFrames, UnityEngine.Camera camera, Boolean autoPlay, System.Func`2 lwfDataCallback, System.Action`1 lwfLoadCallback, System.Action`1 lwfDestroyCallback, System.Func`2 lwfDataLoader, System.Func`2 textureLoader, System.Action`1 textureUnloader) (at Assets/Plugins/lwf/wrapper/LWFPlayer.cs:103)
    Dog.Start () (at Assets/Dog.cs:9)



    thanks for your help
     
  20. sonofbryce

    sonofbryce

    Joined:
    May 19, 2009
    Posts:
    98
  21. janimator

    janimator

    Joined:
    Apr 5, 2013
    Posts:
    20
    First I would like to say that LWF is really amazing! It's a pleasure using it.

    I have an issue that I really hope there is a solution for. I'm currently trying to interlace two lwf animations in unity. While in the Unity scene these two lwf animation interlace in 3d space, one always renders completely on top of another. Here's a quick sketch I made below to demonstrate what I'm trying to accomplish. Each square represents a different symbol.
    $3DDQOEM.jpg


    Currently the lwf animation that is closer to the camera will completely overlap the other (Which I don't want). Similar to the Image below.
    $KMSOmvH.jpg
    Is this normal behavior? If so, is anyone aware of any solutions so that Interlacing of 2 lwf animations can be possible inside Unity?

    Thank you for your time.
     
    Last edited: Jun 25, 2013
  22. sonofbryce

    sonofbryce

    Joined:
    May 19, 2009
    Posts:
    98
    I have no idea whether this will work, but you might be able to try switching the camera to Orthographic or setting the Perspective camera to:

    Code (csharp):
    1.  
    2. gameObject.camera.transparencySortMode = TransparencySortMode.Orthographic;
    3.  
    If that doesn't work, it seems like you'd need to build both "halves" into the same swf. I think you could have have two separate movieclips and have them both play with code to "move together".
     
  23. janimator

    janimator

    Joined:
    Apr 5, 2013
    Posts:
    20
    Thanks for the reply sonofbryce.

    From what I'm reading "TransparencySortMode.Orthographic" just makes it so that objects are sorted based on distance along the camera's view. Unfortunately This wont solve the problem of having 2 lwf objects interlacing properly.

    For the project I'm working on I'm not able to build the two animations into the same swf, otherwise that wouldn't been the simplest most obvious solution.

    If anyone have any other suggestions I would love to hear them. From my understanding the problem might be with the way the shaders are rendering the lwf animations. Currently they are rendering based on the lwf objects pivot position distance from the camera, so If i have two intersecting lwf objects, one lwf object will completly render ontop of the other(even though their meshes are intersecting or Interlacing in 3D space).
     
    Last edited: Jul 2, 2013
  24. 1GR3

    1GR3

    Joined:
    Aug 2, 2013
    Posts:
    5
    The same issue over here :(
    All five images, created in flash by converting shapes into bitmaps, are imported into the unity project but in animation, the first one is replacing all the others...
    Do you have any suggestions?

    /* --- EDIT ---*/
    instead of "LWFPlayer" try with "LWFObject"
     
    Last edited: Aug 3, 2013
  25. 1GR3

    1GR3

    Joined:
    Aug 2, 2013
    Posts:
    5
    Can someone please explain how to navigate flash timeline from unity?
    I thought about something like:

    onEvent(foo){
    gotoAndPlay("bar");
    }

    thank you in advance
     
  26. DevMac1

    DevMac1

    Joined:
    Aug 1, 2013
    Posts:
    2
    Hi! I have a problem! WHen I try to convert swf file by lwfs it show me error

    swf2lwf caused an exception:
    undefined method `width' for nil:NilClass

    It's happen only when I use MovieClip in my flash animation! When I use bitmaps it's OK! But I need to use MovieClip! What should I do?

    I use Adobe Flash Pro CS4! And set Flash Player 7 and Action Script 1.0 for export swf file!
     
    Last edited: Aug 28, 2013
  27. 1GR3

    1GR3

    Joined:
    Aug 2, 2013
    Posts:
    5
    I haven't seen this error but I'm sure LWF does not support vector graphics so that might be the cause. In Flash CS5.5 and CS6 you have the ability to convert shape (vector) to bitmap (raster) and with CS4 you'll have to do it elsewhere (Photoshop or Illustrator).
    Good luck!
     
  28. r2digi

    r2digi

    Joined:
    Sep 26, 2013
    Posts:
    23
    kazuki, we just did some quick tests with LWF and it's working fantastic. this tool is amazing!! thank you guys for making this opensource!
     
  29. janla

    janla

    Joined:
    May 8, 2013
    Posts:
    3
    Hi,

    first of all thanks for sharing LWF with us, it's a great tool!!

    I have one question:
    is it possible to call a kind of tellTarget Command from Unity to a clip inside a LWFMovie?

    I basically need to trigger a Movieclip animation, without using gotoAndPlay command.

    Any help is highly appreciated!
    Thanks in advance.

    All the best,
    jan

    PS: i wrote a jsfl script to replace all shapes with pngs, so they can be used with LWF if someone is interested.
    PPS: solved it by converting everything into MovieClips and using GotoLabel to jump to a frame that calls tellTarget from the timeline.
     
    Last edited: Oct 5, 2013
  30. DannyB

    DannyB

    Joined:
    Jun 20, 2012
    Posts:
    214
    Hey - this looks so great I am almost ready to hug somebody...

    But can this be used together with 2D Toolkit?
     
  31. goran-belovari

    goran-belovari

    Joined:
    Aug 2, 2013
    Posts:
    1
    Hi all,

    Let me just say that this is one of the best tools for Unity I ever used, thanks to devs for making our lives easier with it.

    Now, I have a bit of a problem with making lwf work for me.
    Problem is when in Flash I put symbol under a symbol - I can successfully load animation in Unity, but I can't control it.
    Any command that I put (stop, play, GotoFrame) it just gets ignored.

    Could it be it's cause of this hierarchic structure? if yes is there any other way to do it?
    What I'm trying to do is use parent symbol to mirror symbol underneath it - that way I don't have to rewrite all motion paths.

    any help would be very much appreciated.

    Thanks!
     
  32. 3008DMF

    3008DMF

    Joined:
    Oct 27, 2013
    Posts:
    1
    Hi all,

    This tool is really amazing, so then to all involved in development.

    I have a quick question. Is it possible to play a animation in reverse ?
     
  33. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Hi all and sorry I have not noticed so many questions on this thread! I feel like it's too late to answer for the questions, but it might help you or further users.
     
  34. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
  35. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
  36. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    If you are using CombinedMeshRenderer, it always renders completely overlap the others. It doesn't allow to Z-sort for every single bitmap.
     
  37. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    You can use LWFObject.GotoAndPlayMovie API for that. For example,

    lwfObject.GotoAndPlayMovie("testMovie", "bar");

    lwfObject.GotoAndPlayMovie("_root.layer.testMovie", "bar");
     
  38. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Could you try to use the latest LWF https://github.com/gree/lwf and LWFS https://github.com/gree/lwfs ? And if your flash data contains shapes, you should convert the shapes into bitmap. Please take a look at Adobe document http://help.adobe.com/en_US/flash/cs...f99a-7fff.html .
     
  39. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Thank you! BTW, LWF now supports Unity, HTML5, Cocos2d-x, and iOS UIKit :D
     
  40. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Yeah you can control movies via LWFObject GotoAndPlayMovie API, MoveMovie, RotateMovie, ScaleMovie, and so on.
     
  41. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Yes. LWF doesn't affect other components and plugins.
     
  42. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    First of all, you should name the symbols which you want to control. LWFObject GotoAndPlayMovie API allows to use full path to the symbol like "_root.layer.animationMovie".
     
  43. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Yeah, try to use LWFObject.PrevFrameMovie API every update for the movie which you want to play an animation in reverse.
     
  44. andiCR

    andiCR

    Joined:
    Sep 6, 2012
    Posts:
    17
    Hey guys,
    I've been trying to use this today, but I can't get it to work correctly. The animations play with only one texture, so it looks awful. The test flash (01_animated_building) looks like a giant horse with a tiny horse moving on top of it.
    Any suggestions?
     
  45. andiCR

    andiCR

    Joined:
    Sep 6, 2012
    Posts:
    17
  46. andiCR

    andiCR

    Joined:
    Sep 6, 2012
    Posts:
    17
    Sorry for the spam. I managed to fix this problem by using the LWFSampleObject in the sample project. I was trying to inherit from LWFPlayer like instructed in the video tutorial. LWF devs, please note this and either fix the video or fix the LWFPlayer object.

    That said, I love this tool, it's brilliant.
     
  47. andiCR

    andiCR

    Joined:
    Sep 6, 2012
    Posts:
    17
  48. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    Wow, Cool! Thank you for sharing it :)

    Yeah we want to update outdated video and samples if we have enough time to do it.
     
  49. Kazuki_Sakamoto

    Kazuki_Sakamoto

    Joined:
    Jul 6, 2012
    Posts:
    88
    We updated LWF to support Full Color Transform.
    https://github.com/gree/lwf/commit/0b7176b5558405e62e70be65d6210f97234815c4

    Now you can use the additional color parameters in Advanced Color Transform.
    $p_colortransform.jpg

    However it will affect the rendering performance (usually 15% or more, it depends on data and GPU) because it uses a little more instructions in the fragment shader, so it is disabled by default. Set useAdditionalColor argument true of LWFObject and LWFPlayer Load API while you want to use the feature.
     
  50. blastone

    blastone

    Joined:
    Apr 7, 2009
    Posts:
    168
    Hi there. I really like using LWF as a format and have used it a lot in a new project I am working on.

    I wanted to know though if is possible to use multiple atlases. I have a character, a Knight, that works a treat. But I want to be able to customise his armour, his weapon and his helmets. Currently I am limited to the 2048x2048 texture atlas size, but that limits the amount of variation I can have.

    So I wanted to know, is it possible to be able to handle multiple texture atlases or for a single export? Or would the best approach to be to dynamically create the texture sheet to use on the character. I think this would be tricky though as I would have to lose the cropping of transparent pixels in texturePacker.

    Any insight would be really helpful, as I really like LWF and I dont want to swap to another animation format!