This past Monday I gave a presentation on Corona Geek about different graphics software that can be used to create app artwork. Check out the video with show notes here: http://coronalabs.com/blog/coronageek/corona-geek-hangout-92/ or just watch the video below.
I recently watched “Dear Mr. Watterson“, the new documentary about Calvin and Hobbes’ and their creator. It reminded me of how my childhood dream was to become a cartoonist. Seeing current cartoonists still drawing on paper inspired me to pick up a sketchbook and a pen again. I actually haven’t drawn on a piece of paper since I was first able to afford my first Wacom tablet in 2005.
I was quickly reminded of how much I rely on digital luxuries like undo, straight line, color picker, copy, paste, etc. Regular drawing is a lot more difficult than I remember.
After I drew some crude initial character sketches, I decided I might want to use the drawings in my latest app for Maddie Bear Books. Instead of using my wireless scanner to scan in the pages to my computer, I decided to use my iPhone, which was already in my pocket. I took a picture of the sketch, dropped it over to my Macbook using DeskConnect and imported it into Adobe Flash.
There’s a feeling of something very native of drawing with pen and paper that I had forgotten about. Something about the feel of the pen or pencil touching the rough surface of paper that digital tablets can’t seem to replicate. I still prefer to color and finalize drawings digitally, but it’s a nice break from a computer screen.
I’m always looking for new software that makes creating mobile apps and artwork easier or even just makes the process more fun. Last night, I discovered Mischief drawing software, and I have to say, I’m pretty impressed. You can go to their website www.MadeWithMischief.com and download a free 15-day trial to test out for yourself. If you like it, a full license is only $65 USD.
So what is Mischief? I think it’s a cross-between Sketchbook Pro and Adobe Flash, which if you follow my blog and tutorials, you know I’m a huge fan of both (Flash CS6 at least, I’m still iffy about Flash CC). It has a user interface similar to Sketchbook Pro, but instead of bitmap, it’s vector-based, allowing you to zoom-in infinitely to draw the smallest details. Since it’s similar to Sketchbook Pro, the interface is very straightforward and not much is hidden in submenus up in the toolbar. It has the ability to export JPEG and .PSD files, so if you are a Photoshop user, you can enhance your artwork further. I’ll probably use the .PSD export feature to convert my files into .PNGs for mobile applications.
Although it isn’t necessary, they do recommend that you use Mischief with a drawing tablet to get the full-effect. This is true of just about all drawing software, though. If you’re fortunate enough to have a Wacom graphics tablet at your disposal, I think you’ll really enjoy using Mischief. Without even going into my Wacom preferences, Mischief already allowed my “Undo” shortcut button to function and pressure sensitivity works flawlessly. In all honesty, I think Mischief is more responsive to a drawing stylus than Adobe Flash.
If I had to list any negatives about Mischief, I would say it’s the lack of a paint bucket tool. I know it’s more geared towards artists who color in layers with different types of brushes, but I’m still a huge fan of being able to paint a large area with a single click. If they were to add a paint bucket tool, I might switch over completely from Flash to create artwork for mobile applications.
Overall, I would definitely recommend checking out Mischief if you like to draw. I know I’m going to be utilizing the 15 day trial as much as I can. Check out my demo video here: http://www.youtube.com/watch?v=LjY-mzuArQs or watch it below.
I’ve received quite a few emails recently related to creating app artwork, so I decided to create a video demonstrating my process. Enjoy!
A few weeks ago, I wrote about how I wasn’t impressed at all by Adobe’s Creative Cloud announcement. I don’t like to write things off without trying them though, so I decided to give it a shot. Since I own versions of Flash, Photoshop, and Dreamweaver CS6, I was able to sign up for $21 a month. Once payment cleared, I was met by some confusion, but I figured a trained Adobe associate could easily help me.
Once Adobe CC was paid for, Adobe Application Manager opened, so I figured I’d try out all these “new and improved” features of Flash CC. However, next to Adobe Flash in the list it said “Up to date.” I thought this was bizarre since I just watched Adobe video displaying their reasoning of why you need to upgrade to CC, but here I was unable to upgrade even after paying for it.
I contacted Adobe via chat support and asked the representative why I couldn’t upgrade to Flash CC after purchasing their cloud subscription. He didn’t know why, so he put me on hold for about 5 minutes. When he returned, he said it takes up to 48 hours before you’re allowed to download the software. I said I’ve never had that issue before, when I purchased CS5.5 and 6, I was able to instantly download the files. He told me to wait 2 days before attempting to download Flash CC.
I also asked him once I download Flash CC, if it would overwrite my Flash CS6. I stressed the importance of me being able to run both CS6 and CC on my computer in case I decide to opt out of CC in the future, I need to know my CS6 is safe. He was very confused on why I would want to keep CS6, but after about 10 minutes of back and forth, he said he would have to ask someone and to please hold.
About 20 minutes later he returned to our chat and he said I should be able to run both versions. I wasn’t confident in any of his answers, so I thanked him for his time and ended the chat. Later that night, I was researching my questions and came across a forum that said Flash CC doesn’t exist yet. The announcement by Adobe was just to showcase what is coming soon, but a CC membership just promises you the update in the near future, not new software right now. I’m not sure why the representative I spoke to didn’t know that or tell me that. So apparently, me signing up for $21 a month for a year just gets me access to their current CS6 line at the time of this writing.
Since I already owned Flash, Photoshop and Dreamweaver CS6, right now the CC subscription is worthless to me. I don’t use any of their other products since the amount of video/sound editing I do is so rare, I’m fine sticking with Audacity, iMovie, iDVD, and Garageband. I did download After Effects, Premiere, and Illustrator just because I paid for them, but honestly, I haven’t even opened them since I downloaded them 2 weeks ago.
Overall, I’m still not a fan of Adobe CC. Right now the subscriptions just gets you access to their existing software, and if you already own some of it, it’s pretty much a waste. I can’t comment on the new versions since their not available to the public yet. Their online chat support was of no help, and I’m going to be out $252 if there’s no vast improvements in their software within the next year. Here’s to hoping they release something amazing soon and prove me wrong…
Adobe officially announced their release of Adobe Creative Cloud yesterday at Adobe Max. This will affect many mobile application developers in some form since most artwork for apps is created using Photoshop, Flash, and/or Illustrator. Some of you may even use Dreamweaver or Flash to directly develop apps.
What does this mean for Adobe users? Well, the most noticeable difference is that you’ll no longer own their software. Buying Adobe Photoshop CC isn’t an option, you can only rent it from them. Adobe claims this model is great because using their cloud service, it will remember your tool preferences across multiple devices, you can save files to the cloud, collaborate more easily and share your work with a growing community of other creative individuals. That sounds like a lot of positive features, but let’s break it down.
Personally, saving my tool preferences across multiple devices isn’t an selling point. I do all of my work on one computer and only use my iPad for jotting down ideas or light sketching. This may be great for some people who will really appreciate it, though.
Saving your files to the cloud so you can collaborate is a nice feature. Unless you’re already using DropBox, a network, or other file sharing service. Since I own webspace and have 4 gigs of free DropBox space, Adobe’s Cloud service doesn’t interest me personally.
Finally, letting other members of the Adobe community see your works in progress for feedback. I’m very hesitant about that feature. I have rarely ever seen constructive criticism posted on the internet about anything. People tend to hide behind a user name to post derogatory comments, so I’m hoping this would be heavily moderated. Plus, when collaborating, you often sign non-disclosure agreements so you wouldn’t be sharing works in progress anyway for fear the idea might be stolen.
Adobe didn’t demonstrate too many new features to their products for mobile app development. They showed how Photoshop CC can make it easier to make mobile websites and I watched a video on Adobe.com showing how Flash CC can be turned to HTML5, but that doesn’t actually have anything to do with app development. Between Toon Boom starting to take over the animation world and Flash having to cater to HTML5, I’m actually surprised they bothered releasing a new version. I’d also be concerned about creating a .fla file in Flash CC, not renewing your monthly subscription and then not being able to edit the file until you resubscribe.
Overall, I haven’t seen anything innovative or interesting enough to make me drop CS6 and pay monthly to use CC. It feels like their new business model leans more towards their best interests rather than to consumer’s. The idea of a cloud isn’t new, renting software is obviously just to prevent piracy, and sharing files is also old news. I think I’m going to be a life-long CS6 user until the next best thing comes out, but right now, CC isn’t it.
What are your thoughts on Adobe’s new CC?
As an animator, Flash has always been my go-to software for computer animations. When I needed animations for my mobile apps, I would export the drawings as .PNG sequences and then compile them into a spritesheet. Well now Animo software and Kwiksher have partnered to make importing Flash animations into apps seamless.
Rather than force you to read the step-by-step process, I figured it’d be easier to show you in a video.
You’ll notice at 1:03 in the video I forgot to change the radio button from TexturePacker to Animo, but it still works. That’s because at the time of this recording, they’re very similar. However, to avoid problems in the future, you should change it to Animo if you’re importing your spritesheet from there.
As I begin to wrap up my second children’s eBook (Colin Turtle Books), I figured I’d offer some advice about my process to help anyone else who is interested in creating a children’s eBook. I am far from an expert in the field, but here are a few things that I’ve learned and some tricks I use.
Step 1: Writing the Story
I usually start writing out ideas for a storyline, the script, and ideas for interactive elements in Evernote. The reason I choose Evernote is because it installs on your PC, Mac, Android and iOS devices and syncs your notes in their cloud service. So no matter where you are, you can open up your notes and jot down ideas as they come to you. Usually inspiration doesn’t come to me when I’m in front of a laptop trying to write, so it’s nice being able to type up an idea on my phone wherever I am at the time.
Step 2: Artwork
My software of choice for drawing is Adobe Flash. It works well with Wacom drawing tablets, it has the ability to export .png sequences and sprite sheets, and it’s handy for drawing animations. I usually do a layer of text where I layout the script in different keyframes, and then I do a layer of rough sketches just to storyboard the script. Then I begin to draw the characters, background, animations, etc. Once the artwork is completed I’ll export the frames out as .png files.
Step 3: Sprite Sheets
For the animations, I’ll take the .png sequences or individual movies clips epxorted as .swf files and import them into a sprite sheet creator. You can review some of the creators that I use throughout my blog, but here are some of my favorites.
Step 4: Sound Effects & Narration
For sound, I use a variety of sources. A lot of sounds I’ll record myself to save some money (see my previous blog post about recording sound on a budget), but some sounds I’ll get from free sound effects websites and from the sound library built into GarageBand. For my first children’s book “The Perfect Pillow“, my sister-in-law Leslie was kind enough to narrate and voice act for the project. For text highlighting, I use Audacity and assign labels to each word spoken in the narration track.
Step 5: Programming
If you’re familiar with Xcode and Objective-C, Cocos2D is a great way to create eBooks for iOS devices. If you’re not sure how to get started creating an eBook using this method, Justin at Cartoon Smart offers a fantastic video tutorial series. If you’re not familiar with Objective-C, you can still create an interactive eBook using Kwik software, which allows you to build the book in Photoshop using layers. I’ve used both methods, but since I don’t have a background in C programming, Kwik was easier to use for me.
Step 6: Marketing
This is often an overlooked step, but it’s one of the most important. Relying on the Amazon App Store, Google Play Store and Apple App Store to market your book is probably not going to get you a lot of sales unless you’re Rovio and you just created the next Angry Birds game. A few ways that I have advertised my book have been blogging, Facebook, Twitter, Google+, interviews, promo code contests, and getting companies to review your book. Getting people excited about the book before it’s released it important so the sooner you get your book’s name out on the internet, the better,
I hope this has helped you understand what goes into an eBook when you’re a one-person studio. It’s not difficult to get into the market if you follow a few steps. More importantly, it should be fun. If you’re not enjoying creating your book, perhaps you should look into just doing one aspect of it and outsourcing the rest of the steps.
Let me start by saying there is always a time and a place for good old-fashioned Objective-C in Xcode and Java in Eclipse, that is why they are the standards for creating iOS and Android apps. However, coming from a front-end graphics background and using Macromedia/Adobe Flash for pretty much everything in my life, learning Objective-C was less than fun for me.
That being said, here are my favorite pieces of software that actually made it fun to learn how to make mobile applications (in no particular order).
1.) Adobe Flash CS5/5.5/6 – Initially, this is how I got into mobile app development. Adobe added the ability to export AIR for Android and iOS, and all of a sudden your Flash projects could be native apps on your Android and iPhone. For me, it was an easy way to get my feet wet in the mobile app world. However, Flash is rarely the best software to use if you want to make a serious app, but it’s a great starting point. I still use it to draw a lot of my artwork. Pros – Great for Flash developers or anyone already familiar with AS3.0 ; Cons – Usually not the best choice for large apps or apps that require a lot of data.
2.) CoronaSDK (http://www.coronalabs.com) – Once I discovered CoronaSDK, I was instantly in love. It uses Lua code, which is very similar to Flash’s ActionScript, but more simplistic. It uses a small fraction of the code that is required in Objective-C/Java and the CoronaSDK simulator will use one set of code to publish out to most devices. So if written properly, your one set of code can be published out for iPhone, iPad, Nook Color, Kindle Fire, and Android devices. Pros – Great for Flash developers, publishes out to most devices without having to code twice, only a basic text editor is required to write Lua code, easy to use ; Cons – The subscription price point might turn some people off to Corona. At $349 a year for the Pro Subscription, the average person might be hesitant to dive in unless they’re sure they can make that back in app sales, but there is a free trial to see if it meets your needs.
3.) Kwik Photoshop Plug-in (http://www.kwiksher.com/) – I created my first children’s iPad book in Xcode using Cocos2D and Objective-C. It took me 4 times as long to learn how to code it than it did to actually write and illustrate the book. Then I discovered Kwik, which works in conjunction with CoronaSDK, and instantly remade my book using that. Using Photoshop, you assemble each page of your book on layers, and then using Kwik, just tell each layer what you want it to do. No coding involved, no looking at thousands of lines of text, just Photoshop and a click of a mouse. Since it publishes out to CoronaSDK, you can publish your book out for multiple devices without having to recode it. Sounds too good to be true, but it’s not. Also, Kwik 2.0, dubbed “K2”, is scheduled to debut in the near future, and it pretty much takes what Kwik did, but makes it even more awesome with a plethora of new features. Pros – Great for people who know how to arrange layers in Photoshop, great for anyone with an idea for an eBook, easy to use, good online support ; Cons – Requires that you already own Photoshop and a CoronaSDK subscription.
5.) TexturePacker & PhysicsEditor (http://www.codeandweb.com/) – If only there was an easy way to convert artwork into animated sprites with physics applied to them. That’s where TexturePacker and PhysicsEditor come into play. Import your artwork into TexturePacker and it’ll make a spritesheet for you that is ready to use in Corona, Starling, Cocos2D, JSON, etc. Artwork that you need physics applied to can be rendered in PhysicsEditor and it will even trace the shapes for you, regardless of the complexity. The software is constantly being updated with new betas available to add new features (Kwik 2.0 image sheet anyone?) and it’s easy to use. Pros – Easy to use, exports for many platforms, auto-traces shapes, new updates, option to buy separately or together ; Cons – There are a lot of spritesheet creators on the market so users might be hesitant to try this one, but again there’s a free trial to see if this is the one for you.
6.) Spriteloq (http://www.loqheart.com/spriteloq/index.html) – Spriteloq went right for the soft spot in my heart that I reserve for Flash. Spriteloq targeted people who draw their animations in Flash and then want to their drawings into CoronaSDK apps. With Spriteloq, you use a simple command line to export your library of movie clips as individual .swf files. You can import those .swfs into Spriteloq and adjust the frame rate, single play, loop, reverse, etc. and then compile every animation into a single spritesheet. So within a minute, you have your Flash animations running in native iOS and Android apps. If you’re worried about physics, it supports that as well. As a Flash user, I love this software. Pros – Great for Flash animators, easy to use, saves time, free trial ; Cons – Requires the users to already own Flash and CoronaSDK
So there is a list of my favorite software to use to create mobile apps. If you have any questions on how to get started using them, all of the companies provide great support, plus I have a few tutorials throughout this blog that you can follow. You can also leave a message on here or ask me on Formspring: http://www.formspring.me/GPAnimations
The AIR packager was the first feature I utilized out of the gate. I had an app that I developed in Flash for my day job and I figured it’d be a great time to try it out. For those who have never published an Android app in Flash, when the user downloads and installs your app from Google Play, they must also download and install Adobe AIR before they can use your app. Now you have the option of packing AIR with your app to save your customers having to download two apps in order to use one. This of course comes at a price of an extra 9 megs or so of increase file size.
The spritehseet exporter can be useful if you plan on developing in JSON, Starling or Cocos2D. If you don’t plan on using those, you can create your own data format using JSFL, but I have no clue how to even begin to do that. As a CoronaSDK user, I’ll probably stick to Zwoptex or SpriteHelper, but it’s nice Flash included the spritesheet exporter.
Overall I think the CS6 upgrade is nice, but it’s nothing too crazy. Maybe my opinion will change once I get to really dive into the software, but initially I wasn’t wowed by anything I’ve seen.