The above page is how the water billing system looks like before any transactions happen. The account names, customers names, current and previous meter readings are all blank. The rate 2 is predefined and appears automatically on the rate’s text field. The border header “PROVIDE DETAILS BELOW” requests the Billing Manager to provide particular customer details in their corresponding text fields.

If no field is filled and the calculate button is clicked the system provides a message dialog box prompting the user to fill the fields. By default the warning is “enter a valid account number” hence the interface looks like the snapshot above.

If the account number is correctly filled, with other fields not filled, the interface looks like below:-

If you incorrectly fill the customer’s name, the system provides a message dialog box warning the user to re-enter the customers name such that the system looks like below:-   

If the correct name is filled the interface looks like below:-

The snapshot above shows how the system looks like when the correct name and account number are filled.

If the user mistakenly enters a previous meter reading that is bigger than the current reading, the system does not calculate the customer’s bill but instead a message dialog box prompting the user to re-enter the readings.

  

If the readings are collect but one of the readings has a wrong format the following dialog box is displayed to tell the user to enter the correct values.

A system that has all fields correctly filled, the billing system looks like the picture below:-

When the calculate button is clicked the bill is displayed as shown below:-

When the clear button is clicked the system returns to the interface that has no filled area.