The main technologies which were adopted for this project were HCI and AJAX.
HCI stands for Human Computer Interaction; it is also referred as Computer Human Interaction (CHI); vaguely it is called Software Ergonomics. HCI mainly focuses on user-centered design and user-centered design is achieved when “people need not have to change the way that they use a system in order to fit in with it. Instead, the system should be designed to match their requirements.” HCI follows these principles:
1. Simple and natural dialogue
2. Speak the users’ language
3. Minimize user’s memory load
4. Be consistent
5. Provide feedback
6. Provide clearly marked exits
7. Provide shortcuts
8. Minimize the user’s slips and errors.
9. Provide help
Development of the User-Interface
The development of the user interface can be divided into three main parts:
1. Dashboard design
2. Sidebar and Main display panel design
3. Header design
The main page of the user-interface is shown in the figure. This is the first page after user login. This user-interface is designed in such a way that a user does not need to click three times in order to navigate at any level. Dashboard is loaded synchronously when the whole page loads. The sidebar and header area is made static since a user requires it all the time while dashboard area is acts like a container to other pages and data. New data is loaded in dashboard area asynchronously.
Any window can be maximized by double clicking on the window or by clicking the link provided in the dashboard module named as Dashboard. The maximized window loads on top of the interface to save the time of the user by avoiding unnecessary loading. The maximized window shows the content of the smaller window in detail.
The following figure shows the area where the new content will load after clicking the “Schedule New Scan”. In the next figure we can see that the content is loaded which was requested by clicking “Schedule New Scan” button.
This whole process of loading takes very less time and user remains intact with interface. And also user finds it very easy to work with the application when he can get all the information required very fast and at one place with minimum number of modifications in the user interface. This also reduces the idleness of the user enhancing the continuity of the interaction between user and the interface. And also this is the maximum level of navigation required in this application but still if some data is required, it loads on the top of the interface as shown in the next figure. When clicked on the “[Click here to select]” link a small window loads avoiding any modification in the present interface.
Besides of designing a user-centered interface there are some other important parameters which are also taken care of:
- The web application is cross-browser. It can run in any browser without any change in the basic structure of the application. It helps user in running the application on different platforms.
- This application can run on any screen-resolution. The problem of resizing during the change of screen resolution is also taken care of. The application does not show any inconsistency at various resolutions.