Vercel is changing the game for cloud services and website deployment. Vercel is a cloud platform that enables JAMstack websites and serverless functions to scale automatically and requires no supervision, allowing Vercel to be an easy go-to for developers. Vercel boast's a zero configuration deployment by providing integrations and easy-to-use interfaces. Lets break down Vercel's onboarding experience to understand why its an easy go-to for developers.
First things first, Vercel makes the deployment process easy by allowing a user to import a project from a repository. Notice how they have essentially greyed-out the "Import Template" option and made the "Import Git Repository" option bright blue, grabbing your attention and making it more obvious of a decision. Vercel knows their audience (developers) and knows that their audience will most likely already have a repo of their project. By placing the logos of GitHub, GitLab and Bitbucket, the user knows which services Vercel integrates with without explicitly stating. Lets continue by importing a repository.
Here is where the user is prompted to Sign in or Log in. Because we are going to continue by importing an existing repository, Vercel knows that the easiest way to sign up would be to just sign up with your existing GitHub, GitLab or Bitbucket account. On the left, Vercel highlights the experience of their git integrations. Using providers (GitHub, GitLab, and Bitbucket) for your sign up means less typing for the user and an easier streamline of their deployment.
Extra bonus: At the bottom-left, Vercel highlights the big companies that already use Vercel (Auth0, Airbnb, GitHub, etc), giving more social proof of the validity of their product.
Each step of Vercel's process is bite-sized. It allows the user to see what is going on, rather than having a long form to fill in information. This is an example of Hick's Law.
💡 Hick's Law states that "The time it takes to make a decision increases with the number and complexity of choices."
This means the more complex your forms and the more the user has to input per page, the less satisfying and longer it takes for the user. Asking the user for small, bite-size answers and inputs, makes the hard and long process of deployment, easy and satisfying.
Before building and deploying the project, Vercel allows for easy integration of environment variables and other build and output settings. Notice how Vercel uses drop-down menus, leaving the option open for users, but not crowding the form.
This is my favorite part of the onboarding. Vercel runs the website build on a terminal and you get to watch the whole thing. Usually, the go-to for most websites is a spinner or progress bar. Having a terminal fetching and building packages, makes a more pleasing and satisfying user experience. The user can see the progress and can have an expectation of when its complete. Vercel also shows all the errors in the terminal, as if you're building in a terminal on your machine.
Often times as a Web developer, we overlook or neglect the little nuances that make a good user experience into a GREAT user experience. Here are 3 takeaways from Vercel's Onboarding process:
Have any suggestions or want me to breakdown your website? Tweet Ben @bnpneio . All Feedback is welcome!