This study examines the integration of usability and user experience (UX) into agile workflows based on a collaborative approach to support effective digital product development. This is demonstrated by the design and development of a self-regulation tool developed as a plug-in for a Learning Management System (LMS) and tailored for online learners studying in a university network. The challenges of integrating different methodologies throughout the project are addressed by considering the use of agile methodologies, conducting usability/UX testing following a user-centered design process, expert input, and incorporating scientific validity. From conducting requirements analysis by creating personas or synthesizing existing information, designing prototypes, moving from concept to code, managing the development workflow, fostering continuous communication, and ensuring transparency throughout the process, an interdisciplinary team designed and implemented the tool. Building on the existing knowledge base for integrating (agile) software development with usability and UX practices, the study identifies key strategies for seamless integration into software development workflows. The results of this study may be of considerable value to educators, developers, and researchers seeking effective methods for developing tools in a learning environment through agile workflow management using collaborative approaches.