Let's Get Back Up to Date: Zig Zag Alkane drawing tool, Reaction Simulator Mode, Reimagination of Home Page, Updated Tutorials, Display Fixes, Target Aid

Release 4.5.0

It has been a hot minute! So what has been happening in the world of Molecular Pathway Generator since our OChemdle tournament in 2022? Mainly, updates to our interface. The overarching hope has been to provide our users with a more intuitive, enjoyable, and informative experience. 

Much of the renewed impetus for improving the site was actually due to inspiration from having our first intern involved in the project; a brilliant pre-medicine student currently at M.I.T. who reached out expressing interest in contributing to the project while working through her Organic Chemistry coursework! 

And on with the updates. To begin, a zig-zag alkane drawing feature has been added to the molecule design tool. This addition was designed to allow a more robust experience while creating a straight chained alkane or adding one to an existing molecule. Previously, an alkane chain could be created or added to a molecule ONLY by selecting one of the pre-defined length alkanes and then clicking in the workspace or dragging the alkane to the workspace. With the new feature, the user can ALSO click to begin drawing an alkane segment, drag to expand or contract the length of the alkane segment, and when the desired length of the segment is reached release the click. The alkane segment length will update in real time in response to the drag.

Next, the Reaction Simulator feature, that was previously present only in the Reactions section, has been brought to also feature more prominently on both the Home page and the Molecules section. This feature allows the user to predict the outcome of applying one of the supported reactions to a given molecule. 

While in the Molecules section, the user can alternate between the "Pathway Solve" and the "Reaction" modes. The transition between the two modes was designed to be seamless, so the user can, for example, search for a pathway from one molecule to another molecule that was predicted as part of the Reaction Simulator. Transition between the two modes is performed in the Molecules Section simply by clicking the button that contains the text "Pathway Solve" or "Reaction Mode". 

The user can also switch between using the controls in Reaction Simulator mode and Pathway Solver mode while on the Home Page. 

More generally, the Home Page was reimagined as a showcase of five of the major features of the site: 

1. The IUPAC Name Generator
2. View Molecule by IUPAC Name
3. Reaction Simulator
4. Pathway Solver
5. Metabolic Pathway Viewer.

The goal of the redesign is to showcase the power of the site more immediately to the new user with more interactive, lighter versions of the full fledged tools. Concretely, the first four features of the new home page were implemented using three components: one or two instances of the molecule design tool and a controls section. The controls section is specific to each feature. 

The molecule design tool featured in the Home Page is from an engineering and interface standpoint the same exact tool as featured in the Molecules section, but with some styling reworked and some features (such as the toggle between using stereochemistry) omitted. This approach was taken to follow the DRY (do not repeat yourself) principle and also allow for future possibilities of appropriating the tool on the site or externally. For the user, this means that any updates to the molecule design tool will affect both instances.

Links were added below the new section of the Home Page to allow exploring each of the features in more depth.

Updating the tutorials with the new interface updates was pretty straightforward. Care was taken to make the tutorials work properly with the new versions of the features on the Home Page. 

Some minor display fixes were made. Specifically, to prevent atoms in side chains from being positioned over other atoms when viewing the molecule. This was previously noticeable in the molecule acetaminophen but since has been resolved.

Finally, a target aid indicator was added to the molecule design tool. This simply displays a small light blue sphere when the user's pointer is over either an atom or a bond. This indicator should improve the experience of designing a molecule by giving the user feedback of the pointer position.

Standards: As this update was exclusively an interface level update, no additional standards were needed to be followed.

Controls: 

1. The Home Page now allows the user to select a link from the sub navigation menu to access a panel representing one of the five major features of the site. Tutorials explain each section.
2. While in the Molecules section, the user can click the Reaction Mode/Pathway Solve button to toggle between the two calculator modalities.
3. The Reaction Simulator mode can now be performed in both the Home Page and the Molecules section as follows: i) Design a molecule or create a molecue by entering the molecule name in the Reactant section. ii) Select a reaction to perform on the reaction via the Select Reaction tool. iii) View the predicted product in the Product section.
4. The zig-zag alkane drawing tool can be used as follows: i) Click on the wand/Bond Creator icon to select the tool. ii) Click on either an existing atom or a blank section in the workspace and hold to begin the drag. iii) Drag the pointer to extend or shorten the length of the desired alkane addition. iv) Release the click and the new alkane will be added to the workspace.
5. When the user's pointer is over a bond or an atom in the current workspace molecule, a light blue sphere will display as an indicator.

Future Considerations: Should any other features of the site be prominently displayed in the home page? Should the information blurbs be updated? Concerning the zig-zag alkane drawing tool, it might make sense to also introduce a sub-feature where the user can select the end of the drag to be another atom in the molecule and automatically create an appropriately lengthed connection. Are there any other helpful feedback indicators that can be added to the interface?