Sharef: an Arabic-first website built on one 30° rule

Sharef builds and sells homes in Riyadh. The brief was a full website rebuild from a Figma file: a homepage that sells, project pages that answer a buyer's questions, and the company pages, in Arabic and English.

The Sharef mark is drawn on an isometric grid, so that grid became the whole visual language. Image masks, card corners, button sweeps and the 3D numbers model all use the same 30° cut. Section colours follow the light of a Riyadh day.

UI and UX design, the design system, content writing in both languages, front-end development and QA.

Arabic first, not Arabic as a mirror: each language has its own copy, line breaks and type sizes.

Every homepage section reads in one screen, from 1280×720 to 1920×1080.

One button system: four roles, two heights, and one hover where the arrow lifts to the brand's diagonal.

A clearer project filter: one control for status, a labelled list for type, and options that return nothing are disabled.

A homepage and 12 inner pages in both languages, with a documented design system.

Imagery generated with Gemini and art-directed to the brand. Forms run in demo mode.