top of page

Teaching Demonstration – Organic Chemistry 

"Interactive 3D models have the potential to greatly enhance the understanding of complex chemical structures. The advantage lies not only in their educational representation but also in their versatility—they can be incorporated into both websites and learning platforms like Moodle. Here you will find a demo that puts this concept into practice.

The interactive 3D models on this page are implemented with HTML5 and the 3Dmol.js library, enabling user-friendly handling on both computers and mobile devices. You can rotate the models by using the left mouse button or your finger on a touchscreen. To zoom, use the mouse wheel or the 'pinch-to-zoom' gesture, and to move the model, use the middle mouse button or three fingers. Additionally, sliders are available that allow you to control specific content, such as progressing along a reaction coordinate. The models are designed to make learning interactive and intuitive.

3D Structures

As examples of 3D structures, alpha (left) and beta (right) glycopyranose are provided

Reaction with energy profile

As an example of a reaction with the depiction of the energy profile, we use the SN2 reaction between ethyl chloride and fluoride. The 'bump' towards the end of the reaction coordinate represents the rotation of the methyl group.


As an example for the representation of molecular orbitals, the HOMO (Highest Occupied Molecular Orbital) of benzene is used here.

bottom of page