Archive for May, 2008

Great UI examples for LN applications?

I am asked to redesign our ‘corporate LN application template’ which seems to be dated early 2000 or something. This to ’spice up’ our apps especially in the Lotus 8 Standard client.

A quick search on Google did not gave any quick results.

The problem I have with LN apps is that they seemed to be so limited by the Frameset function. So most of the applications have a Header, Left menu, Right pane for content and somewhere a Footer at the bottom. Very predictable. Also most of the Headers I have seen do not include a menu like most Website Headers do.

Ofcourse there are always exceptions and some little graphic extra work do make your applications ‘professional tools for professionals’. Like in the next example:

But still, a very predictable Frameset in use.

My question:

Do you know any good UI design examples for LN applications?

Thanks!

Comments (9)

Performance basics for IBM Lotus Notes developers – Some additions?

Andre Guirard wrote a nice interesting piece of document regarding considerations for application development. The document you can download here.

Recently I have asked to write down some ‘best practices’ from a developer perspective. I see a lot of Andre’s writing return in this, also since most of my work was ‘just’ a collection of documents / papers / hints & tips I have collected the past years.

I will wrote some additional performance considerations which I did not find back in Andre’s work:

Use @trim in all translation events for fields type text, this avoids that you later have to use it in view columns

@Trim(@ReplaceSubstring(@ThisValue; @Char(9):@Newline; ” “))

—-

Make sure when using subforms something is written in Globals of the subform, it dus not matter what (Notes only)

Dim loadfaster As Integer
loadfaster =True

The more subforms you have the more effect code in Globals has.

—-

Don’t use “Print” so much (LotusScript)

Minimize the use of the Print statement when performing actions in long loops. Printing a lot of messages to the status bar or console uses a surprising amount of memory, and it can have a noticible impact on an otherwise fast-running loop. Specifically, the memory used by each Print statement is not released until the entire agent is finished.

—-

Avoid large or complex tables

Large or complex tables can greatly affect the speed with which a form can be rendered (both in the client and in the browser). In particular, avoid tables with a huge number of rows, a lot of nesting, or a large number of hide-when conditions.

—-

For agents: avoid Reader fields when possible

Using Reader fields can slow down all of your document processing code across the board, because the database has to evaluate the reader fields for each document before it can even attempt to do anything with them. This is especially true when the agent signer doesn’t have access to a large number of documents in the database, because the documents that aren’t visible still have to be evaluated before they can be skipped.

—-

Share NotesView References

If you need to use a reference to a view multiple times in your code, get the view only once and share the reference (either using a global or static variable, or by passing a NotesView object as a parameter in functions/subs/methods). Accessing views using getView is a very expensive operation.

—-

Use @Function Agents For Simple Document Modifications

If you just need to modify, add, or delete one or several [non rich-text] fields in all or selected documents in a view, it is much faster to use an agent with simple @Functions (rather than LotusScript or Java) that runs against all or selected documents. 

—-

Resize Arrays Infrequently

ReDim your arrays as infrequently as possible. However, if you have to append data to an array quite often, Redim Preserve is MUCH more efficient than many calls to ArrayAppend

Default view

Whenever your application is opened, your default view is opened. Always be sure that this is a view that opens quickly.

—-

Use buttons and picklists instead of drop-down lists

In some cases, there are so many drop-down lists, and they’re so large and used so frequently, that the only reasonable solution is to stop using them on the main form. The line of reasoning to use is to ask yourself the following questions:

  • How many times will a document be read in its life?
  • How many times will a document be edited?
  • Of the times it’s edited, how many times will these lookups be required?

—-

Use DigestSearch Method

For searching server-based databases from a Notes client, DigestSearch is twice as fast as any other search method available, outperforming both full-text search and LotusScript’s GetDocumentByKey method. You call DigestSearch using this LotusScript command:

Set doc=FastSearchByKey(db, “searchword”)

Like I said before, this is ‘collected work’ so I take no responsibility if it would not increase performance. See it as food for thought =)

Comments (5)

My CSS Toolbox

I do not know how many times I have written a class for aligning a text right or left. Too many, that’s for sure.

The idea with a CSS toolbox is to include a separate stylesheet for these “utility” styles. A CSS toolbox contains styling information that is nothing unique to any particular web application. It’s a collection of common styles that can be useful on any web development project.

A CSS toolbox is not a CSS reset and it is not a CSS framework. And it contains none of the special styling that makes any web application so unique.

