This project was inspired by the need to create an improved diagram language that can intelligently create diagrams, making projects easier to understand and execute.

What it does

It visualizes the class structures of java github repositories.

How I built it

A restful node backend retrieves github repositories, parses them and provides endpoints for accessing class and member information. The frontend is written in angular 4 and designed in sketch, a professional UI design tool. We spent ten hours figuring out how to automate graphics and logos. Every detail was created from scratch.

Challenges I ran into

It was difficult to create an arrow linking any two points on the screen. It was also difficult to graphically bend the arrows on our displayed visualization.

Accomplishments that I'm proud of

We are proud of our production-level UI.

What I learned

We learned about how to carefully lay out a web application for a pleasant user experience.

What's next for Code Etch

To automatically extract the design patterns and architecture of a project using machine learning.

Share this project: