[ Aplicación de patrones de interacción en componentes sobre Storybook y su impacto en la deuda técnica en proyectos web ]
Jonathan Delgado Guerrero1, Yuliana León Bazan2, and Christopher Crespo León3
1 Facultad de Ciencias Matemáticas y Físicas, Universidad de Guayaquil, Guayaquil, Guayas, Ecuador
2 Facultad de Ciencias Matemáticas y Físicas, Universidad de Guayaquil, Guayaquil, Guayas, Ecuador
3 Facultad de Ciencias Administrativas, Universidad de Guayaquil, Guayaquil, Ecuador
Original language: Spanish
Copyright © 2025 ISSR Journals. This is an open access article distributed under the Creative Commons Attribution License, which permits unrestricted use, distribution, and reproduction in any medium, provided the original work is properly cited.
This study focuses on technical debt in web development, specifically how the early adoption of Storybook can mitigate this challenge. Our research used a mixed-methods approach, combining quantitative data on code quality and technical debt metrics with a qualitative case study involving three development teams. Storybook is a powerful tool for designing components with well-defined interaction patterns. By integrating these practices, it not only improves software quality and maintainability but also aids work in agile development environments. Technical debt often arises when teams create components with deficient interaction patterns; however, Storybook enables programmers to build components with consistent interaction patterns, which increases productivity and minimizes errors. In summary, the findings strongly suggest that integrating atomic design principles with interaction patterns and specialized tools like Storybook optimizes development processes, enhances technical debt management, and leads to the creation of more resilient and effective software.
Author Keywords: Atomic design, interaction patterns, technical debt web projects.


Jonathan Delgado Guerrero1, Yuliana León Bazan2, and Christopher Crespo León3
1 Facultad de Ciencias Matemáticas y Físicas, Universidad de Guayaquil, Guayaquil, Guayas, Ecuador
2 Facultad de Ciencias Matemáticas y Físicas, Universidad de Guayaquil, Guayaquil, Guayas, Ecuador
3 Facultad de Ciencias Administrativas, Universidad de Guayaquil, Guayaquil, Ecuador
Original language: Spanish
Copyright © 2025 ISSR Journals. This is an open access article distributed under the Creative Commons Attribution License, which permits unrestricted use, distribution, and reproduction in any medium, provided the original work is properly cited.
Abstract
This study focuses on technical debt in web development, specifically how the early adoption of Storybook can mitigate this challenge. Our research used a mixed-methods approach, combining quantitative data on code quality and technical debt metrics with a qualitative case study involving three development teams. Storybook is a powerful tool for designing components with well-defined interaction patterns. By integrating these practices, it not only improves software quality and maintainability but also aids work in agile development environments. Technical debt often arises when teams create components with deficient interaction patterns; however, Storybook enables programmers to build components with consistent interaction patterns, which increases productivity and minimizes errors. In summary, the findings strongly suggest that integrating atomic design principles with interaction patterns and specialized tools like Storybook optimizes development processes, enhances technical debt management, and leads to the creation of more resilient and effective software.
Author Keywords: Atomic design, interaction patterns, technical debt web projects.
Abstract: (spanish)
Este estudio se enfoca en la deuda técnica en el desarrollo web, centrándose en cómo la adopción temprana de Storybook puede mitigar este desafío. La investigación empleó un enfoque de métodos mixtos, combinando datos cuantitativos sobre la calidad del código y métricas de deuda técnica con un estudio de caso cualitativo en tres equipos de desarrollo. Storybook es una herramienta potente para diseñar componentes con patrones de interacción bien definidos. Al integrar estas prácticas, no solo se mejora la calidad y mantenibilidad del software, sino que también se ayuda al trabajo en entornos de desarrollo ágiles. La deuda técnica a menudo surge cuando los equipos desarrollan componentes con patrones de interacción deficientes; sin embargo, Storybook permite a los programadores crear componentes con patrones de interacción consistentes, lo que incrementa la productividad y minimiza los errores. En síntesis, las conclusiones sugieren firmemente que la integración de principios de diseño atómico con patrones de interacción y herramientas especializadas como Storybook optimiza los procesos de desarrollo, mejora la gestión de la deuda técnica y conduce a la creación de software más resiliente y efectivo.
Author Keywords: Diseño atómico, patrones de interacción, deuda técnica proyectos web.