Hello James, welcome to your cloudclinica account!

cloudclinicaBETA LOG OUTMY ACCOUNT MY STUDIESHOME

My CRFs

CRF Name Creation Date Status

Enrollment 01/09/2014 Actions

Demography 01/10/2014 Actions

Adverse Event 01/10/2014 Actions

ConMed 01/06/2014 Actions

Last Rule 01/17/2014 Actions

DONE

DRAFT

DRAFT

DRAFT

DRAFT

Edit Clone Delete Order

Display

Save CRFBack to CRFs

User is prompted to select type of field when clicking on “Add Item”. See next slide for details.

Automatic questionNumbering

Autosave every 2 min

Last auto-saved: 4.33pm

Add item

+Add Tab

Field

Mouse turns into “dragging pointer” when user hovers a question.

Add Tab button Icons to edit or delete question

Save CRFBack to CRFs

Add item

+Add Tab

Same option to edit or delete a tab

Last auto-saved: 4.33pm

TabTab NameSubtitle

1- Hovering over or clicking the Add item’ displays this pop up2- Clicking on any item displays the appropriate panel in the mockups below

Add item Name (TEXT)*Type (ENUM: Text, Textarea, Single-select , Multi-select, Radio, Checkbox, File)*Data type (ENUM: ST, REAL, INT, DATE, PDATE)Description (TEXT)Left Text (TEXT)Right Text (TEXT)Question number (INT) – Auto generated when the field is relocated on the pageResponse text (TEXT) * -- only required if item type is: single-select, multi-select, radio, checkboxResponse values (INT) * -- only required if item type is: single-select, multi-select, radio, checkboxResponse layout (ENUM: Horizontal, Vertical, – only id item type is Radio, Checkbox

Size, Maximum – only if item type is Text, Textarea)Default value (INT) – only if item type is: Single-select, Multi-select, Radio button, CheckboxDecimal format (w(d)) – w is integer width if item type is Real or Integer and d is decimal width if item type is RealValidation expression regexp() – only required for time fields Validation message (TEXT) – only required for time fieldsRequired (ENUM: Yes, No)

Add Tab Name (TEXT) *Subtitle (TEXT)Instructions(TEXT)

Add Table Name (TEXT) *Header (TEXT)Min rows (INT)Max rows (INT)

Add Column (Same as Add Item)

Data Structures

Text fieldNumberSelect Item(s)Radio buttonsCheckboxesDateTimeTableFile

ITEMS

Add Item Mockup

1- Hovering over the Add item’ displays this pop up2- Clicking on any item displays the appropriate panel in the mockups below

Add/Edit Text Field Mockup

1 Name *:2 Description:5 Min text size:6 Max text size:7 Default Value:8 Resizable*?

YesNo

9 Required*?YesNo

Name 1Type Text if 8 = No Texttarea if 8= yesData type STDescription 2Left Text 3Right Text 4Response text –Response values –Response layout Size = 5

Maximum = 6Default value 7Decimal format –Validation exp. –Validation message –Required 9

Click here to insert right text Click here to insert left text 3 4

1- Edit icon displays this configuration panel2- Delete icon removes the item

Field shrinks/grows according to max (5, 6)1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

*

Show according to 9

1 Name *:2 Description: Add item *: 5 Text 6 Value

7 Default Value:8 Multi-Select?

YesNo

9 Required*?YesNo

Add/Edit Select Item Mockup

1- New row auto added when one completes2- Row position can be dragged and dropped

Name 1Type Single-Selectif 8 = No Multi-Select if 8= yesData type INTDescription 2Left Text 3Right Text 4Response text 5 [, 5 ]Response values 6 [, 6 ]Response layout –Default value 7Decimal format –Validation exp. –Validation message –Required 9

3 4

Field shrinks/grows according to max text in 5

Click here to insert right text Click here to insert left text *

Show according to 9

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

1 Name *:2 Description: Add item *: 5 Text 6 Value

7 Default Value:8 Layout?

HorizontalVertical

9 Required*?YesNo

Add/Edit Checkboxes Mockup

3 4

