Forum OpenACS Q&A: Copenhagen - UI discussion

Posted by Jarkko Laine on
Topic: User Interface issues, Subsites

Present: Lars Pind, Frank Nikolajsen, Bruno Mattarollo, Hazi Gharagozwu, Raad Al-Rawi, Don Baccus, Simon Carstensen, Ronald Haynes, Niels H.S. Nielsen, Denis Roy, Jarkko Laine

Summary of Discussion:
There is no real usability studies known regarding OpenACS. Raad has got some feedback from dotLRN users, which has basically been good. People are satisfied with the navigation system, although some minor tweaking is still needed.

Lars has divided the current topics in the UI field to four different groups:

  • Navigation: At the moment the context bar is the only feature provided by the system. Even it has its drawbacks and weirdnesses in the functionality. The bar needs some improvement. Besides some infrastructure for making navigation nars is needed (see the widget point)
  • UI / Style Guide: Some topics of the guide are web accessibility things (text-based browsers, voice UI) and validating of the html code. There’s also a not-quite-finished guide for graphics designers regarding stylesheet and templating stuff, which should be finished sooner rather than later.
  • Widgets for forms, lists, navbars and context bars are sorely needed. Ad_form / form builder is at the moment the only one. Don tries to find time to enhance ad_form docs and make more demos for it.
  • Low-hanging front: Doing certain administrative tasks (user/group admin) is currently tedious.
All these aspects should be also considered from the view of an individual package and even when the pages are created using new portal system.

One very important part of the discussion was the possibility to use third party editors like Dreamweaver or MS Word to produce content and then upload it through webDAV interface. Mozilla has the possibility to use the editor to create a page and then automatically push it to a web form. This should be researched in more detail.

Recommendations and decisions
UI of OpenACS subsites should be inproved. Lars has made mockups of proposed functionality and they can be found from Collaboraid site.

It should be possible to be able to customize adp templates even trough web interface. This works in ShareNet and it could be used as an example for the development.

The resulting “normal user view” of a page should be possible to view when editing content (e.g. like in forums, but more versatile)

Don takes a look at page rendering in the new portal system and improving the user/group admin UI (latter with Hazi). The latter should definitely be in the 4.7/5.0 release.

Lars goes on developing the list builder and other like features.

Something like Demolinux (linux distro working out of a cd in RAM) should be considered. At the moment a quick intro to OpenACS is not really possible. Other example of such distro is Knopix. Frank and Ronald sign up to find out how to make such a cd image of a working OpenACS instance.

Open questions
How does the Mozilla-style code-push to a web form work and how could it be used.

Posted by Dave Bauer on
One option for Mozilla based editing of content is Twingle.

This is an attempt to offer a standard interface to a site content and hierarchy. It uses webdav to access a site's content.

The ns_dav project was started to offer WebDAV access to AOLserver.

It is just a start. A goal would be an ns_dav interface to the content repository, so that the CR files could be accessed from a WebDAV filesystem.

More on WebDAV:

This work definitely overlaps with CMS.

Posted by Andrei Popov on
Another (Mozilla-only) possible nice-have could be proper use of <LINK REL="relation"> element in all pages --- it can then generate a prev/next/up/home toolbar in Mozilla.
Posted by Jarkko Laine on
That's a good idea, Andrei, and shouldn't be too hard to implement to subsites. In fact with Lars's proposal about navbar we would get this with just a few lines of code extra.
Posted by Bruno Mattarollo on

I started working, in my spare time, on a generic CSS for OpenACS (out-of-the-box) and on making the calendar widgets layout-free (as much as possible). This is just the start but it's aiming towards having OpenACS be more flexible in the layout and also be able to support skins more easily (just-replace-the-css-and-there-you-go type of scenario).

I have the calendar dt_widget_month already done ... it was quite simple 😊. I will continue and once I have something more or less finished, I will send the diff file to ... Lars?. As you all might know, I am not a designer but we have to start somewhere, right? In this case the start is to get the core modules to output proper XHTML.

I will -most probably- start working in a new job within Greenpeace so it means that I will have even less time to work on this but at least I am making some steps forward.

Posted by xx xx on
Very good!
Does this mean you make use of <div> and <span> instead of tables?
Is there a 'Naming Convention' that you use or that should be used?
Posted by Bruno Mattarollo on

I use tables but not for layout. The layout is controlled by CSS. In the case of the calendar, in particular, I think we still need to use tables (since that's how the information is structured, in a tabular way) but the layout (all the fonts, colors, positioning etc) is controlled from the CSS.

My naming convention is quite lax at the moment, I have one main div called calendartable and then a class called calendar that is applied to each td. I use another class calendarheader for the caption of the table containing the calendar. For the day view rows I have dayvieweven and dayviewodd just to continue with the current code.

I just started working on this because that's something I have been wanting to do for a long time ... I want to make it easier to change the layout of the widgets and stuff 😊.

Posted by Jeff Davis on
Bruno, rather than dayviewodd and dayvieweven you might want to use simply odd and even so that the banding will be done by the default sitewide css and if you want to overide it you can still do
.calendar .odd { }

Here is what I ended up with for the calendar table:

<table class="calendar">
  <tr class="title"><th class="month" colspan="7">July 2003</th></tr>
  <tr class="days">
    <th class="day">S</th>
    <th class="day">M</th>
    <th class="day">T</th>

    <th class="day">W</th>
    <th class="day">T</th>
    <th class="day">F</th>
    <th class="day">S</th>
    <td class="empty">&nbsp;</td>
    <td class="empty">&nbsp;</td>
    <td class="day">1</td>
    <td class="day">2</td>
    <td class="day">3</td>
    <td class="today">4</td>
    <td class="day">5</td>