Master’s Research Project:
The SciStory Laboratory
High-fidelity prototype of scrollytelling learning resource
-
Storytelling is an essential skill for life science undergraduates to learn in order to engage with academic and lay audiences.
However, most students lack formal training in science communication, and the available resources often lack engaging content and clear guidance.
As a result, students find it hard to turn their research into clear, compelling stories and often try to learn this skill on their own without much support.
-
Formal science communication training for undergraduate life science students
-
Storyboarding: Procreate
2D Animation: Adobe After Effects
Asset Creation: Adobe Illustrator
Development: Vev
-
Dr. Jodie Jenkinson (U of T, primary)
Prof. Nicholas Woolridge (U of T, secondary)
Amy Ke Er Zhang (U of T, ad hoc)
Dr. Gael McGill (Harvard Medical School, content advisor)
Dr. Susan Keen (UC Davis, content advisor)
To see my process for this project, please view this website on a desktop!
STAGE 1:
Audience Research
Research insights from literature, mapped on Miro
Background Research
First, I conducted a thorough literature review and media audit to gain a preliminary understanding of scientific storytelling and visual communication education at the undergraduate level.
Key findings:
Undergraduate students do not recieve formal training in storytelling and visual communication skills, leading to an ad hoc approach to learning
Instructors are not given a clear framework from the literature on how to teach these skills
Existing resources lack critical engagement factors and focus mainly on oral storytelling skills
Survey, Focus Groups and Persona Building
To validate this high-level understanding, I surveyed research faculty and current undergraduate students in life science programs, and held focus groups with students who answered my survey.
My goal was to deeply characterize the bright spots and pain points in the learning process for undergraduate students, while also understanding what a successful learning resource looks like for them. I distilled insights into a user persona to guide my design process.
-
Life science students are goal-oriented and are excited by opportunities to learning new skills in favour of professional advancement
Many noted a deep desire to tell stories about their research to excite and educate those with less knowledge on their chosen science topic
-
Students struggle to find time to build science communication skills and meet with research supervisors and mentors to provide feedback and direction on storytelling materials, and turn to self-directed approaches to learning
Students feel they “don’t know where to begin” when preparing their research story and accompanying visuals, and struggle to develop a logical sequence of talking points.
Students find difficulty relating to tips from existing resources, as they feel largely removed from their short-term, student-specific science communication contexts (i.e. thesis presentation, conference posters
Project Goals and Objectives
My background research allowed me to develop a goal and set of project objectives:
Goal
Develop The SciStory Laboratory: a working, high-fidelity prototype of a learning resource that teaches undergraduate science students how to craft engaging visual narratives around their original research to communicate to supervisors and peers.
Objectives
Develop a learning resource that teaches students concrete, tangible steps for developing a visual narrative, guiding them through a relatable, end-to-end process: preparing a scientific poster and oral poster “pitch”
Explore and incorporate user interface designs and features that enhance and maintain user engagement
Quantitative analysis of survey and focus group insights in Dovetail
Survey data from undergraduate life science students and research faculty
Resulting design persona, informed by target audience insights
Brainstorming Key Functions
I decided to explore 3 major features to increase engagement based on the insights gathered.
-
Introduces content (visuals, text) in a piecemeal manner, at a pace controlled by the user’s scrolling behaviour
-
Anchors students to a real-world, tangible research example for each storytelling step
-
Provide students with a space to practice skills introduced in The SciStory Laboratory
Storyboards of scrollytelling learning materials
STAGE 2:
Pre-production
Case Study Development and Copywriting
We decided to focus learning content around 2 aspects of poster presentations - a storytelling context that would be immediately relevant to undergraduate life science students:
Narrative building: developing a logical, engaging sequence of information to present to an audience
Visual communication: bringing the verbal / text-based sequence to life through poster-specific visual communication principles
After, I prepared a master script for The SciStory Laboratory that contained all assets and copywriting that would serve as learning content for students.
Within this script, I developed 3 main case studies. These case studies were modelled after real-world research examples that characterized 3 kinds of research narratives that students could model their research story after. These case studies were informed by Green et al, 2018.
Case studies
Curiosity
Research that aims to understand the underlying reason or mechanism for a natural phenomenon
Website Architecture, Wireframes and Storyboarding
I prepared a website architecture flow diagram to visualize the high-level organization of the website and the specific workflow that students would follow.
Later, I developed wireframes of the user experience and storyboarded scrollytelling animations. These underwent 3 iterations that incorporated feedback from my supervisory committee and referenced audience research.
The SciStory Laboratory Script
Rescue
Research that aims to bettering humanity or the environment through its direct application
Investigation
Research that elucidates part of the mechanism driving a phenomenon, but may not suggest a concrete solution for the root problem.
A flow diagram of the website architecture
Early draft wireframes of The SciStory Laboratory
STAGE 3:
Production
Animation Style Guide
I established a style guide for UI elements and animations to ensure a consistent aesthetic throughout.
Asset Creation and Animation
From sketches on Procreate, I used Adobe Illustrator to create clean vector assets that I later brought into Adobe After effects to animate according to the storyboard.
Printable Companion Workbook
Based on the website’s high-level organization, I developed a printable workbook that students can download from the main menu as an optional learning space for practicing concepts taught on each page.
Website Development
These animation files were then brought into Vev and combined with text animations and interactive elements: a no-code website builder optimized for scrollytelling.
The SciStory Laboratory style guide
Animation asset development from sketch to final animation
Companion workbook designed in Adobe Illustrator
Website development in Vev