Posted on by

[UPDATE: A new Composer GUI Beta is now available]

Today, we are seeding out a new product that we call the “Composer GUI”, a visual editor that allows you to rapidly create scenes, user interfaces, and game levels!

It allows you to visually design in a drag-and-drop GUI interface. And as the name suggests, the Composer GUI is designed to work in conjunction with the Composer API.

Here’s a quick video to give you a sense for what you’ll be able to do with the Composer GUI:

In addition, we designed the Composer GUI to be an integrated part of Corona Simulator. When you edit scenes in Composer, the Simulator automatically refreshes just like when you edit/save Lua files. You’ll also be able to preview individual scenes within Composer itself for even faster iteration.

As you can see, there are lots of great features. For example, timeline animation and physics body editing will dramatically speed up your app development. We envision Composer GUI being used in many different ways:

  • First, it makes Corona even more accessible by allowing people with no coding experience to get up and running very quickly.
  • Second, it allows experienced developers to design UIs or levels in a fast and visual way and then refine/augment by further coding.
  • Third, it improves team workflow by allowing members like designers to lay a scene out visually before passing it on to developers.

Early Beta Access

Before I tell you how to get access, I want to mention that the Composer GUI is very much a work in progress. It’s beta, but a really early beta. So even though we’ve integrated it into the daily builds, it won’t be visible by default. It’s something you’ll have to “unlock”.

To play with (and unlock) Composer GUI, you’ll need to have a Pro (or higher) subscription:

  1. Download daily build 2014.2264 (Mac only for now)
  2. In Terminal, run the following command:
    • defaults write com.coronalabs.Corona_Simulator enableExtensions -bool YES
  3. Run the Corona Simulator and you’ll see an option for ‘Corona Composer’ on the Welcome window. It’s also accessible from the menu: ‘Window’ => ‘Corona Composer’.

Docs

The best way to get up to speed is to go through the tutorial walkthrough which parallels the video, and shows you how to take a starter project and turn it into a really cool sample.

A list of known issues is available at the bottom of the preliminary Composer GUI docs site.

Feedback

We’ve created a special forum for your feedback/comments.



The Composer GUI furthers our vision of making Corona the tool of choice for designing, developing and distributing rich interactive content. It is still very early in its lifecycle, but we are looking forward to seeing how you use it and to your feedback!


Posted by . Thanks for reading...

