Bioonim

Inspiration

Bioonim is an innovative educational platform designed to revolutionize the way students engage with the biological sciences. Rooted in the principle of making learning both accessible and engaging, Bioonim employs a unique approach by utilizing interactive animations to elucidate complex concepts in Biology, Pharmacology, Biochemistry, Pathology, and related disciplines.

What it does

Drawing inspiration from the success of Duolingo in making language learning fun and interactive, Bioonim applies a similar methodology to the sciences. This approach not only demystifies challenging subjects but also makes learning more memorable and efficient. By watching and interacting with carefully crafted animations, students can visualize biological processes in real-time, fostering a deeper understanding of the subject matter.

Bioonim's interactive platform integrates a dynamic drag-and-drop feature, specifically designed to enhance the learning experience for students delving into the complexities of biological structures. This hands-on approach allows learners to actively engage with the material by manipulating elements directly within the animations.

It encourages students to learn through doing, an approach proven to improve retention and understanding. By physically moving components into their correct positions or sequences, learners gain a more concrete grasp of biological structures, from molecular configurations to anatomical arrangements.

When students observe and engage with collisions between biological structures, such as molecules, cells, or anatomical parts, they gain insights into the fundamental principles of biological functions and processes. For example, in a module exploring enzyme-substrate interactions, students can see firsthand how the shape and orientation of a molecule affect its ability to bind with an enzyme. This visual and interactive representation helps demystify the concept of "lock and key" fit in biochemistry, making it more tangible and easier to grasp.

How we built it

In the development of our interactive educational platform, we've leveraged the robust capabilities of Flutter and Dart, enriched by the dynamic animation features of Lottie and the flexibility of the Flame engine. To enhance user engagement and learning efficacy, we've undertaken a customization of Lottie animations, enabling them to not just illustrate biological concepts but also to be interactive. This innovation allows students to actively participate with the animations through actions like drag-and-drop, making complex biological processes more tangible and comprehensible. By integrating these technologies, we've created a seamless, interactive learning environment that brings the intricacies of biology to life, encouraging deeper understanding through direct engagement and exploration.

Challenges we ran into

Throughout the development process of our educational platform, we encountered several challenges, one of the most significant being the integration of vector-based animations in the form of Lottie JSON files and making them interactive. Achieving this level of interactivity required a deep dive into the Lottie library to understand and modify how animations are rendered and controlled. Our goal was to enable these animations to react to user interactions in real-time, such as touch gestures or mouse clicks, thereby transforming static visuals into dynamic, engaging educational tools. This necessitated not only an extensive exploration of the Lottie library's internals but also creative problem-solving to bridge the gap between passive animation playback and interactive learning experiences. By customizing the Lottie library, we were able to unlock new possibilities for interactive education, allowing students to actively engage with complex concepts through intuitive and responsive animations.

Accomplishments that we're proud of

Among the accomplishments in the development of our interactive educational platform, there are several key achievements that stand out, marking milestones in our journey:

• Interactive Vector-Based Animations
• Customization of the Lottie Library
• Seamless Integration with Flutter and Flame Engine
• Enhanced Learning Through Gamification

What's next for Bioonim

Looking ahead, Bioonim is set to embark on an exciting journey of enhancements aimed at elevating the educational experience to new heights. A key focus of our upcoming updates is the integration of physics into our Lottie animations, utilizing the capabilities of Forge2D physics. This will transform vector shapes into dynamic physics-based renderings that not only respond to forces and interactions but also bring a new level of interactivity and immersion to the learning environment. By simulating real-world physics, our animations will allow users to explore biological concepts in a more engaging and hands-on manner, enriching their understanding and enjoyment.

In parallel, we are committed to refining the visual fluidity and realism of our animations through advanced shape and transform interpolation techniques. These improvements aim to ensure that Lottie animations are not just educational tools but also works of art that captivate and inspire. By making the animations smoother and more continuous, we will enhance the overall user experience, making learning not just informative but also aesthetically pleasing.

Built With

• after-effects
• dart
• figma
• flame
• flutter
• forge2d
• lottie