Sketch2aia
Transformar um sketch de uma interface de usuário em um wireframe usando o App Inventor tem sido uma necessidade comum tanto no ensino de computação quanto no desenvolvimento de aplicativos por usuários finais. Como essa parte do desenvolvimento de aplicativos móveis é desafiadora e demorada, apresentamos uma abordagem que automatiza esse processo por meio da prototipagem das interfaces de usuário.
A abordagem Sketch2aia emprega deep learning para detectar os componentes de interface do usuário e sua posição em um sketch desenhado à mão, criando uma representação intermediária da interface de usuário e gera automaticamente o código App Inventor do respectivo wireframe. A abordagem atinge uma precisão média de classificação dos componentes da interface de usuário de 87,72% e resultados de uma avaliação preliminar com usuários indicam que ela gera wireframes que se assemelham aos sketches em termos de similaridade visual.
A abordagem está disponível como uma ferramenta Web e pode ser usada para apoiar de maneira eficaz e eficiente o ensino do design da interface de usuário, bem como o desenvolvimento de aplicativos móveis por usuários finais.
Experimente!
Mais informações:
Baulé, D. d. S.; Gresse von Wangenheim, C.; von Wangenheim, A.; Hauck, J. C. R. Recent Progress in Automated Code Generation from GUI Images using Machine Learning Techniques. Journal of Universal Computer Science, accepted for publication, 2020.
Daniel de Souza Baulé, Christiane Gresse von Wangenheim, Aldo von Wangenheim, Jean C. R. Hauck, Edson C. Vargas Júnior. Utilizando Deep Learning para Apoiar o Ensino de Design de Interface de Usuário na Educação Básica. Relatório Técnico INCoD/GQS.04.2020.P, UFSC, Florianópolis, Brasil, 2020.
Dataset do modelo ML
Programa de Computador registrado INPI No: BR512021000732-8