kj-modelling

Hosting

Packages Used

1. Bootstrap v.5.0.2 via CDN, no jQuery
2. Swiper v.7.0.2

Requests

Client requested the following:

1. Small web application to act as Instagram replacement to send to model bookings
2. No personal contact info (phone number, email), only a contact form to send booking info
3. Primarily focused on images
4. Client did not want to pay for custom domain or hosting fees.

Design Process

1. I originally put together a rough Figma file for the client to view remotely.
2. She liked the colors used and the basic content, but wanted to make eveything horizontal vs. vertical.
3. I found that a simpler design looked more aesthetically pleasing, less "cartoony" and much easier to make responsive to all devices, and the client agreed.

Form Submit

As this was a frontend only project, I needed to implement a form submission without setting up a backend. I used FormSubmit to implement a simple email redirection to the client, as there were no files or large data being sent.

User Story:

Given the user fills out the contact form and clicks the submit button
When the user completes the ReCaptcha page
Then they will be redirected to a confirmation page
And the email will be send to the user in a secure fashion without providing the client's contact info

Form Flow

1. The user fills out the form:

2. The user completes the ReCaptcha page for spam security:

3. The user is sent to the confirmation page with navigation intact to go back to the home page:

4. The client is sent an email with the contact information: