My Impressions After Creating My First Project With Wickeditor

Share the knowledge...Share on Facebook
Facebook
Tweet about this on Twitter
Twitter
Share on LinkedIn
Linkedin

title wickeditor impressions

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.

You can download a PDF version of this article (303 KB):


Share the knowledge...Share on Facebook
Facebook
Tweet about this on Twitter
Twitter
Share on LinkedIn
Linkedin

Comments

  1. Panelonline says

    Thank you for Sharing Your Experience with Wickeditor. I started learning to use this tool recently and it will be a good help for me.

  2. Thanks, Michael for your support it will be a help for me to make some changes in my project. I want to ask a question from you that I am working on WordPress could you please tell that to how to make an image pop-up when a user moves the cursor on the image.

    • Hey Chris!

      Popups is often a pain. In Wickeditor it will be using just additional layer(s). So technically it will not be a popup, but just another layer(s) and you manage its opacity.

      If you are asking in general, you would probably need to use a plugin or apply javascript yourself. I could not find a universal and easy solution for that for non-coders, unfortunately. You can google something like “popup window javascript”.

      Also you can read this comment to one of my articles which discusses this question.

      In addition, WordPress ToolTips plugin may be used in some cases.

  3. Actually I am looking for this kind of tool Because I want to make animation more interactive Thanks for the love blog this blog help me a lot.

  4. FYI, The animation does not work on iPAD, and dramatically slows does text entry into this box. Something like 10 seconds per character. So it is doing something in the back ground, but it just doesn’t sho up on the screen.

    Off topic, I heard EIG was sold. Do you have any insight into the new owners and if they will bring changes to the shady business practices of EIG, or will it be more of the same?

It's important for me to know what you think

*