Creating Your First AppJS App with Custom Chrome

AppJS is no longer being updated or maintained. For a similar platform, check out node-webkit which is backed by Intel Open Source and is consistently being improved and updated. I’ll write a new tutorial for node-webkit sometime in the future. Also, despite the legacy name, node-webkit uses Chromium as its base, so it is now using the Blink rendering engine.

Over the past few months, I’ve been studying up and trying out several cross-platform development solutions and one of the more interesting ones I’ve found, as a web designer and developer, is AppJS. It allows development for the desktop for all three major desktop operating systems using the mix of technologies commonly known as HTML5 and node.js.

Of course, I’ve also been using Adobe AIR since it was introduced, though AIR for HTML isn’t all that great in my experience. AppJS, on the other hand, uses the Chromium Embedded Framework which renders content beautifully, is super fast and has all of the latest and greatest features HTML5 has to offer without awkward workarounds.

Before getting started, it is worth mentioning that AppJS is still a relatively new project and documentation is sparse at the moment, but it is being worked on. I’m also not attempting to compile and package a completed app just yet, so I will be using the distributable version and replacing the content files throughout this tutorial.

Digital Art Academy for Windows 8

Windows 8, the newest incarnation of Microsoft Windows, will officially be released to the masses on October 26, 2012. For those unfamiliar with the new operating system, Windows 8 is a reimagining of Windows and comes with a brand new user interface, Metro Modern UI that is, in Microsoft’s terms, “fast and fluid” and “authentically digital.” It is the first time Windows has seen a major redesign since Windows 95, and it is MAJOR! Check out this video to see a preview:

Ahead of the Windows 8 release, Ratio Interactive, a design agency in Seattle, WA launched a design contest for Windows 8 apps. It gave me the perfect excuse to begin exploring the design possibilities of the new operating system. For my entry, I chose to design an app for Digital Art Academy.

FruitBat 1.5 Update Available

It has been a while since the last FruitBat update was made available and since then, a lot has changed. BlackBerry 10 is on the way and Tablet OS updated to 2.0 with 2.1 in beta. WebWorks also continues to evolve in the BlackBerry github repository. With all of the activity around BlackBerry development, FruitBat needed some attention to keep up as well as improve some of its basic functionality.

FruitBat 1.4.0132 Update Available

The FruitBat 1.4.0132 update includes the following changes:

  • BUGFIX: (Mac Only) Automatic updates did not function in 1.4.0127 (sorry all- you’ll have to download the installer from the site this time). This was fixed and tested in an intermediate unreleased version 1.4.0130.
  • BUGFIX: Auto-generated WebWorks ZIP file name could possibly be invalid when attempting to package a WebWorks app. This would cause packaging to fail. All ZIP file names should be fully valid now, every time.
  • BUGFIX: Register Signing Keys item in the Publish menu was not linked to its action, so it did nothing when selected. Now, registering signing keys via this menu item should function properly.
  • CHANGE:  The process for installing debug tokens was changed to allow file selection if the Debug Token Save Location in the Settings/Preferences window did not contain a valid file location.
  • NEW: Added messages to the console for:
    •  loading XML from any of the available options (drag & drop, shortcut key, menu item)
    • creating/refreshing the package file list
    • updating the main app panel
    • installing standalone BAR files
    • uninstalling standalone BAR files

Windows users may use the update feature to download and install the update automatically. Mac users should use the download button below for this time. There is no need to uninstall the previous version before installing this one. The old version will simply be replaced on install.

FruitBat 1.4 Beta Release

Considering it has been so long, I’ve decided to release a public beta of the in-progress version of FruitBat… and this time something for the Mac folks too! As there is so much new stuff, be sure to check the main page for instructions, though you probably won’t need them because most actions have only one step. How’s that for easy?

This beta installation will expire and no longer run at midnight on December 31, 2011.

Updates have been enabled for all current installations. To install the current version, use “Check for updates” from the Help menu. Settings are not compatible between the two versions, so they will have to be redone via the new Settings window. Update is not required if you would like to stay with version 1.3, despite its display bug.

Download links, release notes, known issues, etc. after the jump.

FruitBat 1.3 Bug with SDK version 1.1.0

Using Tablet OS SDK version 1.1.0 and AIR 2.7, the main screen in FruitBat that shows your application’s icon when a descriptor is loaded may show “undefined” for both app name and app version. This does not affect FruitBat’s main functions; it still works as advertised, you’ll just see “undefined” instead of your app’s name or version. This includes the name of any packaged BAR file. You can change the package’s filename to anything you wish after it is generated (all of the important “stuff” is inside).

The fix has already been completed for the next update.

MXSMaker: Image to Painter Mixer Pad

Painter has a few ways of creating color palettes from images whether it be through color sets, the Match Color command or the stylistic coloring achieved through automatic processes such as in the Underpainting panel. Now, add one more: the Mixer panel. With MXSMaker, it is very easy to convert any JPG, PNG or GIF file, with transparency preserved, into a Mixer Pad file that can be loaded directly into the Mixer panel of Painter 8.1 through Painter 12.

FruitBat 1.3 Released

FruitBat 1.3 Main Screen

The BlackBerry PlayBook is finally here! This update to FruitBat adds the ability to install in-development apps to the PlayBook hardware for testing while using a debug token. It also has the ability to install and uninstall signed BAR files to and from the device.

Introducing colorbranch Touch

colorbranch Touch is a color picker, color matcher and color conversion application created for artists, designers and developers. The first release allows colors to be chosen from photos and other images with more choices coming.

All colors are represented in many different common formats for ultimate flexibility. Easily see HEX color codes for CSS, then convert to HSL with one button for some CSS3 color animation magic!

Swatches can be exported as XML, Adobe® Swatch Exhange (.ase) for use with Adobe Creative Suite and Corel® Painter™ Color Set (.colors) files for truly portable color palettes. In addition to designers and artists, code-ready strings are also readily available for CSS2.1, CSS3, Adobe® Flash® and other programming languages.

FruitBat 1.2 Released

January – the month of updates! BlackBerry released a new version of the PlayBook SDK and simulator yesterday (0.9.2). With the update, your password is required to interact with the simulator via the command line tools.  This update changes the command line interaction slightly to accommodate for that.

Update 02/2011: This version is also compatible Tablet OS SDK version 0.9.3 which was released by RIM on 02/08/2011.

If the command line errors out, check to make sure the clock in the simulator has the correct time, matched to your computer’s clock.