Loading...
 

Unified Admin UX

This is a project for the Tiki19, Tiki20, and Tiki21 LTS cycle.


Tiki has a lot of features. In fact, it's the FLOSS Web Application with the most built-in features.

As of Tiki 18, administration UX of Tiki has 4 paradigms.

  • Quick admin module
  • Menu 42 (the default menu)
  • tiki-admin.php
    • The main dashboard with nice icons per section, where if you pick one, you see how to get to other admin sections but not back to main dashboard
    • And the top horizontal menu (where if you pick something, you lose your menu)


Some improvements were made over the years, but the challenge has not been handled in a comprehensive way.

Goals

  • From one sign point, with a search with auto-complete, to be able to access all administrative functions
  • Make it simpler for new admin
  • Make it easier for site admins to build their own admin UX in wiki pages (so these can be deployed in profiles)
  • Take advantage of Bootstrap 4
  • UX for setting basic / advanced / experimental is not intuitive: fix it
  • Improve Style Guide
  • An intuitive split between
    • Configuration that you do one in a while (change your site log)
    • Administrative aspects which are done regularly (content, users, etc)
    • Warnings from the system (ex.: your OPcache code RAM is full)

Related

AdminUIRevamp

AbmaSoft Tiki Review


Summary
We have reviewed the TIKI admin panel and have pointed out a few issues if addressed can improve the admin panel usability. All the modifications proposed are designed keeping in mind the existing users as well as the new users. The existing users will get an enhanced and powerful experience without getting lost. While the new user will surely get a much better experience with backend.

NOTE: Please this is just first rough draft and if the Tiki Team likes the ideas we can further refine them.

Quick Admin Bar

This bar will only appear for the Users having admin rights in the system. It will replace the current quick administration and make it more powerful by making it appear in the header and slide down showing more options when clicked. Check screenshots below.

We think Admin Feature Search is very powerful and we should make full use of that. So we promoted it to the Quick Admin Bar as well.

Clarification Everyone liked the quick admin bar with some negative feedback on the animation. The animation was just to show the hidden bar. The bar can appear instantly on top or slide the content down. Also as Jonny said it should and will be configurable so that people can change the quick admin bar as per their choice.

Tiki Admin Quick Menu

Admin needs a special icon instead of a regular down arrow icon like page edit

Every page has a down arrow and the standard icon does not make the admin menu look prominent for new users. They probably wouldn't even know there is a quick administration menu there with the logo. Instead a Cog wheel icon next to the user info on right side will make it more accessible.

Tiki Admin Prototype 01

Quick admin bar menus

The admin features history and quick admin menu links will be there for existing users to keep working with them. However with a much powerful quick admin panel.

Tiki Admin Menu 2

More Options in Quick Admin

Sometimes its really hard to find out latest comments made on the trackers we are working on or on other areas like Wiki Pages. So there is a new icon in Quick Admin bar for all the comments related to a user. This option is not only for Admins but for all users.

Second option is a + sign , that is a quick ADD button. A quick add for Add New Wiki Page, File Gallery, Tracker, Tracker Item, etc.

Tiki Admi Quick Newbuttons

Tiki Admin Control Panels / DashBoard

We have worked on the home page of Tiki Admin called control panels, we think it should be made into a dashboard for Tiki Administration.

Clarification We can keep this page the home for the admin as control panel as someone suggested. Also to retain the menu with search on top (Access, Content, System, Tools). That top segment to remain the same to keep the existing users at ease.

New Big Admin Menu on Left Column


Architecture 2256489 1920

Clarification It can be moved to left or right. It is not a replacement of menu 42, its a new menu for admins to give the ability to move in the admin panels with 1 click from any screen to any screen.

Logic for this menu
The menu 42 is too big, it also has all the front end areas and the segmentation for the admin options are different. Then we have the quick menu which is a short collection of features which are regularly used and not segmented. Then we have a menu on top of the body control panels. That is segmented into Access, Content, System, and Tools. - then we have the body control panels. Now what is wrong here is that we need 1 approach for the admin areas and options and the best one in our opinion is to adopt the CONTROL PANELS segmentation. All the control panels will be root option, if any has multiple tabs , then all tabs will appear under the main option. This will create a unified experience of the admin panel and it will be 1 click from any screen to any admin screen. While otherwise its not possible to reach an exact tab in 1 click.


