UI design

Some of the time during last week I've dedicated to the DTW related research and UI design: I was thinking about laying out the workspace for the DTW analysis since after all it suppose to be somehow interactive and iterative. It's very important that UI must be responsive and keep user focused on the analysis aspects. By following the UI-First Software Development principle I've spend about 10-20 minutes just drawing the draft of UI laying out information blocks and parameters at the left screen "control panel".
.
The function which is underlying under UI design is pretty simple, and I outlined three major steps on my drawing:

1. User sees the input time-series statistics and two accompanying plots: one for the raw timeseries data with gaps and non-normalized peaks representing the data collected from the sensors and second one, with normalized series and gaps filled accordingly to the telemetry type.


2. Based on the provided information and visualization user selects specific DTW options and actually fires the timeseries alignment action.


3. Once trajectories aligned, the third plot showing aligned warped timeseries and alignment statistics updated. After evaluating analysis results user makes a decision to alter parameters and run alignment again or just accepts the alignment results.

Currently I'm altering the Wicket application code, HTMLs and CSS styles to implement the UI.