My Impressions After Creating My First Project With Wickeditor

In my previous post I shared my finding about a cool free tool named Wickeditor. It allows creating animated and interactive experiences that you can embed in your post or page. I wanted to try it first hand and let you know how it went. And also, I am sharing my Wickeditor file project in this post. And I am going to create a short tutorial with you in my next post.

You can do different things with Wickeditor – from the simplest gif-like animations or clickable things to interactive stories, interactive sophisticated infographics and games. But a sweet part is that Wickeditor is designed to be a very simple tool that does not require programming or coding skills.

My first and second impressions on Wickeditor

In a couple of words my first impression was “Yeah! At last we have a wonderful super-easy-to-use tool to create animations or interactive things for web with no or little coding!”

Then, after I tried to use it myself to make I realized that although the tool is indeed cool, I could not really use it until I wanted a couple of tutorials. The reason of my issues was that when I intuitively started using the tool, some things just did not work the way I thought they should.

The tool is still in active development and that’s why it’s not polished as a final product. However, once you get used to it, you will use it the way it works and you will not use it the way it does not work. That’s why I recommend watching some basic tutorials and actively using Wickeditor’s forum to find “how to’s” (see the resources in my previous post here). It helped me a lot when I was getting the feel of it.

Trying to use Wickeditor intuitively almost put me off the tool at some point at the start because I could not do some simple operations and I could not understand why it did not work. It was very confusing. A couple of Youtube tutorials and quick googling solved my problem.

Besides, I have encountered some technical restrictions working with Wickeditor. For example, I could not find an easy solution to create simultaneously interactive and animated elements which overlap and which can be enabled by user. I think it could be solved by having an option to control visibility of layers (not the objects on the layers). But this feature is not available yet.

I assume I don’t know the tool very well, and probably there’s a neat and elegant way how to solve it, but this is my first impression of a noob user, right? 🙂

I also found that when lots of animations are running (even if they are not visible), the final project becomes a bit laggy in responding to user actions. With my project it was not a big issue though. At the same time I realize that I probably did something in not an optimal way. But I did it as a total beginner, and share my thoughts from this point of view.

No worries if the above sounds complicated now. I just wanted to say that although Wickeditor allows doing a lot for you even if you are totally a beginner user, you may encounter obstacles that are not obvious to overcome. Again, a friendly Wickeditor’s forum, googling and existing tutorials are there to help you solve or find a workaround of your issues.

Other than my confusing trial, I found that the tool is very stable. I expected it to crash (like most other software or web-based tools out there). But surprisingly it has never happened to me so far. I know I have worked with Wickeditor for a pretty short time, but still it was stable as rock (I’ve been using a web version). And of course it’s much more pleasure to use than Inkspace (no worries, Inkspace, I love you, you are powerful, but your UX is sort of difficult now and then).

As regards, whether you can create something in Wickeditor with no scripting (coding), well it depends. As regards animations, I’d say, yes you can. But if you want interactivity, then no-scripting solutions available in the tool are limited. And you will probably need to use scripting to create interactive experiences. The good news is that you will likely to need just a very basic scripting.

Finally, there’s definitely room for improvement of functionality and user experience of Wickeditor, but you can already create amazing things with Wickeditor with ease.

What I did with my first try with Wickeditor

Here’s the animated interactive example I’ve created. Click on the planet to start:

You can download the Wickeditor project (.wick file) here.

If you did not understand what this interactive thing above does, I will be a bit sad. Kidding. Here’s what I wanted it to do:

1. The image invites user to click on the planet (the active element) by glowing animation around the planet.
2. User clicks on the planet.
3. The planet turns into a death star, and rocket becomes active (invites user to interact with it by glowing).
4. User clicks on the rocket, and the final interactive element (a text “Hosting is here”) becomes active.

Pretty silly, but I did not care much about the story and interface. It’s like a prototype to see how easy I can enhance interactivity that is impossible or very hard to achieve using SVG. And my small Wickeditor project worked well for this purpose.

By the way, my tutorials on SVG are here: 1, 2 and 3. SVG are fast and neat, but it’s lacking animation (unless you add javascript support which is pretty clumsy and not beginner user friendly unlike Wickeditor which is much easier to use from this perspective).

The key point of my interactivity test project from a technical point of view was creating custom animated button-behavior elements (clickable animations). I kept in mind the restrictions of SVG interactive images and I wanted to try Wickeditor which indeed widens the horizons of possibilities. And I think my first project was a success from this point of view.

After all, my verdict is that Wickeditor is an awesome tool to create animations and web-based interactive experiences.