Posted on by

Corona Comics SDK

While browsing the sample code on Ansca’s website, I found the Corona Comics SDK. This framework lets developers easily define panels and camera positions on a graphic novel page. Why did I want to do graphic novel apps? Because my wife, Annie Fox, has a best-selling series for middle school kids that’s a graphic novel! (Middle School Confidential) Maybe my dream of being an app developer wasn’t so crazy after all! :-)

Using the Corona Comics SDK, I used a page from Annie’s books. I could zoom into individual frames and provide a totally unique reading experience (unbook-like). Annie’s publisher, Free Spirit Publishing, was open to a collaboration.

The Comics SDK was in an early form, and my requested enhancements and bug fixes weren’t going to happen soon. So I jumped in and started making the changes myself.

A major feature I added is sound support, both on a page-by-page basis, and frame-by-frame. I’m not talking about “read it to me” narration, but subtle ambient sound, music, and occasional effects to enhance the visual action of the illustrations. A lot more sounds are triggered when you view the app on a frame-by-frame basis. This is because we know exactly where the reader is looking.

Our app, Be Confident in Who You Are: A Middle School Confidential Graphic Novel, was published on April 1, 2011 to great reviews (including Ansca’s App of the Week!).

Releasing Corona Comics SDK 2.0

As of today, Electric Eggplant is releasing our very own version of the Corona Comics SDK. Now, everyone in the Corona community can access all the features of our app.

I’ve seen many posts asking about how to fix this bug or that bug, or add a feature to the original Comics codebase. We’ve now advanced the code base to the next generation and are looking forward to seeing hundreds of new Corona-based graphic novels in the app store!

This isn’t all altruistic on our part. By releasing our code, some of you will add your own enhancements and optimizations, and we’ll reap the benefit of those changes. And since we’re including the first chapter of Be Confident as part of the code base, you may want to buy the whole app for an 8-14 year old in your life.

[EDITORS NOTE: The source is now available at our Github, click to download here.]

Features

Here’s a partial feature list of our Corona Comics SDK. More complete documentation is coming soon (though the code itself is extensively documented):

  • Zoom in/out via double-tap:  Double-tap on a frame and you’ll zoom into it. Double-tap again, and you zoom out. You can continue reading the graphic novel in either mode, but there are a lot more sound effects in zoomed-in mode. It also makes the experience much more like watching an animatic.
  • Hires images:  The artwork we’re using is 2x the size of an iPad screen, or 1536×2048. This means that you can zoom into an image and it won’t get blurry.
  • Separate word balloons layer:  The word balloons for each page are stored in a sprite sheet. Because they’re on a separate layer, they can overlap adjacent panels. For panels with multiple word balloons, we often do additional “camera moves” inside that panel, showing/hiding word balloons as the story progresses.
  • Memory management:  Catches iOS out of memory warnings and clears all page. Also clears pages as you move through.
  • Links:  You can include web links, links to the iTunes store app, or email links. In the case of web links, a web popup opens on the page. The other two take you to the relevant app.
  • Ratings prompt:  After you finish the graphic novel, we prompt you to rate it with an alert. The options include “review now,” “later,” and “never.”
  • Message from a website:  When you go into the Info screen, it checks a file on our web server (you can use your own server, of course) and displays it in a panel that slides up. If the message hasn’t changed, it doesn’t show it again, only new messages.
  • Android support:  We do have this on the NOOK Color, so at least one Android platform works. Not tested on others yet.
  • iPhone support:  Not fully tested, but it should be mostly ready. Our app has some About screens with small text that wouldn’t be legible on an iPhone, so we haven’t actually released a universal version yet.


Posted by . Thanks for reading...

