Club ship PURGA: an event landing page with a request form

The PURGA club ship landing page is an older but useful example of a one-page website built from a provided design mockup. The task was to create a page with the ability to send an event request.

Open the original project description: https://raskumandrin.pages.dev/purga

In tasks like this, quality is not only about matching the mockup. Interactive elements also need to behave naturally: the form should not break the request flow, fields should be clear, and dynamic text should not turn into mechanical phrases such as “1 hours” or “2 hours” in the wrong context.

For event promo pages, a static landing page remains a practical format: it loads quickly, is easy to hand over to the project owner or contractor, and does not require heavy infrastructure when the business logic is limited to a request form and a few interactive elements.

Submit brief

Figure 1. PURGA club ship landing page: a promo page with a request form and event parameters.

Task

The task was to turn a mockup into a working HTML page. The landing page needed to:

• preserve the visual structure of the source mockup;
• give the user a clear path to submitting a request;
• support hour selection for the event;
• show correct Russian word forms next to the number of hours;
• remain simple to publish and hand over to the client.

Attention to Detail

The mockup showed the variant “5 hours”. If only the number changes, the interface quickly starts to feel careless in Russian: “1 часов”, “2 часов”, “3 часов”. This looks like a small detail, but details like this affect the perceived quality of the page.

When a web form has dynamic values — hours, guests, products, files, or any other entities — the text next to the number should also change correctly. It is more pleasant for the user to read a form that speaks naturally instead of mechanically inserting the same word after every number.

This is especially important for multilingual websites: word forms work differently in different languages, and a rule for Russian cannot simply be copied to English, Serbian, or another language. Such labels should be designed as part of the interface logic, not as static text in a mockup.

Below is an example specifically for Russian: the function receives a number and three word forms, then returns the correct label — “1 час”, “2 часа”, “5 часов”.

function plural(n, form1, form2, form5) {
  n = Math.abs(n) % 100;
  var n1 = n % 10;

  if (n > 10 && n < 20) {
    return form5;
  }
  if (n1 > 1 && n1 < 5) {
    return form2;
  }
  if (n1 == 1) {
    return form1;
  }

  return form5;
}

The formatter.js library was also used for formatted form input. This helped make input cleaner without overcomplicating the whole project.

Technical Outline

• Format: one-page promo website.
• Frontend: HTML/CSS layout from a mockup.
• Interactivity: JavaScript for parameter selection and word-form handling.
• Form: request form with formatted input fields.
• Backend: minimal setup sufficient for the request scenario.

The main engineering point is simple: if a landing page sells an event or service, the interface should be precise in small details as well as visually accurate. The user should not stumble over incorrect text next to commercially important request parameters.

Result

• The mockup was turned into a working one-page landing page.
• The page got a request flow for event inquiries.
• The number of hours was displayed with correct Russian word forms.
• Form fields received formatted input handling.
• The case study shows a practical approach to landing pages: not only building the screen, but also bringing interactive details to a normal user-facing level.

Who This Format Fits

• Event projects that need a fast promo landing page for a venue or event.
• Small businesses where the request form matters more than a complex catalog or account area.
• Teams that already have a mockup and need clean frontend work without excess architecture.
• Projects in Russian or other inflected languages where dynamic interfaces need proper word forms and input formatting.

If you need a similar result: I help build landing pages from mockups, assemble request forms, design dynamic labels, and prepare pages for publication.

Submit brief