Hoja de ruta del diseñador de GUI de Lopaka
Hola, Este es mi último boletín por correo electrónico, al menos de 2025.
Quizás algunos se perdieron la rebaja del 50% en curso en cualquier plan de suscripción de Lopaka (incluidos los planes anuales). Está limitada a los primeros 50 pagos. Usa este código: 2025BLACK
Tu generoso apoyo es lo que me permite seguir construyendo y compartiendo Lopaka con la comunidad. Me ayuda a ofrecer más funciones y actualizaciones.
*Se aplica hasta 12 meses. El código es válido hasta el 30 de noviembre a las 23:59 UTC
Creo que la transparencia es crucial para crear un buen producto. Es la primera vez que comparto esta hoja de ruta con alguien. Siempre me cuesta comprometerme con grandes objetivos. Piensa en ella como un borrador o una visión del futuro de Lopaka. Todavía sin fecha estimada.
Imagino un mundo en el que cada dispositivo, por pequeño que sea, tenga una interfaz limpia e intuitiva, y Lopaka sea la forma de construirla.
LA HOJA DE RUTA (imaginaria)
- Ampliar la compatibilidad con la biblioteca LVGL para atraer a desarrolladores de interfaces embebidas.
- Elementos básicos: botón, etiqueta, imagen: agregar widgets esenciales al editor para que los usuarios puedan diseñar fácilmente interfaces básicas con componentes de LVGL.
- Anidación y alineación: compatibilidad con diseños padre-hijo y herramientas de alineación para replicar el comportamiento de diseño del mundo real.
- Arc, Panel, List: agregar widgets más complejos para ampliar la flexibilidad de diseño y ajustarse a casos de uso reales.
- Reutilización estructurada de elementos de diseño entre pantallas y proyectos.
- Componentes e instancias: definir componentes reutilizables (como botones) e instanciarlos en distintas pantallas con vinculación.
- Estados de los componentes: lógica de variantes (por ejemplo, al pasar el cursor, presionado, inactivo) para interactividad y creación de prototipos.
- Biblioteca de componentes: componentes compartidos y globales utilizables en todos los proyectos.
- Mejoras del flujo de trabajo y herramientas de precisión que hacen que el editor se sienta «sólido».
- Edición de código: edición en línea del código generado automáticamente para ajustarlo o inyectar lógica.
- Reestructuración del diseño: renovación de UI/UX para reducir la fricción y hacer más intuitivas las herramientas de diseño.
- Lienzo libre con marcos: dejar atrás las pantallas fijas; permitir que los usuarios trabajen en un lienzo libre y dibujen los límites de las pantallas.
- Cuadrícula y guías: ayudar a alinear y estructurar los elementos de la interfaz con precisión.
- Ajustar a…: permitir el ajuste a la cuadrícula, a las guías o a los objetos para diseños perfectos al píxel.
- Copiar y pegar de verdad: mantener todos los datos de los elementos al copiar entre proyectos.
- Editar el texto en el lugar: hacer clic y editar el texto directamente en el lienzo (no en una barra lateral).
- Más capacidades de dibujo para bocetos y maquetas de interfaces.
- Más herramientas: triángulo, arco: agregar más formas para dibujar interfaces más ricas.
- Tamaño y forma de Pintar/Borrar: ajustar las herramientas de pincel para pixel art o decoración.
- Curvas Bézier: dibujar curvas personalizadas
- Mejor control y flexibilidad sobre la tipografía para pantallas.
- Más fuentes predeterminadas: ampliar las opciones de fuentes integradas con buena legibilidad en pantallas pequeñas.
- Formato U8G2: compatibilidad con la estructura y el formato de fuentes únicos de U8g2.
- Convertir cualquier fuente a cualquier formato: convertidor universal de TTF/OTF → Adafruit/U8g2/LVGL, etc.
- Conjuntos de glifos personalizados: permitir que los usuarios definan el contenido de los archivos de fuentes para ahorrar memoria
- Diagramas de flujo y prototipado para simular flujos reales de usuario
- Diagrama de flujo de usuario básico: dibujar flujos entre pantallas para visualizar la lógica de navegación.
- Áreas en las que se puede hacer clic: definir zonas sensibles táctiles para simular interacciones.
- Controles externos: simular pulsaciones de botones o eventos de dispositivos físicos.
- Organizar los recursos del proyecto para su reutilización y colaboración.
- Biblioteca de imágenes: biblioteca central para almacenar imágenes importadas o creadas.
- Colecciones de fuentes: guardar y reutilizar ajustes preestablecidos de fuentes en todos los proyectos.
- Componentes compartidos: sincronizar componentes entre varios usuarios y proyectos.
- Editor de animaciones y herramientas de movimiento
- Editor de fotogramas clave: edición basada en una línea de tiempo para un control fluido de la animación.
- Editor de transiciones: definir interacciones entre pantallas o estados con efectos de movimiento.
- Biblioteca de animaciones: administrar y reutilizar ajustes preestablecidos de animación o secuencias importadas.
- Control de versiones
- Rastrear el historial de diseño, revertir cambios y comparar estados de las pantallas.
- Herramientas integradas para apoyar el trabajo en equipo y la comunicación.
- Compartir en equipo y privacidad: invitar a colaboradores y administrar los derechos de acceso.
- Comentarios y debates: dejar notas o comentarios vinculados a elementos específicos.
- Edición en vivo: edición multijugador en tiempo real como Figma.
Uf… Eso es ENORME. Bien… volvamos al trabajo.
Si quieres unirte a este viaje y tienes experiencia que compartir, hablemos. Estoy muy abierto a nuevas conversaciones.
Si prefieres apoyarme de otra manera, considera una suscripción (no te pierdas la oportunidad con el código 2025BLACK).
P. D.: Seguiré publicando novedades en nuestro centro de Discord y en lopaka_app en X e Instagram.