Estado da Prática do Design Visual de Aplicativos Móveis desenvolvidos com App Inventor

Igor da Silva Solecki, Karla Aparecida Justen, João Vitor Araujo Porto, Christiane Anneliese Gresse von Wangenheim, Jean Carlo Rossa Hauck, Adriano Ferreti Borgatto

Resumo


O App Inventor é um ambiente de programação baseado em blocos que permite a qualquer usuário final criar aplicativos móveis. O App Inventor é frequentemente usado para ensinar computação na educação básica por meio do desenvolvimento de aplicativos móveis. Embora a aprendizagem de computação com o App Inventor tenha sido investigada sob diferentes pontos de vista, uma questão que permanece é se o design visual da interface de usuário (IU) dos aplicativos desenvolvidos é adequado, sendo um dos principais fatores de sucesso de aplicativos móveis. Assim, este artigo analisa o design visual das interfaces de usuário de 88.861 aplicativos da galeria do App Inventor, quanto à conformidade com guias de estilo por meio da análise automatizada do código fonte, bem como sua estética com base em um survey com 95 participantes avaliando 110 IUs. Os resultados mostram que a maioria das IUs não está em conformidade com diretrizes de design e não possui estética visual. Assim, mostra-se importante abordar não apenas conceitos de programação, mas também o design de IU no ensino de computação por meio do desenvolvimento de aplicativos móveis. Os resultados dessa análise podem direcionar o desenvolvimento e a melhoria de unidades instrucionais e do ambiente do App Inventor, viabilizando assim o desenvolvimento de aplicativos com melhor design de IU e aumentando suas chances de ter sucesso.

Palavras-chave


Design Visual; Estética; Design de Interface de Usuário; Educação Básica; App Inventor; Programação Visual

Texto completo:

PDF

Referências


Agapie, E. & Davidson, A. (2018). Human-centered design charrettes for K-12 outreach. Interactions, 25(6), 74-77. [GS Search]

AIGA. (2019). The Professional Association for Design. Disponível em https://www.aiga.org/

Alves, N. d. C., Gresse von Wangenheim, C., Hauck, J. C. R., & Borgatto, A. F. (2019). A Large-scale Analysis of App Inventor Projects. Manuscrito submetido para publicação.

Chan, K. K. (2019). Building an Online Community of Creators Through MIT App Inventor. Dissertação de mestrado, Electrical Engineering & Computer Science, MIT, Cambridge, Estados Unidos. Disponível em https://appinventor.mit.edu/

CSTA. (2016). K–12 Computer Science Framework. Disponível em https://k12cs.org/

Daniel, G. T., Gresse von Wangenheim, C., Medeiros, G. & Alves, N. d. C. (2017). Ensinando a Computação por meio de Programação com App Inventor. Anais do Computer on the Beach. Florianópolis, Brasil. [GS Search]

Ferreira, M. N. F., Gresse von Wangenheim, C., Missfeldt Filho, R., Pinheiro, F. d. C. & Hauck, J. C. (2019). Learning user interface design and the development of mobile applications in middle school. Interactions, 26(4), 66-69. [GS Search]

Ferreira, M. N. F., Pinheiro, F. d. C., Missfeldt Filho, R., Gresse von Wangenheim, C. (2019). Ensinando Design de Interface de Usuário na Educação Básica: Um Mapeamento Sistemático do Estado da Arte e Prática. In Anais do Congresso Brasileiro de Informática na Educação. Brasília, Brasil.

Garrett, J. J. (2011). Elements of user experience, the: user-centered design for the web and beyond. Berkley: New Riders Press. [GS Search]

Gomes, T. C. & de Melo, J. C. (2013). App inventor for android: Uma nova possibilidade para o ensino de lógica de programação. In Anais dos Workshops do Congresso Brasileiro de Informática na Educação. Campinas, Brasil. [GS Search]

Gresse von Wangenheim, C. G., Hauck, J. C., Demetrio, M. F., Pelle, R., Alves, N. d. C., Barbosa, H., & Azevedo, L. F. (2018). CodeMaster – Automatic Assessment and Grading of App Inventor and Snap! Programs. Informatics in Education, 17(1), 117-150. [GS Search]

Gresse von Wangenheim, C. G., Porto, J. V. A., Hauck, J. C., & Borgatto, A. F. (2018). Do we agree on user interface aesthetics of Android apps?. arXiv:1812.09049 [cs.SE]. [GS Search]

Grover, S. & Pea, R. (2013a). Computational thinking in K–12: A review of the state of the field. Educational Researcher, 42(1), 38-43. [GS Search]

Grover, S. & Pea, R. (2013b). Using a Discourse-Intensive Pedagogy and Android's App Inventor for Introducing Computational Concepts to Middle School Students. In Proceedings of the 44th ACM Technical Symposium on Computer Science Education. Minneapolis, Estados Unidos. [GS Search]

Hamborg, K. C., Hülsmann, J. & Kaspar, K. (2014). The interplay between usability and aesthetics: More evidence for the "what is usable is beautiful" notion. Advances in Human-Computer Interaction, 2014, 15. [GS Search]

