VisualR – Recursion Visualizer

VisualR app interface showing recursive function visualization

Tech Talk

VisualR transforms how students learn recursion by animating each step of recursive function execution, making abstract concepts tangible through interactive visualization and adjustable playback.

🧠 Core Learning Features

  • Step-by-Step Visualization: Animated call stack progression for recursive functions
  • Adjustable Playback: Customizable animation speed for different learning paces
  • Example Library: Curated recursive algorithms (factorial, Fibonacci, tree traversals, etc.)
  • Interactive SVG Output: Generated with svg-term-cli for crisp, shareable visuals
  • Code Persistence: Saved user inputs with Jetpack DataStore between sessions
  • Export Capabilities: Save animations as SVG for study materials or presentations
// Sample recursive factorial function
int factorial(int n) {
  if (n <= 1) return 1;
  return n * factorial(n-1);
}

🛠 Technology Implementation

Mobile App

Kotlin + Jetpack Compose

Material Design 3

Android SDK 35

Visualization

SVG-term-cli

Asciinema recordings

WebView rendering

Backend

Node.js + Express

Docker containers

Railway hosting

Data

Jetpack DataStore

Local storage

🎓 Educational Value

Recursive Call Stack Visualization

✨ Unique Aspects

  • Frame-by-Frame Control: Students can pause and examine each recursion level
  • Parameter Highlighting: Visual tracking of changing parameter values
  • Return Value Tracing: Clear visualization of how base cases propagate solutions
  • Educational Design: Interface optimized for computer science pedagogy
  • Shareable Outputs: Export visualizations for homework or study groups
Download APK Watch Demo