All work

Client

Sakin

A calm landing page for Sakin, a focus and study brand, in English and Arabic.

  • Websites
Year
2026
Role
Design and front-end
Tools
React, TypeScript, Vite, Tailwind CSS, Vitest
See it live

The story

  1. The About section, with three values beside a short story of the brand

    01

    Problem

    Sakin is a calm space for focused study. It needed one marketing page that speaks to students in English and in Arabic and feels as quiet as the brand.

  2. The same hero in Arabic, laid out right to left

    02

    What I did

    I designed and built the page in React and TypeScript, with every line of copy in both languages. The language switch flips the whole layout to right to left and is remembered for the next visit.

  3. The study path in three steps, prime the session, go deep and review gently

    03

    Result

    A quiet page with a hero, a three-step study path, a journal and a contact block. The hero video loads only when the browser is idle, and it is skipped for reduced motion and Save-Data.

About the project

Sakin is a focus and study brand with a simple idea: good studying is not more hours, it is clearer attention. The page keeps that tone, with soft blues, slow motion and short copy.

Vitest checks the default language, the saved language choice, the page direction and the hero video settings.

Want something like this?

Tell me what you need, and we can plan it together.

Message me on WhatsApp

Motion