The product director for Gemalto SafeNet approached me to update the user interface for the login sequence for a authentication software product. The old interface was still partially in the previous brand and it also needed to include additional sign in methods like grid authentication as well as password. Working with the product development team I mapped out all the different scenarios and designed a guideline for the interface and designs for the many different states that were possible in the process.

Below is the final login sequence showing the UI, and style guide that was created.

My role: UI design

 

style guide for login screens for software product
Style guide for login inputs
style guide for login screens for software product
Colour guide
style guide for login screens for software product
Input box and states style guide
UI design for login screen
Initial login screen
User interface design of software product for Gemalto
Login screen error
UI design for grid authentication pattern type login
Login screen grid authentication