Ali Omuom
Personal site for the CEO of CyberV. Bilingual editorial layout, Laravel back end, designed for written essays and speaking-engagement bookings, not a CV dump.
About the project.
A personal site for the CEO of CyberV, designed to read like a published essayist rather than a resume. The build is a Laravel back end with a bilingual editorial layout, structured for long-form writing and speaking-engagement bookings. I designed and built it end to end, paying close attention to Arabic typography, reading rhythm, and how the cover image of each essay carries the visual weight of the home page.
What we walked into.
The CEO of CyberV needed a personal site that read like a published essayist, not a resume — bilingual editorial layout, speaking-engagement bookings, long-form writing as the centre of gravity.
What we did.
Laravel back end + bilingual editorial layout. Designed for written essays first, speaking bookings second, "about" page third. Arabic typography weighted as carefully as English.
What it became.
Personal essay surface that reads like a magazine column. Speaking inquiries routed via structured form.
My role on this project.
Solo · 100% — design + Laravel back end + bilingual editorial layout + speaking-engagement form. Client supplied essays + brand direction; everything else is mine.
Designer (editorial)
Magazine-column reading rhythm. Arabic + Latin typography paired carefully. Essay cover images carry the visual weight of the home page.
Backend engineer (Laravel)
Bilingual essay model, draft → publish workflow, cover-image pipeline, speaking-bookings inbox.
Performance engineer
Editorial-grade reading typography is heavy on font weight; web-font subsetting kept first-paint under 1s.
The numbers that matter.
- EssaysCentral content typeNot "blog posts" — essays. Different reading rhythm, different metadata, different display.
- Bilingualar/en parityEach essay can be published in either language or both; never machine-translated.
- <1sFirst paintWeb-font subset (Latin only) + Arabic fallback chain; hero image lazy-loaded.
- StructuredSpeaking bookingsForm captures event date, audience size, topic; routes to assistant inbox.
What was actually broken.
Most CEO personal sites are vanity resumes — chrome, awards lists, photo galleries. The CEO of CyberV writes seriously about leadership and engineering, and he wanted a site that respected that. The brief was a site that, when someone landed on it, made them want to read — not scroll past to find a "contact" button.
The hard surface area.
- 01Editorial typography that holds attention across 1,500-word essays in both Arabic and English.
- 02Cover-image discipline — every essay has one, and it carries the visual weight of the home page.
- 03Speaking-bookings form that captures the structured fields needed (date, audience, topic) without feeling transactional.
Engineering wins worth naming.
Bilingual reading rhythm
Arabic body-text needs 1.85+ line-height; Latin needs 1.55. Designed two reading-rhythm presets, switched per locale, sharing the same essay grid.
Cover-image weight
Each essay cover is a hero on the home page when featured. Photographer-grade aspect ratio (3:2), srcset for retina, blur-up placeholder for slow connections.
How the system is wired.
Edge tier
Application tier
Data tier
The decisions behind each choice.
Laravel over headless CMS
- Single-author essay site does not need a separate CMS service. Laravel + a Filament admin is enough.
- Editor surface stays at the same domain as the public site, on the same login.
Editorial typography over generic Tailwind
- Generic Tailwind type-scale is fine for SaaS. For a writing site, the scale needs hand-tuning per locale.
- Arabic body text is its own design problem with its own answers.
What the build taught us.
- When the content is the product, typography is the product. Spend the time.
- Bilingual is not "translate the strings." It is two reading-rhythm systems sharing one grid.
