Opentaps 2 User Interface Principles
With opentaps 2 Notes, our first application using the opentaps 2 framework, you can already see some of the important changes to the user interface to make it easier to use, faster and more responsive, and easier for developers to work with.
Client Sided User Interface
Everything Happens on the Page
When you click on the button to create a new note, you get a message right away telling you the note was created (or there was a problem.) You don't have to submit your form and wait for a response from the server. When you create a new note, it automatically pops up on the left to the right hand side. When you start to scroll down the list of notes, the HTML page anticipates that you'll soon need to see more notes and fetches them from the server before you get to the end of the page, so you don't have to wait when you get there.
CSS and Div Layouts
All the layout is now done with CSS and divs. There are no more tables any more. This makes much easier to move things around on the page. For example, if I want to change the layout by moving the list of notes below the create note box, I just remove the float:left tag from the css section, and it changes from:
No tables, no tr, td, and no need to change any server side script or code!
More Friendly Messages
Isn't it better when your computer is a little human? That's why we made message friendlier:
- I have created your note successfully.
- I couldn't find a user with key
- Is your input correct? I got this error when I tried to validate it:
- Oh no! I got an unexpected error:
- Let's hear it from (Your Name Here)
- That's all, folks!