Chem21Draw

Drawing organic molecules is essential in GOB, Organic, and Biochemistry courses. Chem21Draw is an embedded drawing canvas within Chem21Labs homework and lab reports, allowing students to create molecular structures directly on the webpage.

Built with HTML5 and JavaScript, it runs on any operating system without plugins. While widely accessible, it is currently not touch-enabled for click/drag interactions. Its drawing and feedback features are described below.

1. Single Answer - students draw a single structure on the Chem21Draw canvas and submit their answer. Sample questions include:
   • Draw cis-1-tert-butyl-2-isobutylcyclobutane.
   • Draw the least stable alkene isomer of C₆H₁₂.
   • Draw a meso compound with the formula C₈H₁₈.
   • Draw the structure of the C₂H₃Cl₃ isomer that shows a single absorption in the ¹H NMR.
   • Cyclohexene reacts with HBr, then Mg, followed by CO₂ and H⁺ . . . . draw the final product.
   
   
2. Multiple Answers (unordered) - Students draw multiple structures on the Chem21Draw canvas and submit their answers.
   • Draw the two Intermediates of the following reaction . . . .

     Cyclopropanone   H⁺ / H₂O
     
       Cyclopropane-1,1-diol

   • 
     Draw the four constitutional isomers for C₂H₅N.
     
     
   • Draw the three additional resonance structures for the cation to the right.
     
3. 
   Multiple Answers (ordered) - Students draw the product structure after each step of an organic synthesis. To be graded as correct, the structure must have at least one atom within the reaction arrow's gray box. The Reagents can be placed above, below, or beside the reaction arrow, which can point in any direction - resonance arrows are also supported.
   
   Benzene reacts with the following reagents in the order shown.
   1. CH₃Cl / AlCl₃
   2. HNO₃ / H₂SO₄
   3. Cl₂ / FeCl₃
   4. KMnO₄ / H₂O then H₃O⁺
   
   
4. Feedback - correct answers are highlighted with green circles, while incorrect answers show red circles. Hovering over a red circle provides targeted feedback to guide students. Both circles and structures can be repositioned using the move icon. If a structure is correct but misplaced, it appears with green bonds and atoms but with a red overlay, indicating it must be moved to the correct location.
   
   
   
   
5. 
   Synthesis - Students typically learn ~140 Organic Reactions, but only a subset is used in any given synthesis problem. In these problems, students enter the reaction number for each step and draw any organic reagents below the reaction arrow. The system then grades both the reagents and products at each step.
   
   
   
   
   
6. 
   Mechanism Arrows - students draw mechanism arrows to show electron flow in reactions. These arrows are created as Bézier curves, allowing precise shaping of curved arrows. The system provides targeted feedback, including the expected number of arrows and whether each arrow starts and ends at the correct atoms.
   
   
7. 

   Drawing with Chem21Draw - follow these steps to draw the molecule below:

   • Select the cyclohexane ring tool and click/drag on the canvas to set its orientation.
   • Choose the bond tool, click a ring carbon, and drag to add a CH₃ group. Repeat to extend to a second CH₃.
   • Select oxygen, click the terminal carbon, and drag to add the O atom.
   • Select carbon, click the oxygen, and drag to add a methyl group (forming a methyl ether).
   • Use the wedged bond tool to add a CH₃ group to the ring carbon.
   • Select chlorine with the dashed bond tool, then click and drag from the carbon to add Cl.
   • Feel free to explore the other tools, especially the mechanism arrows.
     For more details, click Chem21Draw Tool Descriptions.
   
   

Chem21Draw