Selected work / 03
Qalb Zaker
Arabic RTL & motion design
An Arabic RTL landing page shaped around clarity, responsive design, and motion.
Challenge
Introduce an Arabic-first product through an interface that feels calm, legible, and natural in a right-to-left reading flow.
Approach
Designed and developed the landing page from scratch, with the hierarchy, RTL layout, responsive behavior, and motion working together.
Outcome
A live Arabic landing page that communicates the product clearly across desktop and mobile screens.
My role
I designed and built the landing page from scratch: visual direction, Arabic content hierarchy, HTML/CSS/JavaScript, responsive RTL layouts, and GSAP scroll animation. The application itself is outside this case study.
Key features
- Arabic right-to-left navigation, typography, and section layout
- Responsive layouts shown in the desktop and mobile captures below
- GSAP and ScrollTrigger animation with Lenis scrolling
- Product introduction, daily adhkar, feature, and FAQ sections
- App download and contribution links clearly marked as coming soon on the live page
How it works
- 01
Introduce the product
A clear Arabic hero and app artwork explain the product before visitors start exploring.
- 02
Build understanding
Daily adhkar, feature, and FAQ sections follow a right-to-left reading flow, with scroll-driven motion supporting the content.
- 03
Set expectations
Responsive desktop/mobile layouts keep the page usable. Coming-soon labels make the current status of app downloads explicit.