1- Add/remove/position checkboxes according to 52- Layout radio buttons according to 8

Name 1Type CheckboxData type INTDescription 2Left Text 3Right Text 4Response text 5 [, 5 ]Response values 6 [, 6 ]Response layout Horizontal 8

Vertical 8Default value 7Decimal format –Validation exp. –Validation message –Required 9

Checkbox Text1 Checkbox Text2Checkbox Text3

Default value according to 7

1- New row auto added when one completes2- Row position can be dragged and dropped

Click here to insert right text Click here to insert left text

*

Show according to 9

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

1 Name *:2 Description: Add item *: 5 Text 6 Value

7 Layout?HorizontalVertical

8 Required*?YesNo

Add/Edit Radio Buttons Mockup

3 4

1- Add/remove/position radio buttons according to 52- Layout radio buttons according to 8

Name 1Type RadioData type INTDescription 2Left Text 3Right Text 4Response text 5 [, 5 ]Response values 6 [, 6 ]Response layout Horizontal 7

Vertical 7Default value –Decimal format –Validation exp. –Validation message –Required 8

Radio button Text1 Radio button Text2Radio buttonText3

1- New row auto added when one completes2- Row position can be dragged and dropped

Click here to insert right text Click here to insert left text

*

Show according to 8

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

Add/Edit Date Mockup

1 Name *:2 Description:5 Partial Date?

YesNo

6 Required*?YesNo

Name 1Type TextData type DATE if 5 = No

PDATEif 5 = YesDescription 2Left Text 3Right Text 4Response text –Response values – Response layout – Default value –Decimal format –Validation exp. –Validation message –Required 6

3 4Click here to insert right text Click here to insert left text *

Show according to 6

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

Add/Edit Time Mockup

1 Name *:2 Description:5 Required*?

YesNo

Name 1Type TextData type REALDescription 2Left Text 3Right Text 4Response text –Response values – Response layout Size = 5Default value –Decimal format –Validation exp. regexp:/^[0-1]\d\.[0-5]\d|2[0-3]\.[0-5]\d$/Validation message Correct time format is 24:00 Required 5

3 4Click here to insert right text Click here to insert left text *

Show according to 5

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

Add Number Field Mockup

1 Name *:2 Description:5 Number type:

IntegerDecimal

6 Min integer width:7 Max integer width:8 Decimal width: 9 Required*?

YesNo

Display only if number is decimal

99999.993 4

Click here to insert right text Click here to insert left text *

Show according to 9

Name 1Type TextData type REAL if 5 = Decimal

INT if 5 = IntegerDescription 2Left Text 3Right Text 4Response text –Response values – Response layout Size = 6 + 8 +1 – for decimal point

Maximum = 7 + 8 + 1 – for decimal pointDefault value –Decimal format 7(8)Validation exp. –Validation message –Required 9

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

Show integer width according to max (6 , 7) Show decimals width according to 8

Add/Edit File Mockup

1 Name *:2 Description:5 Required*?

YesNo

3 4Click here to insert right text Click here to insert left text *

Show according to 5

1- Area shrinks/grows according to right-left text + field size2- Area is draggable anywhere on the page

Click to upload file

Name 1Type FileData type REALDescription 2Left Text 3Right Text 4Response text –Response values – Response layout – Default value –Decimal format – Validation exp. –Validation message –Required 5

Add/Edit Table Mockup

1 Name *:2 Header:3 Minimum rows:4 Maximum rows:

Area is draggable anywhere on the page

Header according to 2

Show Column header +min rows according to 3

Name 1Header 2Min rows 3Max rows 4

Insert table with 1 column, taking the whole width of the page

Clicking this edit icon displays the Column configuration panel, next slide

Header

Clicking this edit icon displays the Add/Edit Table panel, above

Add/Edit Column Mockup

1 Header*:2 Type?

TextSelect ItemRadio buttonsCheckboxesDateTimeNumberFile

Use same mockup for the same item

Clicking the edit icon displays the Column configuration panel Show column header according to 1

Column Header

Column is draggable to different position on the table

Table Header

Column is resizable by dragging on the edge