Help & Troubleshooting

Here you can find known issues and frequently asked questions.

Trial

Where can I find a trial version?

Unfortunately we don't support a trial version at this very moment. We work hard to implement this feature and to make it available as soon as possible.

However, you can buy Spirit for a reasonable price. See https://spiritapp.io/pricing for more information.

Spirit Studio

Does Spirit have a version for Windows or Linux?

Spirit Studio is currently available as a desktop app for Mac. We do not currently have a version for Windows or Linux, but you can sign up for our newsletter to be notified once we launch it.

Can Spirit be used to create production ready animations?

Absolutely! There is no compile task involved, what you see is what you get. Everything happens live on your web page. You can easily import/export animations and embed the animations on your web page using the Spirit Web Player.

How to integrate with design tools?

This is something that is continuously in development as we're always searching for better ways to fit the designer's and developer's need. With Spirit you can animate HTML and SVG elements. Almost any design tool can export SVG's and therefore are fully animatable with Spirit.

Because everything happens live in the browser, you no longer need any other expensive tool (like for example Adobe After Effects) and you can see the final result immediately while you're creating your animation.

Do my animations work forever?

Absolutely, once created your animations will always work on any web page. Although you'll need a subscription to edit and create animations, the created animations are self-contained and can always be played/controlled with the Web Player.

Roadmap:

  • We are currently working on a super exciting design-tool agnostic integration where your design's are always in sync with your web page.
  • Integrations for existing design tools (Illustrator, Sketch, Figma, etc)
  • Custom eases, draw your curve
  • Animate Javascript Objects in time
  • Free transform tool directly on your web page
  • Move elements along path
  • UI optimizations, snapping, multi-select, group in groups, advanced export.
  • Many more!

Subscription

How do I cancel or update my subscription?

Once you've registered your Account in Spirit Studio, you can cancel your subscription or update your billing information via Menu Spirit > License.

If you'd like to move to another subscription plan, please contact support.

What's the refunds policy?

Our goal is to be fair with refunds and we try to keep it simple. If for any reason you’re ever unhappy with Spirit, please email us at support@spiritapp.io so we can work with you to resolve the issue.

Do you accept purchase orders or special contracts?

Unfortunately we cannot process contracts, forms, or purchase orders. Please select a subscription plan from our pricing page to place an order.

Is there a discount for students or teachers?

Students and teachers can get 50% off the price of an annual subscription. Send us a mail with the following information:

  • First name
  • Last name
  • Email address
  • Country
  • University / Institution
  • Department
  • Year of Graduation
  • Include proof of enrollment (attachment)

I lost my license credentials, what now?

All stored information on our servers is highly encrypted and we're not in the position to recover an activation number as plain text. Drop us a mail and we'll perform a license reset for you. We'll send the registered Account holder a new activation number.

Browser Extension

Do you offer an extension for Firefox or Safari?

The Spirit browser extensions is currently available for Chrome. We do not currently have a version for Firefox or Safari, but you can sign up for our newsletter to be notified once we launch it.

How do I select a parent element on the web page?

You can either point and click in the browser or use the Chrome Devtools - Elements Panel.

The disadvantage of simply clicking an element on your web page is that you're always selecting the latest child element available (=target) in the document tree. If you want to select an element higher in the document tree (for example a SVG <g> element), your best bet is to use the Chrome Devtools - Elements Panel instead. This way you can manually select the element and add it to your animation group.

We are continuously updating the browser extension in the background for you, so you always have the latest features available.

I can not select elements in codepen, codesandbox or jsbin?

We are working hard to support hierarchical browsing contexts (like iframes). Currently the browser extension can access elements in the active document (parent browsing context).

This means that, at least for now, you won't be able to select elements in an iframe, like codepen, codesandbox or jsbin examples.

Although you can not select elements within an iframe, you can use the Web Player to play/control the animations.

Web Player

The Web Player is open source and can be found here: https://github.com/spirit/spirit

Why a simple and advanced Javascript API?

The Web Player is developed to be powerful, yet easy to use. We decided to offer a simple version of the player that even Javascript newbies can understand and a slightly more advanced API to give more control.

The simple version is basically a wrapper that uses the advanced API internally 😁

Usage 'Simple API':

spirit.loadAnimation({
  path: 'animation.json',
  container: containerEl
})

Usage 'Advanced API:

import { TimelineMax, TweenMax } from 'gsap'

spirit.setup({
  tween: TweenMax,
  timeline: TimelineMax
}).then(() => {  
  spirit.load('animation.json', otherContainerEl).then(
    groups => {
      groups.get('intro').play()
    }
  )
})

Support for older browsers?

The Web Player is written in modern Javascript. If you'd like to use it in older browsers (like for example Internet Explorer) you'll need a polyfill service: polyfill.io.

Is this a Tweening Library?

No, the Web Player uses Greensock Animation Platform as the default tween strategy, other strategies are in development.

The Web Player simply translates the created animation data into smooth working animation timelines that you can play and control on demand.

GSAP get's loaded twice?

If you are already using GSAP in your project, you can provide the instances before you load or create animations:

spirit.setup({
  tween: TweenMax,
  timeline: TimelineMax
})

If you're using the simple Javascript API and play animations with the loop: true or yoyo: true, then you'll need the TimelineMax instance (else you can safely use the TimelineLite).

results matching ""

    No results matching ""