01. Landing page 04.07.

2018

01.01 Landing page_closed tabs

- On selection panel animates

to expand to open state. See
‘01.02_Landing page_open tab’
screen below.
- Animation to last 250
miliseconds.

On selection user brought to

login page.

01.01_Landing page_open tab

- On selection panel animates

to collapse to closed state. See
‘01.02_Landing page_closed
tabs’ screen above.
- Animation to last 250
miliseconds.

On selection user brought to

‘02.02_Step 1_Tell us some
details_Search by address’.
02. Step 1 04.07.2018

02.01_Step 1_Tell us some details_Search by address On selection user brought to

previous page ’01.01 Landing
page_closed tabs’.

- On selection highlight field.

Have cursor in selected state.
- Mobile and tablet devices:
Use standard keyboard type.
- No special characters or
numbers are accepted in the
field.
- Validation occurs after cursor
has left field, when input is
empty. Error message: Please
enter your name.

- On selection highlight field.

Have cursor in selected state.
- On type remove hint text.
- Mobile and tablet devices:
Use numerical keyboard type .
- On type chunk numbers in the
given format and add the dash
(-) after the date and month
have been entered.
- Validation occurs after cursor
has left field, when input does
not match date format. Error
message: Please enter valid
date of birth.

- On selection highlight field.

Have cursor in selected state.
- On type remove hint text.
- Mobile and tablet devices:
Use email keyboard type .
- Validation occurs after cursor
has left field,when input does
not match standard email
format. Error message: Please
enter a valid email address.

- On selection highlight field.

Have cursor in selected state.
- On third character entered
show list of auto suggested
addresses. Show a max of 10
addresses at a time. Use native
browser or device list.
- On selection of an item from
the list, fields animate down to
appear below - see 02.02_step
On selection address 1 screen, with selected address
fields animate down to populated in field.
appear below - see -If entered address does not
appear in list, show error
02.02_step 1 screen. message: Address not
recognised, please enter
address manually.
- Validation occurs after cursor
has left field,when input is
empty. Error message: Please
02.02_Step 1_Search address
inpur address.

- On selection all fields are

validated.
- On successful validation user
is brought to Step 2.
- When error(s) are returned
scroll user to the first error on
the screen with the field in its
error state. Given inline
validation, errors will only occur
when the field has no input.
Show error message
underneath button: Please see
errors above.

- On selection highlight field.

Have cursor in selected state.
- Mobile and tablet devices:
Use standard keyboard type.
- Validation occurs after cursor
has left field, when input is
empty. Error message: Please
enter.