~\autoref{fig:onboarding}, and helps users discover the capabilities of \textit{exploRNN}~(V1, Complexity).
\\
\textbf{Textual Explanations.}
In contrast to other learning environments, which show static textual explanations below the main visualization~\cite{smilkov2017direct,kahng2018gan}, we instead provide textual explanations upon interaction (V3, Multiscale).
This way, users can access more information for exactly those components they want to learn more about, while not having to read through a lot of text to find this information.
Our interactively explorable dialog boxes integrate seamlessly with our proposed visualizations, and provide information about all important elements of the learning environment.
An example for these dialogs can be seen in~\autoref{fig:explanation}.
Such dialogs exist for all headings, and are anchored through an information icon.
Additionally, the components of an LSTM cell which are shown in the cell view, also each provide such explanations, as is alluded to in our onboarding process.

\begin{figure}[t]
  \centering
  \includegraphics[width=0.8\linewidth]{onboarding}
  \caption{
  Onboarding dialogs like this are shown when a user first launches \textit{exploRNN}. They guide the user through the visualizations, so that no manual introduction is needed, and users can explore \textit{exploRNN}~on their own. Onboarding dialogs are tightly integrated into our visualizations, and use arrows to show users what is currently described.
  }
  \label{fig:onboarding}
\end{figure}

\begin{figure}[b]
  \centering
  \includegraphics[width=\linewidth]{detail_explanation}
  \caption{Upon selecting components in our visualizations, we show detailed explanations.
  These explanation boxes are overlaid on the visualization and explain aspects of the visualization in detail.
  They are available for many items in our visualization, such as training steps, hyper-parameters, and operations in a cell.
  }
  \label{fig:explanation}
\end{figure}

\subsection{Network Interaction}

In the following, we are going to explain the interaction design for the network overview.
For this, we will go over all the visualization components, whereas we use the letters A through F, as shown in~\autoref{fig:networkview}, to indicate which component we currently discuss.
\\
\textbf{A: Input.}
we follow the concept of simplistic data and present visualizations of the functions and text samples that we proposed in~\autoref{sec:data}.
To experiment with the network, users can change the input data that is used for training the network here (V1, Complexity).
This can help them understand what kind of data a RNN can process.
\\
\textbf{B: Network.}
Importantly, users can also investigate how the training progresses differently depending on the number of recurrent layers in the network.
To help users explore this, they can add or remove layers from the network to be trained by simply interacting with the network visualization as shown in~\autoref{fig:add_remove}.
Changing the network architecture automatically resets the training process, so that users can train this new network from scratch.
\begin{figure}[b]
    \centering
    \setlength{\fboxsep}{0pt}\fbox{\includegraphics[height=1.9cm]{add_layer}}
    \hfill
    \setlength{\fboxsep}{0pt}\fbox{\includegraphics[height=1.9cm]{remove_layer}}
    \caption{\label{fig:add_remove}
      left: Adding a layer between two existing layers.
      When the user hovers over the connection between two layers, a button to add another layer appears.
      right: Removing a layer from the network.
      Hovering over a layer in the network will show a button to remove that layer.
      Whenever the layers in the network are changed, training is reset to be directly started with for the new network architecture.
    }
\end{figure}
\\
\textbf{C: Predictions.}
Commencing the top row of visualizations to the right, is the output plot, where we visualize the prediction of the network for an evaluation sample alongside its ground truth.
Based on this prediction, we then visualize the error by calculating the difference between the prediction and the ground truth value.
This animated component, while not being interactive itself, marks an important feature of our environment, with which the results of interactions that have been made in other places can be inspected (V2, Dynamics).
\\
\textbf{D: Process.}
We split the training process into three visually distinct steps: prediction, validation, and training.
The explanation pane in the lower left of the network overview (see~\autoref{fig:networkview}) both, displays, which step is currently executed, and provides an explanation for what happens in each of these steps.
Through this, the user can learn more about the training dynamics of the network.
\\
\textbf{E: Controls.}
In the network overview, the network is trained by means of epochs, which follows the "big-picture" approach of this visualization (V3, Multiscale).
To experiment with this training process, users can interact with the control area in the bottom center of our environment.
Apart from automatically advancing epochs, which can be done with the play button, users can also trigger the training of the network for a single epoch, by pressing the forward button, which gives users even more control over the training process (V2, Dynamics).
The training process can additionally always be reset, using the rewind button.
\\
\textbf{F: Training Parameters.}
Experimenting with parameters for the training process is further supported by means to manipulate the learning rate and the batch size for the optimization, as these are critical as well as accessible parameters of the optimization process (V1, Complexity).
Additionally, to make the training data more realistic, users can add noise to the input of the network, which more closely resembles real-world scenarios of imperfect measurements (V1, Complexity).
These parameter changes can be made through sliders, which are positioned on the bottom right.

Following Shneiderman's mantra~\cite{shneiderman1996eyes}, the user can then, after getting an overview of the network, inspect individual LSTM cells in detail by selecting one of the layers in the network view to dive into the cell view (V3, Multiscale).

\subsection{LSTM Cell Interaction}

This subsection will cover the interaction design for the cell view.
Again, we will go over all the visualization components, whereas we use the letters A through E, as shown in~\autoref{fig:celltraining}, to indicate which component we currently discuss
\\
\textbf{A: Cell architecture.}
To convey the functionality of one recurrent unit, we visualize how the cell input is fetched from the previous layer, and then gets processed by the compute functions within the recurrent cell (V2, Dynamics; V3, Multiscale).
The components within this cell visualization, as well as the connections between them, are highlighted when activated, in order to provide feedback on the interactive training process (V2, Dynamics).
More explanation, and equations for the computations within these cell components can be obtained by selecting one of the components within the cell visualization, providing more information only where needed (V1, Complexity; V3, Multiscale).
\\
\textbf{B: Data Plot.}
To the right of the cell visualization, we present the input data, network prediction, and ground truth all in one graph, disentangled from the cell visualization.
As this cell typically receives data from previous cells, and outputs data to subsequent cells, we do not visualize the input to the left, and the output to the right of the cell, as we do in the network overview.
By clearly separating the training data and predictions from the cell visualization, and embedding the cell between pictograms of surrounding cells, we are able to convey that the cell is not immediately receiving the input data, or directly making predictions (V2, Dynamics).
Users can inspect this view during the interactively controlled training to see how the network processes input data to make predictions and calculate the training loss in relation to the processing steps within a cell (V2, Dynamics).
\\
\textbf{C: Training Process.}
The three steps of predicting, validating the prediction, and training the network are just as relevant in the cell view as they are in the network overview.
However, here, they can also be directly jumped to, allowing the user to skip part of the data processing within a cell, and go directly to the processing step of interest (V2, Dynamics).
This is only needed in the cell view, as one epoch is taking much longer here because we advance by compute steps rather than epochs (V3, Multiscale).
For the forward pass, we additionally add explanations for the different processing steps of \textit{receiving the layer input}, \textit{calculating the gate activations}, \textit{updating the cell state}, and \textit{outputting the activation value} (V2, Dynamics).
Users can use these explanations to visually map these recurring processing steps during the forward pass to the