skills.rest
sandeco
sandecoCOMMUNITY
Explore all skills by this author →
Website𝕏@sandecoGitHub

reversa-arquitetura-3d

Generate standalone Three.js HTML visualizing software architecture from module and dependency JSON.

1.5k|383|Updated Apr 26, 2026
Search Tags:#software architecture#three.js#dependency graph#3d visualization#interactive html#legacy reverse engineering#operational specifications
One-click install
npx skills add https://github.com/sandeco/reversa --skill reversa-arquitetura-3d-sandeco
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: reversa-arquitetura-3d
Source: https://github.com/sandeco/reversa/tree/main/agents/reversa-arquitetura-3d
Command: npx skills add https://github.com/sandeco/reversa --skill reversa-arquitetura-3d-sandeco

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Converts legacy project structure and dependency information into interactive 3D architecture views that AI agents and teams can inspect without relying on unreadable or missing documentation.

Core Features & Use Cases

  • Interactive standalone 3D HTML: Generates a complete single-file HTML visualization with navigable camera controls and a right-side parameter sidebar.
  • Five architecture visualization modes: Code City, Dependency Graph 3D, Layer Stack 3D, Call Graph 3D, and Architecture Tour overlays for guided walkthroughs.
  • Data-driven inputs: Accepts modules and dependency/call-graph JSON (including LOC, complexity, folder, and edge weights) and renders them consistently into a structured 3D scene.
  • Performance-focused rendering: Uses Three.js local assets (offline-first within the docs workflow) and instancing strategies for large datasets, with quality fallbacks and error messaging.

Quick Start

Use the reversa-arquitetura-3d skill to generate an offline-capable standalone HTML showing your project's architecture in 3D from your modules.json and deps.json inputs.

Frequently Asked Questions about reversa-arquitetura-3d

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I visualize software architecture in 3D from JSON data?▼

To visualize software architecture in 3D from JSON data, use a tool to generate interactive Three.js standalone HTML from module and dependency or call-graph JSON inputs. It renders interactive 3D scenes with navigable camera controls and a parameter sidebar.

What types of 3D architecture visualization modes are available for legacy reverse engineering?▼

Available 3D architecture visualization modes for legacy reverse engineering include Code City, Dependency Graph 3D, Layer Stack 3D, Call Graph 3D, and Architecture Tour overlays with guided camera motion walkthroughs.

How do I generate an offline interactive HTML visualization of a dependency graph?▼

To generate an offline interactive HTML visualization of a dependency graph, render a single-file HTML with embedded inline data and local Three.js assets. This ensures offline-first usage without relying on local fetch requests.

Does Three.js 3D architecture visualization support large dataset performance guardrails?▼

Yes, Three.js 3D architecture visualization supports large dataset performance guardrails by applying instancing strategies and quality fallbacks. It includes robust pt-BR error handling for rendering large module and dependency datasets.

Can I use folder structure and code complexity metrics in a Code City visualization?▼

Yes, you can use folder structure and code complexity metrics in a Code City visualization. The rendering accepts data-driven JSON inputs including lines of code, complexity metrics, folder structures, and edge weights to map software architecture.

What is the best way to create a guided walkthrough of a software call graph?▼

The best way to create a guided walkthrough of a software call graph is to generate an Architecture Tour overlay. This applies guided camera motion to navigate the 3D call graph scene interactively within a standalone HTML file.

Related Skills

Explore More Software Engineering Skills→
manuelbrandner85manuelbrandner85

diagramming-code

Generate Mermaid diagrams from Trailmark code graphs.

Community
Intermediate
silaslopes100silaslopes100

reversa-arquitetura-3d

Generate interactive 3D software architecture visualizations from JSON module and dependency data.

Community
Advanced
afsjrafsjr

reversa-arquitetura-3d

Generate standalone HTML 3D architecture visualizations from module and dependency JSON data.

Community
Advanced
daffy0208daffy0208
34

3d-visualizer

Create interactive Three.js and React Three Fiber 3D visualizations with lighting and camera controls.

Community
Intermediate