Security App light & dark theme demo and configurator. Ideation, user journey development, information architecture, UI design and responsive layout (mobile first). The goal is for the learning curve in the installation and configuration of the system to be smooth and for the design to be effective, both structurally and aesthetically. Check it out 🙂
Security App – dark theme
One of the new features added to the redesign was the possibility of choosing between light or dark theme. As this is an application in which the administrator(s) can stay quite a long time on a daily basis, it is important to have this type of settings to prevent eye fatigue.
Security App desktop – dark theme
Tooltips were added to improve understanding of some of the settings that the user tests revealed to be more complex.
Security App desktop – light theme
First and foremost, an adequate contrast is sought in both light and dark subjects. All screens try to remain as simple and understandable as possible, even those that contain a lot of information. That is always the biggest challenge in this type of application.
Security App – Wireframe lo-fi
Some examples that show how the concept of interface continues to evolve even after the research phase.
Security App – Wireframe mid-fi
Looking for some design guidelines (not final) to make it easier for stakeholders to understand the screens and their evolutionary process regarding the old design.
Look & feel quite close to the reality of a good part of the screens that make up the application responsible for configuring the security system.
Config – Axure wireframe
Realistic mockup developed with the aim of simplifying and improving the architecture of existing information. Certain sections were regrouped using ‘card sorting’ and better use was made of the space available on the screens.
Old Config screens – slider
The old application design before applying its interface redesign. It is clear that the use of space on the screens was problematic. The interface was also modernized, keeping it minimalist to improve its understanding.
And finally, some tests I did for cards. The idea was to clearly show their different states and also stay functional even when presented in large groups.