/eSalonRegistration

A stylish mock registration page for eSalon.

Primary LanguageJavaScript

eSalon "Create Your Account"

eSalon Registration Form Demo.

Note: Use Chrome for best experience.

This front end project was made with HTML/CSS/Javascript. It also utilizes Bootstrap, SCSS and jQuery. Since this is for a UI/UX developer role, I spent half of my time focused on designing the user experience.

I wanted the user to feel like they were about to sign up for something fun. eSalon has two fun draws that I kept thinking about: "California" and "hair". I think the background image perfectly captures those themes. The form elements are curvy and colorful.

Instead of spending time creating all the rules we want to see in form fields (which is no problem for me to do), I decided to push myself to add subtle flare to the experience. My favorite part is that once a form is submitted, the page scrolls up to the top and a personalized message appears, welcoming the new user.

Getting started

This is a front end project, so just start a live server and it should be up and running. Chrome is the best browser for this site.

Developing

Built With

HTML, CSS/SCSS, Javascript, Bootstrap, jQuery

Setting up Dev

git clone https://github.com/your/eSalonRegistration.git

Tests

If this was a full project, I would have developed tests with Jest, which I have used for similar projects in the past.

Util.js

This file was created with scalability in mind. I wanted to demonstrate the power of having a Javascript library of HTML elements. If I had to build many sites for the admin console, it would be advantageous for me to have methods for creating consistent elements across the console.