SciScroll is an educational website that provides scientific explanations at varying levels of detail through animated scroll stories. It was created to make science accessible to people of all ages and knowledge levels. The creator had the idea after explaining the concept of gravity to their younger cousins using a rock as a prop and mental images. SciScroll allows users to scroll through stories that unlock animations explaining scientific concepts simply through graphics and at the user's own pace. It was programmed to be web-based using HTML, CSS, JavaScript and the JavaScript library Raphael to create the vector animations and ensure cross-browser compatibility.

1. SciScroll
Education for everyone at all levels of interest and knowledge.
“Explain it to me like I’m five;” the age old motto of any being trying to grasp a diffi-
cult concept. SciScroll offers scientific knowledge for everyone at all levels of interest and
knowledge.
The Story:
A hot brooding July, I rested on the porch with my younger cousins reading to them
Ender’s Game. Arriving at the scene where Ender discovers that direction is subjective,
my youngest cousin ask “What’s grav-ee-tee?” I picked up a small rock near me and ex-
plained to her what gravity was. From its discovery to the space-time continuum. In my
head, being expressed through the rock, I unleashed the story of gravity to my younger
siblings. As I explained it, a slide reel portrayed the phenomena of black holes and warp-
ing of space. That night, I programmed a framework that would allow me to create an ani-
mation to show what was in my head. This, became SciScroll.

2. From Theory to Testing:
The idea was to create a scientific journey
that can be taken at any speed. Though
there are many currently available sources
to learning science, none offer what SciS-
croll has.
Speed variability, stunning graphics and
easy accesibility are all features that differ
SciScroll from other media.
Since the concept was like an image scroll-
ing down, the idea for SciScroll was to have
stories that are unlocked as the user scrolls.
To increase accesiblity this application will
be web based meaning it had to be pro-
grammed using HTML, CSS and Javascript.

3. To simplify that aniation process, I decided to use the Javascript library, Raphaël. Raphaël
[‘ræfeɪəl] uses the SVG W3C Recommendation and VML as a base for creating graphics.
This means every graphical object you create is also a DOM object, so you can attach Ja-
vaScript event handlers or modify them later. Raphaël’s goal is to provide an adapter that
will make drawing vector art compatible cross-browser and easy.
Setting up the structure, a structure which then became the standard for ScrollStories, it
was important to count scroll increments.