The question I set to answer is "Why is Signal Averaging So Important in Electrophysiology?".
I wanted to answer this question using an interactive visualization since it makes the answer visually intuitive by allowing users to directly manipulate the number of trials included in the averaged waveform. Viewers can clearly observe how increasing the number of trials progressively enhances the visibility of the small amplitude response (relative to the noise of a single trial). I believe this effectively demonstrates why large numbers of trial counts in this type of research is essential.
The main interactive feature of this visualization is the slider. The slider allows the user to change the number of individual trials (i.e., a single brain response to a single sound presentation) that is included in the final averaged waveform----which gets plotted onto the "Averaged Response Waveform" line graph.
When designing the slider, I found that the default linear scaling of the slider made it difficult and onerous to go through the whole range of values (0 to 2397 trials). Thus, in my MATLAB analysis code that generated the dataset used in this visualization, I created a vector of averaging intervals that increased in a sigmoidal fashion (which the slider then uses). Using a sigmoid function allows for greater slider resolution at the lowest and highest numbers of included trials, and least amount of resolution at the middle values.
This rate of change in slider values feels more natural to use and efficient. The user can familiarize themselves with the figure by having greater slider space at the beginning to see how noisy the signal is at the first few trials and then at the end of the slider to spend time looking at how peaky the waveform is. The sigmoidal function reduces the amount of slider space dedicated to the middle averaging interval values, which is ideal since I want to dedicate the most slider space to the lowest and highest values of averaging intervals.
Another interactive feature of the visualization is the radio button set that allows the user to select between which weighting scheme data to show on both figures. This feature allows the user to choose for themselves to represent one type of data or to include both datasets on the figure.
I made sure to dynamically change legend labels for both figures so that even when radio button options are changed, only legend information presently on the figure gets included.
I deliberately show the line traces in the "Averaged Response Waveform" going beyond the figure bounds to emphasize how much larger noise from individual trial is from the response, which is revealed when the user slides the slider to the right.
I initially plot both weighted and unweighted data at the same time on the figure so the user can see the difference between these two datasets depending on how many trials are included in the average. If the user wants to only show one dataset at a time, they can use the radio buttons under "Weighting Scheme".
The slider will also interact with the "Individual Trial Amplitudes" scatter plot. This figure will update with colored markers and the number of markers included on the figure correspond to the slider value. Each single marker represents a single trial.
I chose to color the markers using a sequential green-yellow-red color scheme to indicate how each individual trial has been down weighted. Warmer colors indicate that the trial has been down weighted more. This coloring makes intuitive sense to me as warmer colors, and especially red, are more eye catching compared to green---which is what I want since I want to highlight the trials that have been most affected by the weighting.
I included the full set of markers and greyed them out as a background to the scatterplot to visually show, relative to the whole set of trials present in this dataset, how many of the markers you are currently including when you adjust the slider. This is a way to use proportion/length to effectively convey this point.
Although I initially used filled markers for the scatter plot, I decided to use unfilled markers because even using the unfilled markers, you see a solid block of markers in the figure. This feature further emphasizes how many trials need to be included to see the peak in the waveform.
I added figure text annotations to both the line graph and scatterplot to call attention to notable features of the dataset. Since the slider will change the content of these figures dynamically, I also dynamically show these annotations based on what value the slider is at and if the feature I am annotating is presently on the figure.
To facilitate visibility of the text annotations in the Averaged Response Waveform figure, I added a white background to the text annotations. With this background, the text is still visible even when it overlaps with the line traces in the figure.
Further, across the two figures, I included tooltips to allow the viewer to access more detailed information about the figure, but only when the user decides to.
I added a description about weighting, a type of data transformation used in this dataset. This description is meant to provide further background to the viewer so they can understand why there is a "Weighting Scheme" radio button control feature to the page and how helpful weighting is in determining the neural response. I also felt it was appropriate to include the LaTeX formatted equation that was used to better convey how the trials were weighted.
All data shown in this visualization comes from my current research experiment. No outside datasets were used. Since I have little to no experience coding in Python/HTML/Javascript, but still wanted to use tools like D3, I utilized generative AI to help me generate and debug code needed to carry out my vision.
I came up with the concept and made all of the design choices used in this assignment.
As I am the only member of this team, I did all the work for this assignment.
This assignment took me well over 20 hours to develop. I have had the idea about using an interactive visualization to demonstrate the power of signal averaging in my head since the beginning of the quarter. What took the most time however is learning the basics and the differences in use cases between Python, HTML, D3, Javascript, JSON etc. Prior to this course, I only coded in MATLAB. But through this assignment, I have now created a data analysis pipeline that includes all of these different tools! A lot of time was also spent debugging the code, figuring out why some features of the html were rendering objects in unintended places etc.