ZIM - mobile and e-learning apps with ZIMjs components for JavaScript and HTML Canvas with CreateJS


Dr. Abstract explains and defines UI UX user interface and user experience for the HTML Canvas with JavaScript, CreateJS and ZIMjs interactive media framework All types of Desktop and Mobile apps can be made with ZIM as seen in the other sections. Now we explore e-learning applications - press the MORE button to learn more ;-).

Simulations

Simulations are a hallmark of Object Oriented Programming (OOP). Indeed, if we are modeling life with code, then it makes sense to learn from our models. In doing so, we can have a safe and controlled environment such as:
  • Factory production
  • Physics environments
  • Psychological tests
  • Multiuser avatars
  • Functionality for kids
  • Skill Simulators
  • Biological overlays
  • Charts and Diagrams
  • Interactive Stories
  • Gamification
  • Product Prototypes
The list goes on and on. ZIM, CreateJS and the JavaScript programming language help us model life by providing the following:
  • Components such as buttons, sliders and dials
  • Controls such as parallax, VR and particle emitters
  • Random and Pick functions to emulate emotion and chaos
  • Conditionals for logic and expert systems
  • Variables, arrays and dictionaries for memory
  • Events, intervals and tickers for time
  • Loops that act like a factory
  • Classes and objects (nouns) made from classes
  • Object methods (verbs) and properties (adjectives)
  • Containers to organize objects
  • And a stage for all this to be seen!

KIDS

Much of our learning comes at an early age (not all, hopefully). The big, colorful and simple ZIM style seems to suit kids. The canvas is very visual and the ZIM examples tend to be universal, peaceful, playful. This has led Stacey Reiman to conclude:
"ZIM is the most awesome library for making kids apps in JS that EXISTS!!! Thank you!!!" - Stacey Reiman
Kids apps are generally more simple to make and ZIM is a great environment for learning to code. So kids apps are a win/win at ZIM! A great place to start for some ideas is ZIM Bits

Industry

Of course e-learning is not just for kids. In Sweden, part-makers for Volvo are using ZIM to explain factory procedures for which ZIM provided the Layer class. Dutch Artist, Frank Los, uses ZIM to make complex subjects clear and accessible. Labosims, in France, creates apps for learning science. ZIM tools for industry:
  • Components like sliders, dials, pickers, accordions - see UI UX
  • Optional screen-reader Accessibility on components
  • Single line animation, drag and drop, gesture and transforms
  • Bezier handles for paths and dragging and animating on paths
  • Parallax, damping and proportion tools for an organic feel
  • Integrated dynamic sprite and scrolling backgrounds
  • Particle emitters, generative art pens and VR
  • Sound frequency tools and noise equations
  • MotionController for mouse, keyboard and gamepad
  • Page control and responsive Layout and Tile classes
  • Grids and guides for visual placement - also place method
  • Full documentation, tutorials and TypeScript
  • ZIM Distill to minify only code used the app
Attention to detail and support is a passion at ZIM:
"ZIM is the very best place to go for educators transitioning from Flash to Canvas. Incredible library, excellent documentation! Loving your work! The orient to path squiggle is just brilliant. Thanks for continually improving Zim. Superb! - James Barrett, ICT Educational Games

Testimonial


MORE
Here are examples of apps for learning!
open links in new tab

ZIM E-Learning Quiz example
ZIM: E-learning Quiz Example - here is a ZIP of the App

echalk - curriculum-aligned activities, games, simulations and puzzles are all created with a focus on learning through fun
eChalk Doppler Shift, RadioActive Decay, Moon Phases, Nuclear Equations

E-learning JS Puzzle
a JS Definitions Puzzle and a ZIM Definitions Puzzle

Shake and Spill Game
Shake and Spill Math Game for K2 Students

Labosims: Vibrating Cord E-Learning App by Samuel Jacquinet
Labosims: Vibrating Cord E-Learning App by Samuel Jacquinet

Labosims: Sound Propagation E-Learning App by Samuel Jacquinet
Labosims: Sound Propagation E-Learning App by Samuel Jacquinet

Labosims: Star Colors E-Learning App by Samuel Jacquinet
Labosims: Star Colors E-Learning App by Samuel Jacquinet

New York Hall of Science - e-learning Apps - Digital Comic Book
Transmissions Gone Viral: NYSCI Digital Interactive Comic

Mathies Game to match Numbers in different Math Systems
Transmissions Gone Viral: NYSCI Math Matching Game from Mathies Games

Recalling a Diagram E-learning App Multiuser Drag and Drop
Recalling a Diagram E-learning App Multiuser Drag and Drop

Organizing E-learning App Multiuser Drag and Drop
Organizing E-learning App Multiuser Drag and Drop

Funky Mummy Kids App by ICT Games
Funky Mummy Kids App by ICT Games

ICT Games Educational Games for Math and Literacy
ICT Games Educational Games for Math and Literacy

Custom Car Garage Kids App by ICT Games
Custom Car Garage Kids App by ICT Games

Clock and Ranges Kids Apps by ICT Games
Clock and Ranges Kids Apps by ICT Games

E-learning Example from Twitter discussion
E-learning Example from Twitter discussion

Learning Arrays and Loops with color and number toggle
Learning Arrays and Loops with color and number toggle

Animation Demonstration with related code
Animation Demonstration with related code

Labosims: Prism E-Learning App by Samuel Jacquinet
Labosims: Prism E-Learning App by Samuel Jacquinet

Labosims: Overlay Colors E-Learning App by Samuel Jacquinet
Labosims: Overlay Colors E-Learning App by Samuel Jacquinet

Labosims: Refraction and Reflection E-Learning App by Samuel Jacquinet
Labosims: Refraction and Reflection E-Learning App by Samuel Jacquinet

Labosims: Simple Pendulum E-Learning App by Samuel Jacquinet
Labosims: Simple Pendulum E-Learning App by Samuel Jacquinet

Labosims: Ball in Fluids E-Learning App by Samuel Jacquinet
Labosims: Ball in Fluids E-Learning App by Samuel Jacquinet