Case study · teaching platform

Mr. Ibrahim Hussein

We designed and built a teaching platform for a Beirut programming tutor: two published courses, every exercise in both C++ and Java, and a scored test students take before they book.

UI/UXWeb app
Start a project Visit ibrahim-hussein.com
Mr. Ibrahim Hussein programming teaching platform designed and built by kaprera
Mr. Ibrahim Hussein programming teaching platform, built by kaprera
/ Overview

The challenge

A private tutor needed more than a flyer. Students had no way to see what a course actually covers, no way to judge whether they were ready for it, and no way to practise between sessions, so every enquiry started from zero.

The solution

We designed and built an open teaching platform: the full curriculum published objective by objective, every exercise available in both C++ and Java, and a scored evaluation test, with booking one tap away on WhatsApp.

/ What we built

Inside the project.

  • Two published courses across 15 modules: Programming Fundamentals and Object-Oriented Programming
  • Every exercise published in both C++ and Java, switchable in place, so the problem never changes, only the syntax notes and the starter template
  • A scored evaluation test that tells a student where they stand before they book
  • Curriculum stored as plain data files, so new objectives, exercises and whole courses are added without touching the app
  • Service and pricing blocks that end in a pre-filled WhatsApp message, plus a persistent contact button
  • Self-contained static build that runs without a framework, a backend or a third-party tracker
/ Specs
Type
Teaching & exercise platform
Stack
Static HTML, CSS & JavaScript
Client
Private tutor in Beirut, Lebanon
Scope
UI/UX design & web development
/ Results

The outcome.

84Exercises published
15Modules across two courses
C++ / JavaEvery exercise in both languages
ZeroFrameworks or dependencies
100%Responsive across devices
/ Measured

Numbers anyone can re-run.

Every figure below is a real reading from a standard tool anyone can re-run: Google Lighthouse for speed and quality, the W3C validators for the code itself. Each one says what it means for you in plain language.

Google Lighthouse scores out of 100

87PerformanceHow quickly the page becomes usable. Google scores it out of 100, and 90 or above counts as fast.
100Accessibility A11Y · WCAGHow well the page works for people using a screen reader, a keyboard, or high-contrast settings, checked against the WCAG standard.
100Best practices BPWhether the site follows the modern rules of the web: HTTPS everywhere, safe libraries, and a browser console with nothing thrown into it.
100SEOHow readable the page is to search engines: titles, descriptions, crawlable links and valid robots rules.

Loading & responsiveness Core Web Vitals

1.1 sFirst contentful paint FCPHow long before the visitor sees anything at all. Under 1.8 seconds is the target.
1.6 sLargest contentful paint LCPWhen the main image or headline has finished loading, which is the moment the page looks ready. Google wants this under 2.5 seconds.
0 msTotal blocking time TBTHow long the page ignores taps and clicks because it is still busy loading. Zero means it never freezes on the visitor.
0Cumulative layout shift CLSHow much the page jumps around while it loads. Zero means nothing moves under the reader's finger mid-tap.
0 msInteraction to next paint INPHow fast the page answers a tap. It is measured on real visitors over time; the lab stand-in shown here is total blocking time.

Code quality & weight standards, size, dependencies

3 KBHTML, compressed GZIP / BRThe weight of the page's own code as it actually travels over the network. Smaller is cheaper and faster on mobile data.
Not neededFont preloadWhether the custom typefaces are requested up front, so text never flashes in a fallback font before settling.
0W3C HTML errorsErrors found by the W3C's official markup validator. Zero means the code is standards-clean, which is what keeps a site working through future browsers.
0W3C CSS errorsThe same official check applied to the stylesheets. Invalid CSS is where most cross-browser display bugs begin.
0Third-party originsHow many outside servers the page pulls from. Every one is another company that can slow the page down, break it, or track your visitors.

Measured on the live site at ibrahim-hussein.com with Google Lighthouse 12.8.2 (desktop) and the W3C validators, August 2026.

/ More work

More case studies.

Bayader Investments case study by kaprera Bayader Investments Corporate website War Action Research case study by kaprera War Action Research Interactive research platform Agri Pro Services case study by kaprera Agri Pro Services Internal operations platform
/ Let's build something

Want results like these?

Book a call See more work