Overview

This case study outlines the design of Zwitch’s sign-up flow, focusing on reducing friction, simplifying steps, and increasing successful sign-ups. The project aimed to create an intuitive, user-friendly onboarding process that aligns with Zwitch's brand identity and enhances user engagement from the start.

Objectives

Challenge

Zwitch is a no-code platform for embedded finance. A platform that is going to be majorly used either by the product teams, engineers, or business heads of the company. The goal was to keep the platform developer-friendly as they would be mainly handling and overlooking the APIs and the functionality for in-depth use. Now the platform has two different plans, one being the no-code pre-made embedded finance functionality where you just need to customize your branding and then you get to add any kind of finance-related features in your own platform. The second plan is a more in-depth control kind of module where you can do more, keep track, and enable full banking solutions for your platform.

So now we had to build the Sign-up flow from scratch for this very new product and had to appeal to a certain demographic audience.

Sign-up page (Concept) - Step 1

Sign-up page (Concept) - Step 1

Design Process

We kept the theme very developer-centric at the beginning with a dark theme for the platform as with a bit of user research we came to know that the majority of the users, especially developers prefer a dark mode for the platform as they are more habituated to use coding tools like Visual Studio and many like it which boosts the dark theme. It is also easier for the eyes when you are spending more time on a platform to minutely observe the details and also to appeal to the trend for what users want.

Jakob’s Law (Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know)

Sign-up page (Concept) - Step 2, OTP

Sign-up page (Concept) - Step 2, OTP

As you can see, the right side of the Sign-up panel resembles a code editor kind of view whereas you type the details on the form on the left, it automatically writes it as a part of the code itself for visual appeal and also to show a basic breakdown of your simple inputs could be used to simplify and create complex code solutions with ease.