Nice looking buttons in the Notes Client
After reading Chris Toohey's Quickpoll about Framesets vs. Web I started to think about rewriting a typical Notes Interface (outline to the left, views on the right) to be more "web 2.0" friendly with a landing page. To complete the challenge, the UI should be translateable and, of course, nice looking. The first problem: the typical landing page has "call to action" buttons: big, shiny buttons with an icon and some text. So, how can you do that in Notes? My tries:
- Buttons: can be translated via onLoad events and "document.forms[0].Button.value = document.forms[0].cfdField_LabelForButton.value", no icons possible
- HTML pass thrugh Computed text (=translateable) with <input>s -> just plain ugly.
- HTML pass thrugh Computed text with <button>s -> Does not
work, as the notes internal html parser does not recognise the button
tag
- Notes Table (with nice looking background + rounded corners) and a hotspot -> does not work, as the hotspot can't be set around the table and also because I haven't found a way to vertical center text in a table cell.
- Outline with one entry, styled with rounded corners, translateable the UI (lables are computeable), mouse over effects for the text. Only problem: setting width to "fits to content" has no effect, which means that the translations must be as long as the original text (seems to me that this is a notes bug).
Here is a screenshot:
The last one with the styled outline entry seems to be the best idea up to now, but the "fit to content" problem is bad :-(
Anybody with some ideas how to get nice, translateable, hover aware buttons with icons on it in the notes client?
Here is the demo DB...
|
Nice looking buttons in the Notes Client
|
1 Stephan H. Wissel Permalink Did u try an embedded image with hotspot areas? You could compute the resource name for translations.
2 Jan Schulz Permalink Tried it, but that would mean that I have to put the text on the picture, making one version for every language (and put it into the design template). This is not as flexible as the editable documents solution, where new languages can be added via the client.
3 Charles Robinson Permalink Pull apart the welcome page in Notes 8. They solve this quite nicely by using two-column tables. Their design doesn't handle overflowing very well, but it's not impossible to overcome.