Using a CSS toolbox will save you some time. It saves you from writing the same styles over and over again.  If you use the same toolbox your markup will share the same common class names and makes it easier for you to jump back into and understand it.

Here is mine:

/*
AUTHOR: YOUR NAME HERE
you@domain.com

*/
/*
RESETS, BASIC PAGE SETUP, BASIC TYPOGRAPHY
*/
* { margin: 0; padding: 0; }

html { overflow-y: scroll; }

body { font: 62.5% Helvetica, sans-serif; }

ul { list-style: none inside; }

p { font: 1.3em/1.3em; margin-bottom: 1.3em; }

a { outline: none; }

a img { border: none; }
/*
LAYOUT TOOLS
*/
.floatleft { float: left; }

.floatright { float: right; }

.clear { clear: both; }

.transpBlack { background: url(transpBlack.png); }
.layoutCenter { margin: 0 auto; }
.textCenter { text-align: center; }
.textRight { text-align: right; }
.textLeft { text-align: left; }

/*
TYPOGRAPHIC TOOLS
*/
.error { border: 1px solid #fb4343; padding:3px; color: #fb4343; }
.warning { border: 1px solid #d4ac0a; padding: 3px; color: #d4ac0a; }
.success { border: 1px solid #149b0d; padding: 3px; color: #149b0d; }
.callOut { font-size: 125%; font-weight: bold; }
.strikeOut { text-decoration: line-through; }
.underline { text-decoration: underline; }
.resetTypeStyle { font-weight: normal; font-style:normal; font-size: 100%; text-decoration: none; background-color: none; word-spacing: normal; letter-spacing: 0px; text-

transform: none; text-indent: 0px; }

/*
PAGE STRUCTURE
*/

#page-wrap {
 width: 775px;
 margin: 0 auto;
}

 

/*
PRINT TOOLS
*/
.page-break { page-break-before: always; }

/*
DISPLAY VALUES
*/
.hide { display: none; }
.show { display: block; }
.invisible { visibility: hidden; }

Comments (1)

An idea has come true

Sometimes my thoughts are not so bad =)

my idea

Thank you Maureen for listening to our thoughts. We can’t wait for Designer 8.5!

Comments (2)

XML data binding

According to Wikipedia refers XML data binding to the process of representing the information in an XML document as an object in computer memory. This allows applications to access the data in the XML from the object rather than using the DOM to retrieve the data from a direct representation of the XML itself.

In other words you could tie HTML tables to Notes data and navigate through it without reloading the page.

For this SNTT demo I needed:

  • a form to create Book documents with
  • a view to present the books documents as XML
  • a page on which I define an HTML table and connect the table to the XML view in order to give it content
  • (a $$ViewTemplate for the Xml view)

First step:

  • Create your Notes form with some fields. I choose Title, Author, ISBN and Price.
  • Create a set of documents with this form.

Next:

  • Create a view that presents the ‘Books’ documents as XML data.
  • On the fifth tab under ‘Web access’ d not forget to set the option ‘Treat view contents as HTML’
  • The view must start with an opener and closing tag for each document
  • For each column you define sub child elements

xml view

  • Setup a $$ViewTemplate for this View in order to be able to add a root element:

$$ViewTemplate form

Reminder: do not forget to set the content-type for this Form as HTML.

Continue:

  • Create a Form/Page that will hold the HTML Table.
  • Add the following HTML on it:

HTML for table

As you can see the Table is linked to a datasource, in this case the View books.xml. Each TD in the TBody part is linked to a datafield. In this setup the datapagesize is set to 5, meaning 5 documents at a time will be displayed.

Some extras

By giving the table an ID (xmlTBL) you can add functions to navigate through the table such as:

  • previous / next set of documents
  • first / last set of documents

navigation buttons

I bet you can imagine some much better pagination examples.

At the end your ‘bookstore’ will look like this:

how the local bookstore looks like

I have included a working example here.

Comments (3)

Pure CSS Data Chart

Okej, one day too late for SNTT, but some people are also allowed to post SNTT’s already on Wednesdays it seems…

Alen Grakalic wrote a nice article about using pure CSS as data charts. Basically via CSS Alen presents pure data in a graphical way.

Here is how it could look like:

css chart

(almost weekend? or those pills do work?!)

The screen capture is information from a Domino View embedded on a page and transformed with some CSS. Nice? I guess this is a very cheap way of creating more dashboard alike solutions…

Anyway, for those who are curious here is a downloadable working example. Have a nice weekend!

Comments (2)