Online Animated Tour of the What Works Clearinghouse (WWC) re-designed website.
This animated overview tour introduces users to the many features and resources of a previously redesigned What Works Clearinghouse website.
Responsibilities: Producer, eLearning Development
Target Audience: Educators and educational researchers
Tools Used: Camtasia Studio, Adobe Flash (now Animate),
Adobe Illustrator, Adobe PhotoShop, Audacity
Overview
A multiple-module animated tour of a new build of the Institute of Education Sciences (IES) educational standards website, the What Works Clearinghouse (WWC).
Our company, Mathematica Policy Research, won the bid to redesign an educational research clearinghouse website for the What Works Clearinghouse (WWC) an initiative of the U.S. Department of Education’s Institute of Education Sciences (IES).
They wanted an online presentation to highlight the features of the redesigned website.
Because of the wide range of educational resources and reviews the clearinghouse offered, we proposed a multi-tabbed animated and narrated overview tour which would be embedded at the top navigation of the redesigned website.
Process
After discussing objectives and needs with our company’s WWC Director, and the WWC client Director, we researched and shared several examples of animated tours with the client to get their buy in.
Once a template style was approved, I created wireframes and mockups of the Flash animated tour Player, and worked with the graphics team to create branded full color mockups of the intro screens for each section of the tour.
Mockups of different screens in the tour.
A comprehensive script was written and reviewed by both internal and client SME’s. The voiceover was professionally recorded at a local recording studio.
The multimedia, graphics, communications, IT teams collaborated to produce the multi-segmented animated tour, created in Adobe Flash.
An outside agency performed the coding for the functionality of the tour and assisted in portions of the animation process and close captioning for 508 Compliance.
Sample of module
Tour icon selection page
Results and Takeaways
The Tour was well received, and users commented it was easy to navigate due to the dropdown menus and tour icons.
Because the website was being built at the same time as the animated tour, it was at times a challenge to create the visual scenes, because they were still being edited and reconfigured throughout the build process.
I think it would have been helpful to build a series of page templates that we could use over again, and update easily as the look and feel changed over the life of the project.