25 Responses to “Guest Post: Behold the Corona Comics SDK!”

  1. Bejoy

    Thx for writing such a informative article. This would help lot of folks get into comics using corona, including me..Will make sure to check out the ipad app..Best wishes and thank you again..

    Reply
  2. David Fox

    You’re welcome Bejoy! After talking with a friend, I wanted to clarify that the code we’re contributing to the archive is not so much an SDK as it is a complete demo app… it’s identical to our complete app in the app store, but with just the first chapter instead of all 8 chapters. The only difference is how many art and sound assets are included, so it’s a lite version with all of the features intact.

    You should be able to substitute your own art and sound effects and have a working comic app!

    Reply
  3. David Fox

    Jay, it’s the same MIT licensed as all other Corona demo code… You’re free to use any of the code, just not our graphic novel page images or the sound/music. The UI images and UI sounds are ok to use, though.

    Reply
  4. J. A. Whye

    David, that sounds great!

    One of the things I thought was cool when I looked at your book was the separate word balloons layer — that “little” enhancement adds a lot to the presentation.

    Looking forward to getting my grubby little hands on it…

    Jay

    Reply
  5. Walt Sterdan

    Bought the app to check it out, very impressive! I wish I had younger children to use it to its fullest advantage.

    Thanks very much for sharing your work, it’s appreciated.

    – Walt Sterdan

    Reply
  6. David Fox

    Thanks Jay! We actually implemented the separated word balloon layer because the original art for this graphic novel series had balloons overlapping adjacent panels. Rather than trying to squeeze them all into the same panel, we looked for a solution that would be true to the original art. But this also gave us lots of flexibility within a panel by having different balloons show up on that panel as you move forward (usually in conjunction with a camera move within the panel).

    And Walt, thanks for the purchase and your appreciation! I wish I had this app when I went to middle school (actually called junior high school back then :-)

    Reply
  7. Igor

    I have some old hand-drawn images, that I scanned in in Black and White, but it appears that B&W images are not working – any ideas?

    Colour images are working just fine…

    Reply
  8. David Fox

    andy and Igor – Just waiting for Ansca to post the code.

    Andy Hullinger – would love to talk to you about your CC_CoordCodeCreator (which I use extensively)! It would be great to have it updated so it could more easily handle the Photoshop file format I’m using which has basically 3 sets of data… positions for the word balloons, the coordinates (as you have now), and the touchable hotspots for zooming in and links. You can reach me my http://www.ElectricEggplant.com website or Twitter: @DavidBFox

    Reply
  9. wintermuteai1

    David: Tested it on my Droid 2 works perfectly! One issue: tilting the phone to landscape it doesn’t display properly, so perhaps make it portrait only for your app,
    as well it would be nice to have a version of this for landscape mode only as well.
    Thanks for updating the SDK, the way you did this with the balloons is very nice as well!

    Reply
  10. David Fox

    Thanks Fully Croisened!

    Hey Alan, thanks! Are you using Corona?

    wintermuteai1 – I had problems with rotation on the NOOK Color version so I turned it off for that platform. I have a Kindle Fire on order, so hopefully I can figure out what the rotation problem is there. I think being able to rotate adds a lot to the experience. Hey, if someone with an Android platform wants to go in and figure out what the problem is, that would be pretty awesome! Works fine on the Corona simulator (even when simulating an Android device) and on iOS devices.

    Reply
  11. paul

    Enjoying the Corona Comic SDK, thanks for all your work!

    This is not the right place to ask this, is there a forum I can ask specific questions about the Corona Comic SDK?

    Where do I increase the page count in the Comic template? it stops at 17, I turned off “lite version” and expected it to go to all the way to 44 but it does not.

    thanks in advance,

    paul

    Reply
  12. Jon

    David – What a wonderful contribution. You’re an inspiration for me to learn Lua and and start using Corona. Thank you!

    On a side note:
    I am having trouble getting the .m4a audio files to load (in the android simulator running on win7). Does anyone know why? A real Android device would accept .m4a files. It seems like the simulator does not currently (at least the windows one)??

    Reply
  13. Micheline

    I dont know if anyone is still checking this but…Ive been using the SDK and STILL cant manage to get my word bubbles to line up into their proper place. Im able to extract coordinates and order them, no problem using Zwoptex but…nothing I try works. If anyone can point me at a solution Id be most grateful.

    Thanks

    Micheline

    Reply

Leave a Reply

  • (Will Not Be Published)