Login/Signup Project

Modanisa enables modest women to look good and feel self-confident in today’s world. Its mission is to build a global ecosystem that combines fashion and technology to serve the lifestyle needs of modest women.

I led the end-to-end redesign of the login and sign-up flows over a one-year period. As the sole UX designer I managed the entire process from initial research and design to testing and launch, keeping the experience seamless across mobile apps and mobile web.

At the beginning of the project I placed great importance on the analysis process to create the right design for our users. I applied various analysis techniques, detailed below.

To accurately understand our target audience we first created personas. After developing them we applied a technique that helped us empathize with them. The most crucial aspect was putting ourselves in the user’s shoes, letting us better identify and address their needs.

After understanding the user we applied this technique within the team at the start of the project to foresee what could go right or wrong. By anticipating problems and positive outcomes we could create appropriate scenarios, preventing cost and time losses.

Visually I began the initial work at this stage. After the analysis and research phases I took the first steps in developing the product and created various wireframes. Their value lies in identifying and addressing errors or improvements before the product progressed further.

Login and sign-up is a crucial point in the shopping experience, especially where registration or login is mandatory. We aimed to keep it simple without drastically altering user habits. Users could log in with either an email or a phone number. Initially we considered removing the phone option, but reviewing the login data showed a significant majority still preferred to log in using their phone.

A key innovation was a smart, unified input field that detects and formats either an email or phone number in real time, simplifying the interface and reducing cognitive load. Dynamic input masking ensures clarity and prevents user errors.

Another issue was the lack of priority in the design, which sometimes confused users. The primary decision was to make the login/sign-up button prominent as the main CTA. Other login methods were designed to be noticeable without becoming the primary CTA.

In the later stages I developed alternative designs. We discarded all of them for reasons such as cost, insufficient infrastructure and performance. The focus was to keep the design very simple and concentrated solely on the login and registration section.

The login flow involved more than 15 screens across all scenarios, including error screens and success states. The project was designed exclusively for mobile, with no desktop version.

The registration flow encompassed over 20 screens across all scenarios, including error screens and success states. The project was designed exclusively for mobile, with no desktop version.

When users forget their password they can retrieve it via mobile phone or email. Previously there were significant security vulnerabilities and server costs; in the new flow everything is optimized.

Users can change their password through a reset link sent to their email or mobile phone. The process runs through a webview, mainly because users can also reach their email from a desktop.

Users can log in through three different social alternatives. Whether they have an account or not, clicking one of the buttons logs them in or signs them up and logs them in. If a user previously signed up via email with a Gmail account and later chooses to connect with Gmail, the accounts merge.

• Figma
• Adobe CC
• Miro
• Google Analytics
• ProtoPie
• Zeplin
• Hotjar

The entire design process lasted 2-3 months. The time until the application was tested spanned a total of one year. It was developed for mobile iOS and Android. The first stage was considered an MVP, and infrastructure was established for many features in later stages. Testing began in over 140 countries.