OS

Reem Sharaf Portfolio

A cinematic portfolio for an AI researcher and university lecturer.

Reem Sharaf Portfolio, screen 1 of 8
Overview

The story

A cinematic one-page portfolio for Eng. Reem Sharaf, software engineer, AI researcher and lecturer. Sections swap in place, each with its own transition.

Built with plain HTML, CSS and JavaScript, so it is very light and fast. An RS logo draws itself with a loading counter before a curtain opens. Every section has its own design and its own entrance: a door opening, a fall from above, a circular lens, a page flip and more. Every section also has its own indexable page.

What I built
  • Intro where the RS logo draws itself, then a curtain opens
  • A different entrance for every section
  • 48 skills across 7 fields, each with its icon
  • Certificates gallery with zoom
  • A separate indexable page for every section
  • Full structured data: Person, ProfilePage, FAQ and more
48Skills shown
10Unique transitions
0External libraries

Built with HTML / CSS / JavaScript / JSON-LD / Vercel

Design system

Style guide

The fonts and colours behind Reem Sharaf, chosen to fit the brand and its audience.

Typography

  • UnboundedDisplay headings
  • ManropeBody text
  • CairoArabic text
  • JetBrains MonoLabels and code

Colour palette

Tap a colour to copy its code.

Have a project like this?Let's talk