We think Tiki admin is mainly missing a 2 level menu which is same as the main control panel. All the options under different tabs should be in the menu so that a user can directly jump into any segment from any Tiki Admin segment. We have 4 different admin menus which are different from each other. We need 1 solid menu.

Following is what we have proposed in the admin home screen:

  1. Rename Admin Home page , Control Panels to Dashboard
  2. New segment - At a Glance - Show total Wiki Pages, Tracker Items, Trackers, Categories, Users, etc. - a good feature to give a picture of the Tiki.
  3. The Tiki Admin Home/Dashboard should have an area for TIKI news and updates and new Tiki Versions Notifications (News coming from a TIKI RSS) This is easy to implement and can be very useful to keep the Tiki admins updated with latest Tiki news.
  4. System Notices should hide in sub admin screens. Currently they take too much space and its ok we guess to have them only on the Tiki Dashboard
  5. Admin can drag and drop to sequence options as per his likes for dashboard and left menu.


Tiki Dashboard can have more features
We can design a number of segments for the dashboard and Admin users can arrange (activate/deactivate , drag/drop reposition) them as per their liking for best control.

Floating Apply Buttons on Admin Forms

Sometimes if the page showing admin configurations is big, as most of the Tiki Admin pages are. The apply button is either on bottom and footer, and to scroll to reach them takes time. If we put up floating Apply/Cancel buttons on bottom of the screen. It can save user time and speed up.

Action Bar


Contributors to this page: Muhammad Bilal Siddiq and Marc Laporte .
Page last modified on Saturday 19 May, 2018 09:28:49 GMT-0000 by Muhammad Bilal Siddiq.

Keywords

The following is a list of keywords that should serve as hubs for navigation within the Tiki development and should correspond to documentation keywords.

Each feature in Tiki has a wiki page which regroups all the bugs, requests for enhancements, etc. It is somewhat a form of wiki-based project management. You can also express your interest in a feature by adding it to your profile. You can also try out the Dynamic filter.

Accessibility (WAI & 508)
Accounting
Administration
Ajax
Articles & Submissions
Backlinks
Banner
Batch
BigBlueButton audio/video/chat/screensharing
Blog
Bookmark
Browser Compatibility
Calendar
Category
Chat
Comment
Communication Center
Consistency
Contacts Address book
Contact us
Content template
Contribution
Cookie
Copyright
Credits
Custom Home (and Group Home Page)
Database MySQL - MyISAM
Database MySQL - InnoDB
Date and Time
Debugger Console
Directory (of hyperlinks)
Documentation link from Tiki to doc.tiki.org (Help System)
Docs
DogFood
Draw
Dynamic Content
Preferences
Dynamic Variable
External Authentication
FAQ
Featured links
Feeds (RSS)
File Gallery
Forum
Friendship Network (Community)
Group
Help
History
Hotword
HTML Page
i18n (Multilingual, l10n, Babelfish)
Image Gallery
Import-Export
Install
Integrator
Interoperability
Inter-User Messages
InterTiki
jQuery
Kaltura video management
Karma
Live Support
Logs (system & action)
Lost edit protection
Mail-in
Map
Menu
Meta Tag
Missing features
Visual Mapping
Mobile
Mods
Modules
MultiTiki
MyTiki
Newsletter
Notepad
OS independence (Non-Linux, Windows/IIS, Mac, BSD)
Organic Groups (Self-managed Teams)
Packages
Payment
PDF
Performance Speed / Load / Compression / Cache
Permission
Poll
Profiles
Quiz
Rating
Realname
Report
Revision Approval
Scheduler
Score
Search engine optimization (SEO)
Search
Security
Semantic links
Share
Shopping Cart
Shoutbox
Site Identity
Slideshow
Smarty Template
Social Networking
Spam protection (Anti-bot CATPCHA)
Spellcheck
Spreadsheet
Staging and Approval
Stats
Survey
Syntax Highlighter (Codemirror)
Tablesorter
Tags
Task
Tell a Friend, alert + Social Bookmarking
Terms and Conditions
Theme
TikiTests
Timesheet
Token Access
Toolbar (Quicktags)
Tours
Trackers
TRIM
User Administration
User Files
User Menu
Watch
Webmail and Groupmail
WebServices
Wiki History, page rename, etc
Wiki plugins extends basic syntax
Wiki syntax text area, parser, etc
Wiki structure (book and table of content)
Workspace and perspectives
WYSIWTSN
WYSIWYCA
WYSIWYG
XMLRPC
XMPP




Useful Tools