June 1-4

  • Explored existing network/graph-based visualizations to form general grasp of ideas
  • Read into Processing documentation to learn programming structure
  • Created basic draggable node setup in Processing to apply and familiarize with the language
  • Began write-up for overall project description
  • Utilized WireShark to begin exploration of network activity and learn about the data which will be presented by visualization project

June 5

  • Finished project summary
  • Read into Dshell documentation
  • Independently continued exploration of Processing

June 8-12

  • Set up Ubuntu VM for Dshell
  • Created simple animations in Processing to simulate data transfer between nodes

June 15-16

  • Explored Processing libraries to determine further resources that can be used

June 17

  • Reviewed command line functions, general shell commands
  • Read into Vim usage/basics

June 18

  • Viewed Dshell tutorials to understand framework
  • Outlined final project structure and requirements for both front and back-end development
  • Ran basic Python and command-line scripts to read and extract data from TCP dumps

June 19

  • Looked through D3 models for design concepts
  • Drafted overall application expectations, model
  • Began creation of drafted model

June 22

  • Added basic timer/clock functionality
  • Constructed simple Connection and Packet classes
  • Moved nodes, connections, and packets into arrays for automation and organization
  • Implemented simple play/pause functionality with basic timeline slider

June 24

  • Implemented import of JSON for visualization data
  • Fixed pausing and replaying issues with timeline
  • Added basic selection functionality on nodes and info display

June 25

  • Combined JSON import into one file, nodes and connections constructed purely from packet data

June 26

  • Expanded window and worked on UI elements
  • Working on timeline to create better clock visualization

June 29

  • Continued construction of UI and custom user interaction

June 30

  • Basic annotation functionality
  • Added node bounds
  • Tested 4 second TCP Dump data for preview

July 1

  • Changed UI appearance and general functionality
  • Fixed timing issues with playback and speed control
  • Added window resizability

July 2

  • Work on annotation timing, functionality, editing

July 6

  • Discussed methods on portraying accurate packet travel
  • Discussed node organization and port display

July 8

  • Began implementation of flexible time scale
  • Experimented with different port structures and layouts

July 9-10

  • Studied Dshell Module construction documentation
  • Continued work on port illustration
  • Continued work on graph structures
  • July 13-15

  • Work on implementation of force-directed graph for self-produced layouts
  • Work on smoothing timeline to avoid issues at small increments
  • July 16-17

  • Continued work on force direction and graph organization
  • July 20 - 24

  • Restructured code, working from beginning to change overall model from packet focus to flow focus
  • Finished basic operational force-direction model that adjusts to nodes
  • Incorporated basic animations into visualization for nodes appearing and disappearing as well as connections
  • Incorporated adaptive nodes which appear and disappear based on presence in network
  • Changed visualization from timeline state-based to data-based with data being based on location in timeline to ensure smooth animations and non-conflicting adjustments in speed
  • July 28

  • Reincorporated data import and adapted new use of node activity to self-generate based on packet data