Wspinaj.eu

Wspinaj.eu tutorial is an application designed to help users to remember presented  material. Availability through the web site, Windows application, and Adobe Air application platform enables to run the tutorial at the most popular operating systems (Windows, Mac, Linux). 

Attachments included in the application provides access to all materials, even on computers without internet access.

The application enables the use of voiceover, create a text, or create a slideshow and even create dynamic interactive animations, quizzes and mini-games.

To top

Technology

For this application we've written formatting engine which enchanced Flash capabilities of text presentation. For example by default Adobe Flash can only display simple bullet list, but it's not possible to change bullet style or character. Our engine can bullet text with any character or even animated objects, can also automatically make ordered lists. Virtually the biggest problem was embedding images in text. Adobe Air just ignores image tags in text because of "security matters". Because without much more sophisticated text formatting system we couldn't embed images while still maintaining compatibility with both Flash and Air platforms, images are inserted in margin. Page content can consist of many objects, we could break text into parts by hand to simulate text flowing around images. Formatting system automatically calculates margins based on text object images and moves them into margins in the same order as in text.

Flash platform doesn't also support tables. In order to draw them we've developed simple algorithm which places formatted text fields in proper grid (example abve). It supports row and colspans and background colors. Omiting cell colors will automatically make zebra pattern (alternating white and gray rows) for tables with more than 10 rows. Other formatting functions are achieved by standard flash html formatting functions. Cell's width and height is calculated automatically, but we didn't use standard html's way of calculating cell content based on length of text. Instead we are just splitting space available for free-width columns equally. It just looks better and gives more control over table look without need to specify all widths.

Applications allows to use sound files like voice-over. Sound track is split into paragraph-sized chunks and automatically synchronized with text highlighting by use of "sound" attributes inside xml tags in text. This way there is no need to use special synchronization programs, just any sound editor and a list of text inside sound files will suffice. Sounds are downloaded only when they are played, so that application loads faster in online mode. Users which do not need voice over don't have to download unused data. Example of text highlighted during reading:

Application modules

After run application immediately displays the first page of content. If it is a slide - starts a slideshow. If a soundtrack with a voiceover is assigned to the page, will begin playing.
Internet user can go to next / previous page or slide, as well as pause or resume the slide using the navigation bar at the bottom of the screen showing the current page and the navigation buttons at any time. If the text contents does not fit on one side, there is a scroll bar. Title of the page is visible above the content all the time.
The upper part of the application shows a menu with a list of individual sections of the material.