New in 6.2: Streamlined administration through Site Administration and the new Control Panel (2/2)

In my previous post I convered the reasons why we decided to streamline the administration UIs of Liferay and in the process review the usability and design of the Control Panel. In that post I already covered two of the key decisions we made as part of this redesign: (1) Extract the "My Account" administration out of the Control Panel and (2) Extract "Site Administration" outside of the Control Panel.

Let's follow up from there with other key decisions.

3. Reorganize the portlets in the Control Panel

Once we've extracted out the portlets within "My Account" and "Site Administration", what do we have left? The remaining tools are those that in 6.1 and previous used to be classified in two sections: "Portal" and "Server". The reasoning for having those two sections was that the portlets that belong to the first manage stuff that belongs to the current portal instance, while the portlets under "server" manage elements that have an effect across all portal instances.

However, the feedback we've gotten over the past couple of years is that this differentiation wasn't very clear, or even highly informative for administrators. Also, some portlets were quite related to each other but were also mixed with other unrelated portlets. For this reason several months ago, Juan Hidalgo our UX Designer based on Madrid, proposed to start brainstorming for alternative classifications. Juan, wrote a card for each tool and pasted them in a big whiteboard (I wish I had a pic but I don't. Juan if you do go ahead and paste it as a comment). After several weeks trying alternatives we were ready to make a proposal, which got interesting feedback from a bunch of people, specially Nate Cavanaugh and Ed Chung. The result was the creation of 4 categories within the Control Panel: Users, Sites, Apps and Configuration. One key thing to highlight is that each of these categories has one portlet that is specially relevant and we expect it to be used much more than the rest in the category (which provide complementary features). Leveraging this, we decided to get rid of the vertical menu and go with a horizontal menu which makes the navigation easier to use. Here is a description of each of the sections along with an screenshot:

  • Users: Contains all portlets related to administering users and user related stuff, such as permissions.
  • Sites: Contains all portlets related to managing sites as well as tools used to build the sites themselves such as site templates and page templates. It is worth noting that within the sites portlet it is possible to fully manage any site (as long as the user has permission) just by clicking on its name. In other words, the site administration UIs of all sites are easily accessible from the Control Panel.
  • Apps: we decided to go along with the overwhelming trend of calling Apps to all extensions to a product. This term had already been adopted by the marketplace so it was good to be consistent. For those used to other terminologies within Liferay, an App can be installed from the marketplace (in which case it can contain one or more plugins) or be deployed locally (in which case it will be composed of one plugin of any type, portlet, hook, web or ext).
  • Configuration: contains all portlets that provide ways to configure the platform. All the configuration performed from here will either affect elements that live outside of a site or will have effect over all sites.

We also decided to provide a frontpage which provides an overview of all portlets available in each of the sections. This provides a quick way to go to any of them in one click. It also provides access to a description of each portlet by hovering the question mark next to its link:

One final thing you can notice in this screenshot of the Control Panel Home is that under each section there is a question and a button that provides access to the most common action that the current user might want to perform. Note that the location of these "Quick Actions" is not final yet.

4. Reduce the number of pop-ups

In 6.1 we introduced quite a few pop-ups to access management UIs as a way to allow the administrator to keep the context. However, after the feedback received and our own UX evaluation we came to the conclusion that we were using pop-ups in situations were they weren't the optimal solution. For this reason, in 6.2 we've replaced many pop-ups with full page reloads, although making sure that the headers and navigation provided proper context as well as a quick way to go back to the previous screen. The general rule we are following is that pop-ups are good for short iterations, but not when the user is going to be working within the pop-up for some time or do quite a bit of clicking around.

The overall experience is definitely much better now and the UI feels much faster.

Note: There are still a few pop-ups that we haven't been able to replace for technical reasons. In particular, the "Manage > Templates/Structures" in Web Content and "Manage > Document Types" in Documents & Media come to mind. We'll replace those later on.

5. Keep backwards compatibility for developers

As you've seen, we've performed tons of changes to improve the usability. However we didn't want these changes to have a big impact on developers. So if you are a developer you will be happy to know that if you developed a portlet for the control panel for 6.1 it will work in 6.2 without any changes. 
This is possible, because under the hood both "Site Administration" and "My Account" are considered to be part of the Control Panel. So in order to create a portlet for any of them a developer just has to add a control-panel-category element within its definition in the liferay-portlet.xml configuration file. We've also made it so that the old category names are automatically converted to the new category names as follows:
  • my -> my
  • content ->  site_administration.content
  • portal  ->  users
  • server  -> apps
Here is a full list of the new available categories:
  • Control Panel:
    • users
    • sites
    • apps
    • configuration
  • Site Administration:
    • site_administration.pages
    • site_administration.content
    • site_administration.users
    • site_administration.configuration
  • My Account:
    • my

How can I test it out and provide my feedback?

If you've got this far you are probably interested in finding out how to test this out. It's easy, just download Liferay Portal 6.2 Beta 1 and install it locally. We'd love to hear your feedback either as comments to this blog post or as part of the beta program.

Remaining tasks and aspects under consideration

We are already in the beta cycle of 6.2 so what has been discussed in this blog is quite final. However, there are still some minor UX improvements that are still under consideration and might suffer slight changes. Here is a non-exhaustive list, feel free to give us your opinion:

  • Headers of both Site Administration and Control Panel: we are still not 100% sure of how they look so they may still change.
  • How to let portal administrators know which actions will affect all portal instances: With the new organization it's not clear in environments with multiple instances that some will affect all instances while most won't. We need to find a way to let the user know.
  • Descriptions for each Control Panel section and place the quick actions in a different position that flows better in smaller screen sizes.
  • Navigation witihn the "Sites" and "Users & Organizations" portlets.
That's it, I hope you enjoyed these two blog posts. Next I'm planning a post on the changes we've done to the dockbar, anyone interested?
"5. Keep backwards compatibility for developers"

I was thinking about this after the first blog, but this gives me a big relief!

Thanks for the amazing work.
Thanks for the useful information, looking forward to the future posts!
How does an Organization Administrator manage their users? When I log in as a an user with an Organization Administrator role I do not see the Control Panel option in the Admin drop-down (as I do for a primary Administrator). Thanks.
Hi Jim,

You need to have the permission "Go to Control Panel". Once you are in the Control Panel the org admin will automatically be given permission to administer the users of his organization (in upcoming releases)

Another way that is not offered 100% out of the box but that I forsee being a common customization is to develop an "Organization Users" portlets and make it available within Site Administration for sites associated to an org. I proposed offering this by default but we wanted to be certain first that it was generally desired. So it will depend on hoy many people do this and/or ask for it to be there out of the box.
This would be absolutely awesome to have.
We are grouping students in organisations and our Site-administrators need a way to get a good overview of the members of a site regardless if the users belong to the site directly or have an implicit membership through a suborganisation.
I get the same issue. Finally I found that I can use "Administrator" to manually create a new "Role" which has permission "Go to Control Panel". Then assign this "Role" to the "Organization Administrator". As a result, "Organization Administrator" can access Control Panel screen.