Forums / Suggestions / Administration Interface and GUI improvements

Administration Interface and GUI improvements

Author Message

Alexandre Cunha

Monday 22 March 2004 6:10:24 pm

This is my proposal answering to the recent Balazs Halasy posts requesting sugestions.
This proposal, extends the Ez ideas.

You can read more here:
http://ez.no/community/forum/suggestions/gui_improvements_phase_1
http://ez.no/community/forum/suggestions/the_administration_interface_project
http://ez.no/community/news/the_administration_interface_project

I submit this to see if more users agree with my perspectives and opinions.
Please excuse me my bad english. If you no understand something, please ask.

This document maybe updated next days.

The problem:

EzPublish (until version 3.3-3) is an excellent framework and content management tool.
Unfortunetly, its admin interface does not allow a easy and fast contents administration.

The solution:

<b>ezPublish ezWebDesktop </b>

ezWebDesktop will be the new ezP admin interface.
Look to ezWebDesktop, like your GUI interface you use everyday in your desktop.

With ezWebDesktop, you can quicly access all important actions with 2 or 3 mouse clicks.
This reduces the wait for http requests (for each mouse click) and improves the user speed managing content.

<b>The new Interface main layout:</b>

<table width="100%" class="doclist" summary="The new Interface main layout">
<tr>
<td colspan="3">
Area A
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>ezPublish Logo</td>

<td align="right">
<p>| New | Mode View | Setup | Advanced Setup | Bookmarks | My account
|<br>
logout (user_name)|</p>
</td>
</tr>
</table>
> Top node / folder A / folder AA
</td>
</tr>
<tr>
<td width="30%">
<p> </p>
<p> </p>
<p>Area B</p>
<p> </p>
<p> </p>
<p> </p>
</td>
<td>Area C</td>
<td width="20%">Area D
</tr>

</table>

<b>Area A</b>

- Contains the ezP logo (small logo)
- the new dinamic menu - explained bellow
- login/logout
- path-block

<b>Area B</b>

- dinamic content structure tree - the main navigation is made where - this is the most important place
to navigate trought the content
- search input field
- search filters ( check nboxes to filter the content - class for example)
- content language selector/switcher

<b>Area C</b>

This área is the working place.
This is where most of the daily work will be carried out (some navigation, creation of new nodes,
content editing, etc.)
Bellow, you have the Quick options area.

<b>Area D</b>

Not sure if this area is really important. Many times this area is not showig important information,
so we can move the information showed where to other places (to the top area C, others to area B)
Is better have a larger Area C than create this Area D.
But i need thing more about this ...

<b>Logical states/modes</b>

I agree to the proposal posted here: http://ez.no/community/news/the_administration_interface_project
with some exceptions.

<b>Navigation mode</b>

The right place to make navigation, is the Content Structure tree. But the user can do basic navigations
tasks in the Area C like we do today.

<b>Edit Mode</b>

The user enters in Edit mode, when choose create or edit any content. In this state, all menu
options disables/greyed.
The content struture tree and search disables/greyed too.

<b>"Generate internal link" tool/feature - Related Objects</b>

Editing any content, the user can assing existing content to the edited content. To do this, the user
push the Assign Content button (in related objects area at botton).
In the left area (area B) open the Structure tree alowing the user browse content. This structure tree is
like the navigation structure tree explained before with few differences.
Each node content, haves a check box.
The user can choose multiple nodes clicking the check boxes.

<b>Browse Mode </b>

This mode as describes before by Balazs has replaced by the example above.

<b>Explaning some new interface components</b>

<b>New dinamic horizontal menu </b>

The new dynamic menu will substitute the old tabs menus on next versions.
This menu allows a faster access to the options, reduced mouse clicks and reduce the time spend with HTTP requests.

<b>Menu tree example: </b>

New - allow create new contet in the node
|- (content classes)
|-- Folder
|-- Article
|-- InfoPage
|-- etc ...
|- (users classes)
|-- user group
|-- user
|- (media classes)
|-- Image
|-- file

Mode View (not sure if this is a good name)
|-- Content Struture -> root / Site map / Recicle bin / etc ...
|-- Media Struture -> root / Site map / Recicle bin / etc ...
|-- Shop
|-- Setup -> see Setup main menu bellow
|-- Advanced Content Setup -> see Setup main menu bellow
|-- MyAccount -> see MyAccount main menu bellow

Setup
|-- Cache -> Clear All Caches / Clear Content Caches / etc ...
|-- URL translator
|-- URL management
|-- RSS
|-- (etc ...)
|-- system Information

Advanced Content Setup (not sure if this is a good name or placed here)
|-- Classes
|-- Tenplates
|-- Sections
|-- (etc ...)

Bookmarks - the user bookmarks
|-- bookmark 1
|-- bookmark 2
|-- bookmark 3
|-- (etc ...)

MyAccount
|-- myDrafts
|-- myBookmarks
|-- passowrd change
|-- (etc ...)

<b>The new Structure tree </b>

Lets see an example:

...- root node
.....+ news (3 itens)
.....+ about us (1 iten)
.....+ welcome page (2 itens)
.....- our produts (2 itens)
........+ products cat 1 (empty)
........- products cat 2 (2 itens)
...........- product 2-1
...........- produts 2-2
.....- contant us

<b>New quick options:</b>

<b>A edit box </b>
- to allow quick jump to some node or object

<b>Bulk insert itens </b>
Suppose the user want create 10 links in a folder. Chosing bulk insert, opens a page in area C
allowing create multiple content for the same class.

<b>Copy Folter </b>
- everything within that folder will be copied too.

<b>Multiple move content objects: </b>
- use check boxes to select multiple objects, then click "Move"
- in left panel, open the content struture tree
- the user choose the folder where want move the objects
- click ok
- the main área updates (without moved objects)
The Move option should me removed from the edit object. Doesnt make sence do a edit to
move the object.

<b>Multiple copy content objects: </b>
works like multiple move

<b>other ideas: </b>
- Why not use XUL ? it possible use XUL to design the complete interface or just some components, like the dinamic menu
see examples here: http://www.xulplanet.com/tutorials/xultu/menubar.html
limitations: only Gecko browsers can run XUL components
This is not a realy a big problem, because (as i know) we have Gecko browsers for all plataforms.

<b>Sugested priorities for next version (3.3.4) - phase 1 </b>
1 - Dinamic menu
2 - Multiple move
3 - Copy folder (everything within that folder)
4 - Multiple Copy

Other changes i suggest will be introduced on 3.5 and later versions

Thats all folks ...

axel

http://AlexandreCunha.com

Alexandre Cunha

Sunday 28 March 2004 6:47:14 pm

To see a example of the new dinamic admin menu, look here:

http://ez.no/community/contributions/hacks/ezp_css_admin_menu_0_1a

http://AlexandreCunha.com