ZOO 2.0 – Usability

In our last two posts we presented a brief overview about what’s coming with the new ZOO 2.0 and gave a quick peek inside the new app concept. In this post we're going to take a closer look at the new user interface of the ZOO administration area and all the usability features we included. Here we go...

Global Parameters

We like the global parameters concept in Joomla but it lacks usability when you don’t use select boxes. So we improved it by using a checkbox to set whether you are using the global parameter or a specific parameter. If "global" is checked the parameter is hidden. If you uncheck it the parameter form will slide in with a nice Javascript effect. This gives you a much cleaner user interface for the global parameters.

Item Priority

Manual item ordering was a common feature request for ZOO 1.0. In Joomla everything can be ordered manually but you have only one order rule. It's either ordered alphabetically or manually or by hits and so on. We rethought the item ordering and came up with the idea of an item priority. In ZOO 2.0 items are ordered by priority and not by a unique order. Items can have the same priority which is great because this allows a second order rule for items with the same priority. For example, you can order items alphabetically but also put some items first by setting a higher priority. The priority can easily be edited in the item overview and is saved automatically using Ajax.

Slugs

In ZOO 2.0 we renamed the well-known Joomla "Alias" to "Slug". A slug is a unique name which only consists of web-safe characters and it is commonly used in search-friendly URLs. We like how unobtrusive the permalink functionality of WordPress is and thought about making the slug creation for ZOO 2.0 just as smooth. The slug is automatically created based on the item name. Invalid characters are stripped and if the slug already exists a number is added to guarantee the uniqueness. There is also no input field during this process because in most cases there is no need to change the slug. But if you want to edit it an input field is injected right there. We really enjoy these small things to improve the overall user experience.

Drag 'n Drop Categories Sorting

Sorting a large tree of categories can become really annoying if there is no easy way to do so. In ZOO 2.0 you can sort categories by drag 'n drop! Isn't this awesome? You can drag any categories and their whole child categories and drop them into the root or any other category. The new hierarchy is saved automatically using Ajax. Which makes resorting your categories a breeze!

Drag 'n Drop Element Positions

The first feature we implemented after the ZOO 1.0 release were template positions. For us this was the most missing feature in ZOO 1.0. Now it is no longer necessary to hard-code the elements rendering for your custom types in the template. You can arrange your content via drag 'n drop from the administration backend. This is really one of the greatest features about ZOO 2.0 and improves template development and the overall usability so much. Awesome!

Tag Autocompleter

While the development of our tag system we needed an easy way to add and remove tags from items. We used and customized the great AutoCompleter script for MooTools from digitarald. It provides text suggestion and completion as well as multiple selections. Really a nice one to have! For example, it is possible to enter comma separated words and all are added as tags in one step.

Tag Quick Edit

Tags are a really simple thing. The only attribute of a tag is its name. So it doesn't make sense for us that tags have their own edit view. So we also implemented a quick edit in the tags overview. Actually we really like the quick edit functionality, and we tried to use it as much as possible.

Action Links

One thing we like in WordPress is that users are not distracted by too much information. For example additional links to manage an item only appear when you hover with the mouse over it. In ZOO 2.0 we also used this concept as often as possible. It gives you a much cleaner user interface. Especially the comments manager benefits from this.

Comments Quick Edit

Last but not least we like to point out that it is also possible to quick edit a comment from the comments overview. This works so great that we don't even need no extra view to edit a single comment.

All these little things make content management so much more convenient! Next post will be a sneak peek of all the new elements...