Volver a proyectos

Luciérnaga

Proyecto En desarrollo
  • TypeScript
  • Canvas

¿Por qué existe este proyecto?

La idea original es poder crear diagramas solamente dibujando.

Hace tiempo, cuando aún era estudiante, compartíamos pantalla para enseñar en el Paint un diagrama de lo que tratábamos de explicar. Siempre salían diagramas muy pochos, el rectángulo simétrico era el objetivo; la elipse, la vieja confiable. Un día me interesó conocer cómo funcionan los gráficos en el navegador y, como siempre hago para aprender algo, me propuse hacer un proyecto. Luciérnaga es el resultado de una mezcla de necesidad y aprendizaje.

En el proceso, tuve que documentarme mucho sobre geometría y matemáticas en general, pero lo mejor de todo fue descubrir que, para hacer programas complejos como este, el problema más grande al que te enfrentas es el lenguaje. Conocer el dominio, conocer la nomenclatura, saber definir bien lo que es un punto, lo que es un vector, lo que es un ángulo, crear los objetos adecuados para abstraer toda la lógica y poder trabajar con ella… es un verdadero reto que a día de hoy sigo mejorando.

Y si te preguntas de dónde viene el nombre es porque este proyecto trata de iluminar las ideas (aunque sea un poquito).


Screenshot Luciérnaga

Rendimiento

Una cosa que me obsesiona es el rendimiento. Hubiese sido mucho más fácil conformarme con lo que vine a hacer, dibujar figuras a mano, pero hasta que no consiga tener diagramas de más de 100.000 figuras a 60 FPS no creo que continúe con el resto. Al final, no deja de ser un hobby.

Por ahora este es el resultado (~33 FPS), pero aún queda mucho por optimizar.


Screenshot Luciérnaga

Funcionalidades

  • Crear figuras: círculos, rectángulos y líneas
  • Seleccionar, mover, redimensionar y rotar figuras (individual y múltiple)
  • Crear, editar y borrar relaciones entre figuras con puntos de anclaje
  • Editar la forma de las relaciones moviendo sus vectores
  • Añadir texto a las figuras
  • Atajos de teclado, deshacer/rehacer y zoom

Si te gusta este proyecto y quieres darme alguna idea para mejorarlo, escríbeme un correo o contacta conmigo en LinkedIn.