The Explorer’s Guide to Biology: Reader Design
For the past two years I have worked on a project for iBiology, a nonprofit devoted to promoting accessible and engaging biology communication through multimedia storytelling. This project, titled The Explorer’s Guide to Biology (also known as XBio), is intended to replace the traditional biology textbook with a free, accessibility focused, open-source online biology learning platform. I have been involved in the design of every aspect of XBio, however, this portfolio piece focuses on one facet: the reader. I began my work with XBio by planning and performing qualitative research with seven educators and seventeen students. The findings from this research, along with human-computer interaction principles and requirements from iBiology, laid the basis for the wireframes I created (pictured here). I used a three-column, drawer-centered design to allow users control over whether they want to view the content navigator/progress indicator (called the “Explorer’s Compass”), annotations, both, or neither while reading. Further, the columns allowed for graceful responsive downsizing to smaller screen sizes, supporting two columns for medium-sized (tablet) screens and one for small (mobile) screens. The wireframes were then used by XBio’s web development partner, TNQ technologies, to create mockups of what they felt they could reasonably develop on iBiology’s timetable (an example of these mockups, which is not my work, is included below for context). I adapted these mockups for mobile and tablet screen sizes to allow for responsive re-sizing (examples of this work is also included below). XBio was launched publicly on October 1st, 2019 at explorebiology.org. I am now working with the XBio team to perform mixed-methods evaluative research for improvements to the site to come in 2020.
Select each image below to enlarge and read a brief description of it.
