PixelPulse is an Artificial Intelligence based software tool to help designers & developers analyze websites. Harnessing the powers of Computer Vision, specifically the tool helps professionals from various domains in readability, color scheme/color contrast and negative spacing analysis. The tool can be used to analyze both static designs (such as UI/UX artifacts) and live webpages.
Objectives
The software system has 3 main objectives
1. To analyze the readability of an artifact, find out how easily readable it is for the audience of a certain UI and what can be improved.
2. To analyze the color combinations and color contrast(s) in a website, find out how many colors a website has, if they are too much or too less and realize if the contrast between the different UI component layers is not as bright to hurt users’ eyes and is not too dull to make the foreground unseeable.
3. To analyze the amount of negative spacing a website has. See if it is just enough to keep the optimal distance between the UI components and make sure it is not too low to make everything crowded as well as not too high to make it difficult for user to find out the ui components being too far away.
Socio-Economic Benefit
The product plays a vital role in helping designers and web developers create better websites for their users. The software makes the lives of web developers and UX designers easier by automating analysis of their designs and websites to find vulnerabilities. Consequently, they are able to make their websites better for their end users so the app helps them indirectly too.
User Experience and Human Computer Interaction play a vital role in making your product user friendly. It is very important for designers and developers to develop products that are easily usable for all kinds of users. Our system saves their time and resources by automating the analysis of a webpage to make it user friendly. The software is of immense importance in UX/UI and HCI fields. The product has a vast scope and is a very important automation software for Web designers and developers. Although the software does not provide a deep and complete analysis of a web page, it does provide the users with the basic functionality based on which websites can be drastically improved and made user friendly.
Methodologies
Throughout the development process we have followed Iterative Agile development methodology. We had divided the project into smaller parts and then each of the group member took to their assigned modules. Each group member, assigned with different module, divided their respective modules even more and developed them. Each atomic module during development was constantly being tested and redeveloped thus following iterative methodology to get the best of results.
The project utilizes the powers of Artificial Intelligence and Machine Learning at various stages. The core of the app is built in python and is interfaced to 3 different faces: Web App, Mobile App and Browser extension. The web app is built in Flask framework. The mobile app is developed within React Native's environment while the Browser Extension relies under Java Script. All of these 3 different interfaces at the frontend can be used to interact with backend by our users.
Outcome
Following are the outcomes of our project:
1. A working software deployed onto web, browser extension and mobile app platforms. This tool can be used by general users to utilize the tools and techniques powered by AI to automate the process of analyzing web pages and web designs for potential UX problems.
2. With the implementation of PixelPulse, designers and developers would have access to a comprehensive tool that automates fundamental processes of UX analysis. This outcome could lead to an improvement in the efficiency and effectiveness of UX analysis in the domain of Human-Computer Interaction and User Experience Design.
3. By providing insights into readability, color combinations, color contrast, and negative spacing, PixelPulse could contribute to the development of more user-friendly websites and interfaces. This outcome aligns with the significance of the system in promoting user-friendly products and experiences.
4. he automation of website analysis through PixelPulse results in significant time and resource savings for designers and developers. By automating tasks such as readability analysis and color contrast checking, the tool streamlines the UX/UI design process and reduces the manual effort required for analysis.