Hassenzahl, M. & Monk, A. (2010). The inference of perceived usability from beauty. Human–Computer Interaction, 25(3), 235-260. [GS Search]

International Organization for Standardization. (2011). ISO/IEC Standard 25010 - Systems and software engineering — Systems and software Quality Requirements and Evaluation (SQuaRE) — System and software quality models. Disponível em https://www.iso.org/standard/35733.html

Justen, K. A. (2019). Desenvolvimento de um Analisador de Design de Interface no Contexto do Ensino de Computação com o App Inventor (Trabalho de Conclusão de Curso). Disponível em https://repositorio.ufsc.br/handle/123456789/202490

Kumar, D. S., Purani, K. & Viswanathan, S. A. (2018). Influences of 'appscape' on mobile app adoption and m-loyalty. Journal of Retailing and Consumer Services, 45, 132-141. [GS Search]

Lee, D., Moon, J., Kim, Y. J. & Yi, M. Y. (2015). Antecedents and consequences of mobile phone usability: Linking simplicity and interactivity to satisfaction, trust, and brand loyalty. Information & Management, 52(3), 295-304. [GS Search]

Leôncio, N. N., Sousa, C. C., Sousa, R. P. & Melo, R. F. (2017). Programação em blocos com o MIT App Inventor: Um relato de experiência com alunos do ensino médio. In Anais do Workshop de Informática na Escola. Recife, Brasil. [GS Search]

Lye, S. Y. & Koh, J. H. L. (2014). Review on teaching and learning of computational thinking through programming: What is next for K-12?. Computers in Human Behavior, 41, 51-61. [GS Search]

MIT. (2019). About Us. Disponível em http://appinventor.mit.edu/explore/about-us.html

Mustafaraj, E., Turbak, F. & Svanberg, M. (2017). Identifying original projects in App Inventor. In Proceedings of the 30th International Flairs Conference. Marco Island, Estados Unidos. [GS Search]

Okerlund, J. & Turbak, F. (2013). A preliminary analysis of app inventor blocks programs. In Proceedings of the Conference on Visual Languages and Human Centric Computing, San Jose, Estados Unidos. [GS Search]

Patton, E. W., Tissenbaum, M. & Harunani, F. (2019). MIT App Inventor: Objectives, Design, and Development. In: Kong SC., Abelson H. (eds) Computational Thinking Education. Springer, Singapore. [GS Search]

Rogers, Y., Sharp, H. & Preece, J. (2011). Interaction design: beyond human-computer interaction (3rd ed.). Chichester: Wiley. [GS Search]

Schlatter, T. & Levinson, D. (2013). Visual usability: Principles and practices for designing digital applications. San Francisco: Morgan Kaufmann [GS Search]

Solecki, I. S. (2019). Uma abordagem para avaliação do design visual de aplicativos móveis criados com linguagens de programação baseadas em blocos (Dissertação de mestrado). Manuscrito em preparação.

Tissenbaum, M., Sheldon, J. & Abelson, H. (2019). From computational thinking to computational action. Communications of the ACM, 62(3), 34-36. [GS Search]

Tractinsky, N., Katz, A. S. & Ikar, D. (2000). What is beautiful is usable. Interacting with computers, 13(2), 127-145. [GS Search]

Tractinsky, N. (2013). Visual Aesthetics. The Encyclopedia of Human-Computer Interaction, 2nd Ed. Disponível em: https://www.interaction-design.org/

Wolber, D., Abelson, H. & Friedman, M. (2015). Democratizing computing with app inventor. GetMobile: Mobile Computing and Communications, 18(4), 53-58. [GS Search]

World Wide Web Consortium. (2008). Web Content Accessibility Guidelines 2.0. Disponível em https://www.w3.org/TR/2008/REC-WCAG20-20081211/

World Wide Web Consortium. (2019). Mobile Accessibility at W3C. Disponível em https://www.w3.org/WAI/standards-guidelines/mobile/

Wilensky, U., Brady, C. E., & Horn, M. S. (2014). Fostering computational literacy in science classrooms. Communications of the ACM, 57(8), 24-28. [GS Search]

Xie, B., & Abelson, H. (2016). Skill progression in MIT app inventor. In Proceedings of the IEEE Symposium on Visual Languages and Human-Centric Computing. Cambridge, Inglaterra. [GS Search]

Xie, B., Shabir, I., & Abelson, H. (2015). Measuring the usability and capability of app inventor to create mobile applications. In Proceedings of the 3rd International Workshop on Programming for Mobile and Touch, Pittsburgh, Estados Unidos. [GS Search]

Zen, M., & Vanderdonckt, J. (2016). Assessing user interface aesthetics based on the inter-subjectivity of judgment. In Proceedings of the 30th International BCS Human Computer Interaction Conference: Fusion!, Bournemouth, Inglaterra. [GS Search]




DOI: https://doi.org/10.5753/rbie.2020.28.0.30

____________________________________________________________________________

Revista Brasileira de Informática na Educação (RBIE) (ISSN: 1414-5685; online: 2317-6121)
Brazilian Journal of Computers in Education (RBIE) (ISSN: 1414-5685; online: 2317-6121)