This version of Keyshape adds support for dark mode, which is available on macOS 10.14 Mojave. Keyshape runs in dark mode by default, because it makes the user interface less distracting and gives focus to the content on the canvas. The mode can be switched to the light mode in Keyshape Preferences. There is also an option for a System mode to make Keyshape follow the mode set in System Preferences.
Below is a screenshot of the new dark mode. Some parts of the user interface have been redesigned to look better in the dark appearance.
Apple has designed the dark mode so that window backgrounds are tinted by the system desktop background picture. For example, if the desktop background picture has a lot of red in it, then windows on top of it have a red tint. This effect, called desktop tinting, isn’t desirable in design applications, because a tinted window may affect how colors on the canvas are perceived. The dark mode in Keyshape has been designed so that its window doesn’t get affected by desktop tinting. The window background is always neutral gray, so that working with colors is accurate.
The user interface elements are native macOS widgets, so they use the Accent and Highlight colors defined in System Preferences. By default, blue is used, but it can be changed to other colors in System Preferences. There is also an option for graphite gray if bright accent colors feel distracting.
Another large change in this release is that the KeyshapeJS JavaScript library has been released under the MIT open source license. The source code is available on GitHub. The main reason for releasing the source code is to clarify the rules how the library can be redistributed.
When the JavaScript library is embedded in a SVG file, a short version of the license text is included. Note that the license covers only the KeyshapeJS JavaScript library code, you still own the copyright to all exported SVG and animation data and you can license them any way you want.
If there are multiple SVG animations on the same website, it’s a good idea to have the library as an external file instead of embedding it in every single SVG file. The SVG exporter has a new option to write the library as an external file.
The KeyshapeJS JavaScript animation library has now a public API, which allows HTML pages to control animations. It is possible to play, pause and change the playback rate of animations. The Keyshape support page has tutorials showing how to use the API for common tasks, such as triggering animations when they are scrolled into view. The API has been completely documented on the GitHub page. Check it out and give it a star if you like it!
This release includes few other features, such as alpha masks, and lots of fixes. See the release notes for all changes.