36 Responses to “Composer GUI Beta”

  1. Peter

    Yay! It’s early still, but since something similar was demoed over 2 years ago, I’d thought you’d abandoned this idea. Having a GUI like this will attract so many more people to Corona. This is great! I’ll get to work on using this and finding as many bugs and workarounds as I can. Thank you, Corona!

    Reply
    • Andreas

      While I love Corona and the ease & speed of development the SDK gives me I guess it will be a long way till this is as mature as LevelHelper & SpriteHelper. I did my last game “Freeze!” (six million downloads so far) using these tools, and the features are awesome. Couldn’t have done it without them.

      But on the other hand I understand completely why Corona Labs has to do this and has to offer a GUI, it is absolutely needed to attract more junior developers and to speed up the normal development process for all people not using 3rd party tools so far.

      I just don’t understand why Corona Labs is doing this themselves and why they are not doing a cooperation with e.g. the developer of LevelHelper – I myself hate to re-invent the wheel. And to code a complete GUI that needs to support physics, spritesheets, ideally custom classes for objects, bezier paths for movement, etc. is really a lot of work.

      So I congratule Corona for doing this, but I will not remove LevelHelper & SpriteHelper from my workflow right now (if ever).

      Best,
      Andreas

      Reply
    • Walter

      I think Bogdan’s LevelHelper and SpriteHelper are fantastic tools. Lots of power features for game developers. I don’t see Composer GUI needing to be a replacement for that.

      Our approach has been to add functionality to the Lua API (e.g. composer API), and then build GUI features on top of that. This way, anyone can take advantage of them. A good example is when we added particle emitter support (display.newEmitter) to the API. While the parameters are based on properties defined by the ParticleDesigner GUI, the API itself can be leveraged by any 3rd party tool.

      Reply
  2. Dan J.

    Not having a visual editor was the biggest weakness of Corona, in my opinion… and now there’s this! Wooo

    Reply
  3. shawn

    This is Great news. Any chance all of the widgets will be “drag and dropable” that would be an amazing time saver.

    Reply
  4. MarinK

    Great work, congrats guys! This is one of the biggest things corona sdk was missing!
    I’m gonna test it out in a next couple of days, looking forward to it.

    P.S.
    Does LevelHelper even work on Mavericks? Developer isn’t responding to emails and isn’t updating his apps any more.

    Reply
    • Andreas

      Yes, I work with LH & SH on Mavericks and all is fine, even with Graphics 2.0.

      As far as I know he is hard at work on LevelHelper 2 with timeline support (think Flash, so you can add komplex scripted animations etc.) and other stuff, I got a beta version from him because I used LH so much. :-)

      Best,
      Andreas

      Reply
  5. Dave baxter

    Drag and drop widgets would be fantastic as shawn says. Am doing a business type app now and doing the layouts the slowest part.

    Dave

    Reply
  6. David

    This looks nice Walter. The demo was very well done. I’m sure ya’ll are busy but if anyone ever has the time it would be very informative to know how to accomplish horizontal and/or vertical scrolling. For example, the demo video shows a road – how would this new tool be used to implement the flying saucers chasing the mice in what would appear as left-to-right motion?

    Thanks in advance,
    David

    Reply
  7. MarinK

    @Andreas
    I sent email to vladu back in october, never anything back from him. Since it works on Mavericks (trial version doesn’t, you cant go to register as trial) I’ve just bought the app. And all works like a charm. Thank you for the info :)

    Will use LevelHelper and coronalabs app for the time being, and I also hope that corona will manage to squeeze widgets in this composer gui :)

    Reply
  8. Alessandro Grigiante

    WOWWWWW….. Finally Corona has an official GUI tool!!
    This is a very good news and a great step ahead for Corona SDK.
    I can not wait to use the new Corona Composer for the next Corona workshops I hold around the Italy.
    The next one will be in May in Turin and I will change all my presentation with the new Corona Composer :)
    Thanks Walter, very good job!

    Reply
  9. Hector

    This is a great start, well done!

    I followed the tutorial and I see the use of “getObjectByTag” like this:

    self:getObjectByTag( “plasma” )

    is this a feature of the new scene editor? Where can I learn more from it? I imagine there has to be something to grab an item by its id like self:getObjectById( “plasma” ) or something like that

    Regards
    Hector

    Reply
  10. George

    That is great news! I was missing that thing so much!
    If you do it it will be great job guys!

    Reply
  11. Benny

    Looks fantastic. I really needed this when I tried to make an adventure game last year :) Loooots of pixel corrections.

    Reply
  12. Mo

    Same question as David above. Is is possible to setup scrolling of the background in a parallax way? (Ie: multiple layers) Also, is it possible to work on a bigger scene than the screen size selected?

    Thanks.

    Mo

    Reply
    • J. A. Whye

      Mo, as far as parallax scrolling goes, I used the timeline feature today to create a scrolling foreground and background. By moving them at different rates I got a parallax effect.

      Of course, at this point there’s no “onComplete” or loop or anything like that so once it scrolls one time you’re done, but it can be done. :)

      Jay

      Reply
    • J. A. Whye

      It will pick up assets from folders in the project (and from the root of the project, I believe). So you don’t import assets, they just show up based on images that are in the same location (and below) as the .ccscene file you’re making.

      Reply
  13. GregH

    Would this be the tool to use when laying out widgets & objects in a business app (non-game) then I’m wondering, which is tedious at the moment? Can you align widgets up against each other or the side/top of the screen such that for whichever device they’ll set themselves accordingly?

    Idea: Would be good if it supported laying out the same view/screen in both Portrait and then Horizontal, so when the user swaps orientation that widgets realign themselves accordingly in the way that makes most sense. (thinking of business apps/widgets here)

    Reply
  14. Gabriel Sieben

    Wow, great job! I actually only started out with the Starter version of Corona SDK about a month ago. I was hoping this would be available for me to try out with Starter, but I guess I just need to wait 2-3 months. I could just update to Pro, but I (sadly) have no reason for paying that much, especially after I do not know if Corona SDK is for me.

    Reply
  15. Ahmed

    Thanks Walter,
    I can see that Composer GUI is built using Lua!
    have you used Corona SDK desktop for that? if not, would you mind telling us about the framework you have used!?
    Best regards
    Ahmed

    Reply

Leave a Reply

  • (Will Not Be Published)