Lessons Learned: FDA.gov Redesign May 8, 2008 Sanjay J. Koyani Director of Web Communications U.S. Food and Drug Administration

Web Executive Seminars Putting Online Audiences First, Again and Again May 8, 2008 National Press Club Washington, DC Learn more: www.forumone.com/wes

Lessons Learned: FDA.gov Redesign May 8, 2008 Sanjay J. Koyani Director of Web Communications U.S. Food and Drug Administration

Get Buy-In: Top Down June ’07 Commissioner Memo: “FDA Web Communications in the 21 st Century” “ Our goal is to transform FDA.gov to a gold standard among federal sites. By creating a single online identity that more fully supports the agency mission, we will strengthen all FDA Center and Office sites. Together we will create an FDA Web presence that is: Person-centric; Informative; Empowering; and Interactive.”

June ’07 Commissioner Memo: “FDA Web Communications in the 21 st Century”

“ Our goal is to transform FDA.gov to a gold standard among federal sites. By creating a single online identity that more fully supports the agency mission, we will strengthen all FDA Center and Office sites. Together we will create an FDA Web presence that is:

Person-centric;

Informative;

Empowering; and

Interactive.”

Get Buy-In: Bottom Up Commissioned Audit of FDA Web Staffs Web staffs wanted: Centralized Web governance Policies, Standards, and coding guidance More uniform publishing systems Coordinated Web communications to reduce risk and embarrassment to agency

Commissioned Audit of FDA Web Staffs

Web staffs wanted:

Centralized Web governance

Policies, Standards, and coding guidance

More uniform publishing systems

Coordinated Web communications to reduce risk and embarrassment to agency

Get Buy-In: External Support

Educate on FDA’s “Gold Standard” Approach to Web Design

Practice Research

Increase Web Site Credibility A physical address is provided on the homepage and all major points of entry Frequently ask questions are provided AND are useful

A physical address is provided on the homepage and all major points of entry

Frequently ask questions are provided AND are useful

Increase Web Site Credibility Organization providing the information is highly visible Site is arranged in a logical way Provides phone numbers Dates are provided up-front and are kept current

Organization providing the information is highly visible

Site is arranged in a logical way

Provides phone numbers

Dates are provided up-front and are kept current

Placement of Instructional Text

Placement of Instructional Text Users’ focus is pulled almost immediately to the User Name field (they are motivated to take an action) Jumping immediately to that field causes the user to leapfrog over the instructional text Once downstream of the instructional text Users’ are unlikely to go back and read it, even if unsure of what the requirements are Users make a best guess and move on, attracted by the radio buttons

Users’ focus is pulled almost immediately to the User Name field (they are motivated to take an action)

Jumping immediately to that field causes the user to leapfrog over the instructional text

Once downstream of the instructional text

Users’ are unlikely to go back and read it, even if unsure of what the requirements are

Users make a best guess and move on, attracted by the radio buttons

Guidelines for Instructional Text Divide dense instructions up for individual action objects Put the appropriate instructions in close proximity to their respective action objects Place the instructional text next to the corresponding action object, preferably in the downstream direction , to the right or just below it If the instructional text is too long and its recommended placement would disrupt the layout of the action objects, provide a link that dynamically displays a pop-up when clicked

Divide dense instructions up for individual action objects

Put the appropriate instructions in close proximity to their respective action objects

Place the instructional text next to the corresponding action object, preferably in the downstream direction , to the right or just below it

If the instructional text is too long and its recommended placement would disrupt the layout of the action objects, provide a link that dynamically displays a pop-up when clicked

Allow Simple Searches 11 58 33

User-Centered Design Process

Redesign Activities Developed Web Governance Team tasked with guiding redesign effort Developed Strategic plan and timeline detailing our evolutionary approach to Web Determined agency resources , need for contract specialists , etc.

Developed Web Governance Team tasked with guiding redesign effort

Developed Strategic plan and timeline detailing our evolutionary approach to Web

Determined agency resources , need for contract specialists , etc.

Redesign Activities Assessed FDA.gov’s top tasks, audiences, and needs with the FIT • Conducted competitive analysis of top health Web sites in industry and government • Reviewed past usability test reports & evaluations conducted on FDA.gov

Assessed FDA.gov’s top tasks, audiences, and needs with the FIT

• Conducted competitive analysis of top health Web sites in industry and government

• Reviewed past usability test reports & evaluations conducted on FDA.gov

Redesign Activities Performed card sorting exercises with 130 users, including the public, health professionals, and industry • Developed several FDA.gov homepage prototypes

Performed card sorting exercises with 130 users, including the public, health professionals, and industry

• Developed several FDA.gov homepage prototypes

Redesign Activities • Usability tested the FDA.gov prototypes via multiple usability tests, both on site at FDA, and remotely with 58 members of public, health professionals, and industry

What We Measured in Usability Testing

Rapid Reporting via Automated Usability Testing Tool

Rapid Reporting via Automated Usability Testing Tool

Does Progressive Layering Improve Performance?

Fly-Out Example

Lessons Learned

What’s Next Build-out templates and IA for all FDA.gov pages Usability test template designs with users to ensure validity Conduct content audit and expand Web writing skills Migrate content and designs into an automated Web content management system Continual site improvements planned around FDA top tasks

Build-out templates and IA for all FDA.gov pages

Usability test template designs with users to ensure validity

Conduct content audit and expand Web writing skills

Migrate content and designs into an automated Web content management system

Continual site improvements planned around FDA top tasks

Resources/Tools Usability.gov: www.usability.gov Research-Based Web Design & Usability Guidelines: http://www.usability.gov/pdfs/guidelines.html Webcontent.gov: www.webcontent.gov Automated Usability Testing Tool: http://www.mindd.com/Content.aspx?pid=UTEStandard NIST Common Industry Format: http://zing.ncsl.nist.gov/iusr/documents/cifv1.1b.htm#_Toc467573702

Usability.gov: www.usability.gov

Research-Based Web Design & Usability Guidelines: http://www.usability.gov/pdfs/guidelines.html

Webcontent.gov: www.webcontent.gov

Automated Usability Testing Tool: http://www.mindd.com/Content.aspx?pid=UTEStandard

NIST Common Industry Format: http://zing.ncsl.nist.gov/iusr/documents/cifv1.1b.htm#_Toc467573702

Questions ? CONTACT INFORMATION Sanjay Koyani, U.S. Food and Drug Administration Email: Sanjay.koyani@fda.hhs.gov Phone: 301.827.7131

CONTACT INFORMATION

Sanjay Koyani, U.S. Food and Drug Administration

Email: Sanjay.koyani@fda.hhs.gov

Phone: 301.827.7131

LEARN MORE: www.forumone.com/wes Web Executive Seminars