Features

Turn Drawing and Animation to Code

Apply animation to vector drawing or raster image. QuartzCode generate Objective C or Swift code in real time to be used in iOS or OS X project.

Multiple Animations

Create multiple animations states in a single QuartzCode project. Very useful if you need to create different animation using same asset. Each animation have its own method which you can call using the generated code.

SVG Import

Import SVG Files created from other vector drawing application into QuartzCode

Shared Color

Reuse same color across different layers and timelines. The color is created as property in generated code so you can still change the color using Xcode.

Layers

Timeline Panel

Animatable Properties

Tools

Generated Code

Layers

Each layers in QuartzCode has different use and have their own unique animatable properties. You can combine multiple layer types to create interesting and unique animation.

Shape Layer

Use basic shapes provided or use pencil or vector tool to create shape. Modify them using boolean operations, vertex mode or transform mode. You can also import SVG file created from other applications.

Emitter Layer

Emitter layer can be used to create effects such as smoke or sparkles, and they can also add beautiful details to animation. Emitter layer can take multiple emitter cells so you can use and define multiple images and properties in an emitter layer.

CALayer/UIView

In QuartzCode, image is contained by either CALayer or UIView. It is a great way to put placeholder image for prototyping, and you can also animate it and get the code at same time.

Replicator Layer

Replicator layer lets you create repeating pattern from its sublayers. You can use any layer type as sublayers, including image. This make it possible to create many interesting patterns with or without animation.

Text Layer

Text Layer let you create basic text and get CATextLayer/ UILabel/UITextView code. Text Layer can be converted to effect layer to produce text effects.

Mask

Mask works similar to shape layer. So you can create custom mask path or animate it as you control shape layer too. You can mask any other layer and inverse mask also supported.

Effect Layer

Effect layer can chain and combine multiple animations to create a delayed animation. Add any animation to effect layer and set instance delay, all of its sublayer automatically have the animation with incremental delay. There are various ways delayed animation can be utilized, one of them is to create various text effects.

Timeline Panel

Timeline panel is used to add and modify timelines added to animation. Timeline Panel has been improved to ease usage whether when creating simple or complex animation.

Keyframe Value Preview

For animatable properties that use color, gradient, number and bool, value for each keyframe is shown at the timeline.

Timing Function

In addition to default built in timing function such as linear, ease in, ease out, ease in ease out, custom timing function also can be used.

Animation Speed

Change animation speed so that the animation can be observed closely. You can also set the animation to repeat indefinitely.

Realtime Tweaking

Change layer or animation property and see layer state automatically changed. Use time indicator to see layer state at specific time.

Animatable Properties

• Transform

• Position

• Fill Color

• Stroke End

Z Position

Shadow

Opacity

Line Width

Path

Stoke Start

Stroke Color

Gradient

Line Dash Phase

Font Size

Vector Drawing Tool

Use built-in vector shapes to draw shapes. Use boolean operation, vertex mode and transform mode to refine the shapes.

Transform Tool

Layer Inspector

Layer Inspector is where layer properties can be edited. Each layer type has different properties that can be edited.

Alignment Tool

Alignment Tool can be used to align multiple layers. Align based on layers anchor point also supported.

WYSIWYG Gradient Editor

Generated Code

iOS and OS X

Objective C and Swift

Realtime Code Generation

IBDesignable

Relative Frame

With relative frame, it is easier to support multiple devices with different resolution. Currently frame, path, position animation and translation animation are supported.

Completion Block

Each animation now have completion block, so you can perform necessary action when an animation is completed.

Reverse Animation

Reverse complete animations in Xcode even for multiple animation with different layers.

Animation Duration

Duration of an animation now can be set manually using Xcode when Animation Duration option is selected.

End Time

Using end time option, an animation can be ended abruptly before its original time.

Top

Free Trial

Buy

Also available on Mac App Store