Scribd
Upload
157 views2 pages

UI Assignment

The document provides instructions for designing three web pages for an airline registration application. The home page will have a logo and links to register a flight. The register flight page will capture flight details in a table and validate the input. If valid, it will redirect to a confirmation page thanking the user. CSS styles include colors for labels, text boxes, headers and backgrounds. Validations check that required fields are filled, times are valid, and at least one day is selected.

Uploaded by

Tushar Vaze
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
157 views2 pages

UI Assignment

The document provides instructions for designing three web pages for an airline registration application. The home page will have a logo and links to register a flight. The register flight page will capture flight details in a table and validate the input. If valid, it will redirect to a confirmation page thanking the user. CSS styles include colors for labels, text boxes, headers and backgrounds. Validations check that required fields are filled, times are valid, and at least one day is selected.

Uploaded by

Tushar Vaze
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

UI Assignment

Page Design:

Home Page – It will have one image logo in header with message “XYZ Airlines”. Footer should have
contact address and link to www.google.com. In central area, it will have link to Register Flight.html.

Register Flight: It will also have same header and footer as home page. Design central section per below
guidelines. Ensure that controls are aligned through table tag.

Capture below details from user:

Flight Code:

From:

To:

Departure Time: (Use text box to enter value from 1 to 24.Minutes not to be considered)

Arrival Time: (Use text box to enter value from 1 to 24.Minutes not to be considered)

Capacity:

Weekly Frequency: (Use seven checkboxes one for each day. This indicates the week days when flight is
scheduled)

Add submit button. On submitting the form, if all validations are passed, navigate to Confirmation page.

Confirmation Page: This page will also have same header and footer sections. In central section, it will
have a message like “Flight registered successfully” and there will be a link to Home page.

CSS Design:

Lables to capture details should be displayed in blue color.

Page background should be pink for all three pages (can apply directly in pages, hence not required in
external CSS)

Text box background should be yellow

Text box font should be red


Header label should be of red color

Validations (for Register Flight page):

All fields are mandatory.

Departure time should be less than arrival time.

Value in departure time should have numbers only and from 0 to 23.

At least one checkbox should be selected for weekly frequency.

(Optional) Flight code should contain at least one alphabet and one digit.

Display appropriate message if validation has failed.

All The Best

You might also like