Multimodal ML Models for Detecting Anti-Patterns in UI/UX Designs

  • Authors

    • B. Sithik Shah Research scholar, Department of IT, PSG College of Arts and Science, Coimbatore, Tamil Nadu, India. Author
    • G. Nickson prabhu Research scholar, Department of IT, PSG College of Arts and Science, Coimbatore, Tamil Nadu, India. Author

    DOI:

    https://doi.org/10.67228/3071561X/IJIRHT-2022PII8R2K

    Published 08-04-2022

  • UI/UX Anti-Patterns, Multimodal Machine Learning, Design Quality Analysis, Computer Vision For UI, Layout Graph Modeling, Human-Computer Interaction (HCI), Deep Learning For Design Evaluation, Automated Usability Assessment, Visual Design Analysis, Interaction Flow Understanding

    Issue

    Section

    Articles

    How to Cite

    [1]
    B. Sithik Shah and G. Nickson prabhu, “Multimodal ML Models for Detecting Anti-Patterns in UI/UX Designs”, IJIRHT, vol. 5, no. 2, pp. 01–19, Aug. 2022, doi: 10.67228/3071561X/IJIRHT-2022PII8R2K.
  • Abstract

    UI/UX design quality plays a critical role in user satisfaction, accessibility, and product success. However, detecting design anti-patterns such as inconsistent visual hierarchy, poor affordance, or misleading navigation remains largely manual, subjective, and error-prone. This paper proposes a multimodal machine learning framework that analyzes visual mockups, interaction flows, and textual design descriptions to automatically identify UI/UX anti-patterns. The system integrates computer vision models, layout-graph encoders, and text language models to detect structural, visual, and semantic inconsistencies across screens. A multimodal fusion model combines these signals to produce a consolidated anti-pattern risk score and label. We evaluate the approach using a curated dataset of annotated UI anti-patterns across mobile and web applications. Experimental results show that multimodal learning significantly outperforms unimodal baselines, especially for patterns requiring contextual or cross-screen reasoning. The findings highlight the potential of unified multimodal ML pipelines in automating UI/UX quality checks and supporting design governance.

  • References

    [1] Zhang, L., & Kumar, S. (2022). Multimodal Representation Learning for Interface Understanding. Proceedings of the ACM Conference on Human-Computer Interaction.

    [2] Chen, Y., Huang, J., & Li, T. (2021). Detecting UI Anti-Patterns Using Deep Vision Models. IEEE Transactions on Software Engineering.

    [3] Lopez, R., & Tan, A. (2022). OCR-Enhanced UX Semantics: An NLP Approach for Identifying Design Inconsistencies. Empirical Software Engineering Journal.

    [4] Kim, H., & Houben, G. (2020). Automated Usability Defect Detection Using CNN-based Screen Understanding. ACM CHI Conference on Human Factors in Computing Systems.

    [5] Morris, P., & Singh, J. (2021). Fusion Techniques for Multimodal Neural Architectures in Product Design Evaluation. Neural Computing and Applications.

    [6] Xu, L., Zhao, F., & Chen, D. (2021). Visual-Linguistic Models for Mobile UI Understanding. IEEE International Conference on Computer Vision (ICCV).

    [7] Rahman, M., & Wang, X. (2022). Design Accessibility Validation Using Deep Multimodal Models. ACM Transactions on Accessible Computing.

    [8] O’Neill, R., & Hassan, A. (2020). Automated Interface Auditing Using Graph Neural Networks. Proceedings of the AAAI Conference on Artificial Intelligence.

    [9] Barker, J., & Lee, J. (2022). Benchmarking Multimodal Models for Screen-Level Anomaly Detection. ACM Journal on Interactive Systems.

  • Downloads