All projects
Programming coursework · Durham University

Kaversky: my first website

Dec 2022First websiteHTMLCSSJavaScriptBootstrapD3.jsGitHub Pages

A single-page landing site for a fictional antivirus product, built for my first web programming coursework: a responsive Bootstrap layout, an interactive D3 line chart driven by a CSV dataset, pricing tiers, a pre-order form and a particle snow effect, hosted on GitHub Pages.

Source on GitHub

About

This was my first website, built in December 2022 during the first year of my degree: a landing page for a made-up antivirus product, "Kaversky", aimed at families who want all their devices protected under one subscription.

Features

  • Responsive layout with Bootstrap 4: sticky navigation, an image carousel, feature cards and three pricing tiers.
  • Interactive D3.js chart that loads a CSV dataset of antivirus adoption on Windows and macOS and lets visitors hide or show each series by clicking the legend.
  • Pre-order and contact form with a confirmation message.
  • Particle snow effect using particles.js.
  • Tooling: documented with JSDoc, linted with ESLint (standard style), and deployed with GitHub Pages.
Purple data section with a D3 line chart comparing Windows and macOS series from 2000 to 2018
The D3 chart section, rendered from the site's CSV dataset. Clicking a legend label toggles that series.
Three pricing tiers: Free, Pro and Enterprise
Pricing tiers built with Bootstrap cards. Screenshots of the site served locally.

The chart and particle effects were adapted from credited examples (D3 Graph Gallery and a particles.js tutorial), and the layout from Bootstrap's carousel and pricing examples. Learning to combine and customise them was the point of the exercise.

← Back to all projects
Kaversky: my first website — Nichita Roscin