Top Banner
1 Re-imagine clinical trial information in a patient-centric way Re-imagine clinical trial information in a patient-centric way
17

Clinical trial info page design

Jun 26, 2015

Download

Health & Medicine

Sergey Voronov

my thoughts on user experience of clinical info pages
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Clinical trial info page design

1Re-imagine clinical trial information in a patient-centric way

Re-imagine clinical trial information in a patient-centric way

Page 2: Clinical trial info page design

2Re-imagine clinical trial information in a patient-centric way

Participating in clinical research can be a daunting step.

The presentation of information related to a patients involvement is fundamental to the success or otherwise of a patients recruitment and continued involvement.

The following materials describe methods that help assure initial and continuous engagement.

Preface

Page 3: Clinical trial info page design

3Re-imagine clinical trial information in a patient-centric way

The trial info page is devoted to patients who want to participate in a trial and are searching for studies based on their con-dition.

For these users, the most important items are to find out whether they are eligible for the trial and whether there are investi-gative sites available nearby.

Therefore, the focus of the front page of the trial info portal is as follows:1. We have highlighted the medical condition so that patients can be sure the trial is relevant for them. 2. We’ve also highlighted the trial title (patient friendly version), study type, phase, status, peri-od and sponsor info as well as a short descrip-tion of the study.

Introduction1

2

Page 4: Clinical trial info page design

4Re-imagine clinical trial information in a patient-centric way

We can have help hints for any medical terminolo-gy patients might not be aware of.

3. For example, clicking on the medication name will show hint with the description and clicking on the type of the study - will give patient information regarding interventional studies.

Then we have a couple of blocks:4. To help patients find site locations 5. Check their eligibility

Each tab in the portal will have:6. Header with study title 7. Footer navigation between sections

Introduction

3

45

6

7

Page 5: Clinical trial info page design

5Re-imagine clinical trial information in a patient-centric way

This page is simple:

1. Big search area with autosuggestion while typing (if patients arrived at trial info page from search page, where they have entered their loca-tion and condition, location will be automatically filled from that page).

2. Number of study sites in the area is displayed.

3. Scrollable list of locations is included on the right with brief info for each site and distance from the specified location.

If the user hasn’t specified his location, we will display a global map and the total number of sites participating in the study.

Locations

2

3

1

Page 6: Clinical trial info page design

6Re-imagine clinical trial information in a patient-centric way

4. Clicking the pin on the map or the site in the list on the right, will expand site details (5)

Locations

54

Page 7: Clinical trial info page design

7Re-imagine clinical trial information in a patient-centric way

For checking eligibility our suggestion is an online screening survey.

1. We can ask patient questions related to the inclusion/exclusion criteria.

2. Depending on answers we can show progress bar filled on top, with title “you are pre-qualified to participate in a trial”.

Of course patients typically can’t answer all of the eligibility questions themselves and these will need to be confirmed during their screening visit at the site. The ones that can be feasibly asked directly from the patient, like age, gender, existing diagnosis and if the user doesn’t meet these crite-ria the progress bar will become red and show the text that “You are not eligible to participate in this study”.

3. For some of the questions, the user is also presented to answer ‘Not sure’ and these answers do not disqualify the user, but will trigger a on-site confirmation of these questions.

4. Eligibility page has sidebar navigation for quick access of each section of the page, manually scrolling the page will highlight the active section.

Eligibility

3

2

14

Page 8: Clinical trial info page design

8Re-imagine clinical trial information in a patient-centric way

1. The left hand side of the screen has a table, which is divided into weeks or treatment cy-cles, study arm information and the schedule of events in each cycle or week.

Timeline

1

Page 9: Clinical trial info page design

9Re-imagine clinical trial information in a patient-centric way

The bar on the right has the full list of interven-tions and events and the user can scroll it man-ually and read one by one. Each element in the timeline table can also be clicked (3) and the list on right will be scrolled to the relevant section (4).

Timeline

43

Page 10: Clinical trial info page design

10Re-imagine clinical trial information in a patient-centric way

1. This page includes patient friendly text about the study outcome measures. For this study, the text has been taken from the Informed Consent materials provided. After outcome measures we will have info regarding risks, benefits, study logis-tics and post- study plans.

2. This page also has sidebar navigation between sections and subsections.

Patient Considerations

21

Page 11: Clinical trial info page design

11Re-imagine clinical trial information in a patient-centric way

Responsive design

Page 12: Clinical trial info page design

12Re-imagine clinical trial information in a patient-centric way

Design is fully responsive, taking full screen, with fixed position of footer header elements, and flex-ible columns.

On mobile devices though, global navigation (1).between main sections will be hidden by default. Patient can access the navigation by tapping the menu button (2).

Responsive design

2

1

Page 13: Clinical trial info page design

13Re-imagine clinical trial information in a patient-centric way

This responsiveness can be achieved just with the use of CSS, no additional HTML will be needed for mobile devices, which makes maintaining the site simple. However, the structure of some pages will need to be changed. There is no space to fit the right sidebar, so it will be automatically hidden when using mobile devices.

Responsive design

Page 14: Clinical trial info page design

14Re-imagine clinical trial information in a patient-centric way

On the Locations page the sidebar is moved from the right side to the bottom of the page, display-ing only a single site (1) at a time, so patients will need to tap the pins (2). on the map to browse the search results.

3. Site location info can be expanded to show more data

Responsive design

1

2

Page 15: Clinical trial info page design

15Re-imagine clinical trial information in a patient-centric way

The presentation of information on the study remains complex – however, through the delivery of such information in a simplified form, it is possible to cre-ate an engaging experience for potential study participants.

This can lead later to ongoing enrollment and study engagement using similar visual representation and information delivery.

Conclusion

Page 16: Clinical trial info page design

16Re-imagine clinical trial information in a patient-centric way

I have provided screenshots of the actual area that fits the screen for all sections. More information is shown to the patients when the site is scrolled. For example, scrolling the eligibility area will show more criteria questions and demographic fields that are required by the rules. Same applies to the consideration sections - I have shown all the sections we will have on this page with items in sidebar. Clicking items in sidebar, or manual scrolling will show all the content required by the rules. Long pages that shows all required sections can be found in designpreviews folder - eligibilitylong.jpg and consideration.jpg.

Also such sections as eligibility or considerations dont have all the data, just all sections with several items in a section to showcase the design.

Additional notes

Page 17: Clinical trial info page design

17Re-imagine clinical trial information in a patient-centric way

Thanks for watching