Ideas and Validation April 6, 2020

Animated Landing Page Illustrations 💈

Timo Lins @Timo

The past few months I spent quite some time designing and animating hero illustrations for SaaS landing pages. I really enjoyed making them, so I came up with the the following idea:

A service where can buy animated illustrations for your SaaS/landing page – uniquely made for your business (by me).

Here are some examples of some of the animations I made:
https://pstunnel.com
https://dribbble.com/shots/10788311-Axcept-Hero
https://dribbble.com/shots/10771224-Axcept-Explainer

Do you think there is a market for this? If so, how much can I charge for something like this?

  1. 5

    There is definitely a market for this, especially if it's priced affordably. I would be a customer today.

    1. 1

      I agree on it being affordably priced.

  2. 2

    Awesome, looks amazing, what do people get, a gif or code snippet curious to see how this works?

    1. 2

      Thank you!

      It's an SVG built with Figma and brought to life with Anime.js.
      So the only thing you have to add is a single SVG with a short JS snippet.

      This approach has quite a few advantages:

      • Highly customisable – you can hop into Figma and change almost everything, and the animation will still work
      • Small in size – The whole animation you see on PS Tunnel has about 30kb before compression. This is WAY less than a GIF or a Lottie/After Effects animation, while remaining pixel perfect.
      • Complexity – Since the animations are based on code, they can do a whole lot more than static animations. They can change over time, make use of randomness or react to user interactions.
  3. 1

    Hi Timo,

    There is definitely a market for this. I would be a customer, if

    1. There is an easy way to edit your stock animations. No all designers have expertise in After Effects ( especially in the SaaS Space ) and the reason we are buying this is for the idea and to save time. After Effects is a tool for Pros and a non expert wouldn't be too inclined to pay for it just to edit your video.
    2. You provide a Service where you let us choose from one of the animated illustrations and you customize it for a fee.

    I have come across a few animated illustrations & mockup templates in UI8. They are really cool, but I don't know After Effects & hence I have never been able to use them.

    regards,
    Swami

    1. 1

      Yes they are pretty customisable, without the need of After Effects!

      The animation is built upon a SVG which is exported from Figma, so it can easily be adapted.

      I made a quick demo video to show what's possible:
      https://www.loom.com/share/4dd76893404443f0968ff059f43cd676

      Initially I thought more about creating animations on request, exactly tailored for your product – so not sure how important customisability would be in this case, since it's already made just for you. But if I'm going down the "library" route this will definitely be a huge plus.

  4. 1

    I used an animation on my landing page as well (a cat typing git push). It was done by my ex gf, so yeah I could not done it myself really.

    There is market. What's the price?

  5. 1

    I like the idea, but I guess the pricing model could be quite tricky. Are those would be customizable? Is there any option to change the color scheme at lest? That would be really cool IMHO :)

    1. 1

      Yes it is! Almost everything can be changed by adapting the SVG.

      I recorded a small demo that showcases this: https://www.loom.com/share/4dd76893404443f0968ff059f43cd676

  6. 1

    I like the idea of the tailor-made animations and I think there is a market for this. I think DrawKit used to have such a model, but as I've just checked James (the guy behind it) has changed it to a subscription model, which is also something you could try. Because after all a lot of businesses use similar illustrations anyway. Maybe there is an easy way to customize (colors, opacity) them for the users.
    Also, think about offering a few generic ones for free to gain traction.

  7. 1

    There is definitely a market for this, but unless you have a huge inventory (100++) of illustrations, it's going to be hard to get much traction.

    As for pricing, you can probably charge 50-100% more than static illustrations, although it's easy to find lots of those for free. I came across this post earlier today (https://www.indiehackers.com/post/free-human-illustrations-resources-list-updated-cc290c37e4) which led me to a Google Sheet (https://docs.google.com/spreadsheets/d/1VCiYme6JTQ5nF7u7z0-V5n8uWnXNslyTVHSDVqqYCFc/edit#gid=0) with a ton of sites that offer illustrations. That might give you an idea of what price point others have found.

  8. 1

    They're pretty cool! Feel a little laggy but could also be my machine. :D

    The idea seems like a natural step for all the illustration libraries coming out. Not sure of the need but they do add a bit more personal touch ey?

    1. 2

      Thanks! The animations might be a bit heavy since there is quite a lot going on – maybe your browser was a bit too busy with other stuff, since it runs smooth on most of my devices.

      I think the main selling point is that the animations are tailored for your product, so they do a much better job explaining them, rather than just throwing together a couple of generic illustrations.

  9. 1

    This comment was deleted 2 months ago.

    1. 1

      Great to hear. Thanks!