Veghnar Tonvair — a brand book, turned into a living storefront.Veghnar Tonvair — دليل هويةٍ، تحوّل إلى متجرٍ حيّ.

Veghnar Tonvair is a fragrance house selling online. I was handed two things: a Shopify store that worked but looked like every other Shopify store, and the client's brand identity file. My job was the distance between them — turning a static identity document into a storefront that actually behaves like the brand, in Arabic, on a real shop taking real orders.Veghnar Tonvair بيتُ عطورٍ يبيع عبر الإنترنت. سُلّمتُ شيئين: متجراً على Shopify يعمل لكنه يشبه كلّ متاجر Shopify الأخرى، وملفَ الهوية البصرية الخاص بالعميل. وكان عملي هو المسافة بينهما — تحويلُ مستند هويةٍ ثابت إلى متجرٍ يتصرّف فعلاً كالعلامة، بالعربية، على متجرٍ حقيقيٍّ يستقبل طلباتٍ حقيقية.

My roleدوري

Storefront redesign + buildإعادة تصميم المتجر وبناؤه

Given to meما سُلِّم لي

A pale store + the client's identity fileمتجر باهت + ملف هوية العميل

Industryالقطاع

Fragrance · Retailعطور · تجزئة

Platformالمنصّة

Shopify — Dawn 14 baseShopify — على أساس Dawn 14

Primary languageاللغة الأساسية

Arabic · RTL (English second)العربية · من اليمين لليسار (والإنجليزية ثانياً)

Supportمساندة

An assisting engineer fixed some logic bugsمهندس مساعد أصلح بعض أخطاء المنطق

An identity file tells you what the brand looks like standing still: a logo, a palette, a serif, a mood. It does not tell you what a two-column product grid looks like on a phone, how a customer compares two perfumes, what the checkout bar should feel like under a thumb — and it almost never says anything about Arabic. That gap is the actual work, and it is where a store either becomes the brand or stays a template wearing its colors.ملفُّ الهوية يخبرك كيف تبدو العلامة واقفةً ساكنة: شعارٌ، ولوحةُ ألوان، وخطٌّ سيريفي، ومزاج. لكنه لا يخبرك كيف تبدو شبكةُ منتجاتٍ بعمودين على الهاتف، ولا كيف يوازن العميل بين عطرين، ولا بأيّ إحساسٍ ينبغي أن يكون شريط الشراء تحت الإبهام — ولا يقول شيئاً عن العربية تقريباً أبداً. تلك الفجوة هي العمل الحقيقي، وفيها إمّا أن يصبح المتجر هو العلامة، أو يبقى قالباً يلبس ألوانها.

Came with the briefجاء مع الموجز

Marks, palette, Latin typeالشعارات، الألوان، الخط اللاتيني

Missing entirelyغائب تماماً

Arabic type, RTL, product UXالخط العربي، الاتجاه، تجربة المنتج

Starting pointنقطة البداية

A generic Shopify themeثيم Shopify عامّ

Targetالهدف

A store that reads as a maisonمتجر يُقرأ كبيت عطورٍ

Shopify themes rot in a predictable way: a colour here, an override there, until the same button exists in five slightly different versions. So the redesign is not scattered across the theme editor — it lives in a single identity stylesheet, versioned and commented, that the whole shop reads from. A calm white canvas, one deep-burgundy accent reserved for actions, a centred serif display, underlined links. One place to change the brand; every page follows.ثيمات Shopify تتعفّن على نحوٍ متوقّع: لونٌ هنا، وتجاوزٌ هناك، حتى يوجد الزرُّ نفسه بخمس نسخٍ متفاوتةٍ قليلاً. لذا لم تتوزّع إعادة التصميم في محرّر الثيم — بل تعيش في ملف هويةٍ واحد، مُرقَّمِ الإصدار ومُعلَّق، يقرأ منه المتجر كلّه. قماشةٌ بيضاء هادئة، ولونٌ عنّابيٌّ عميقٌ واحد محجوزٌ للأفعال، وعرضٌ سيريفيٌّ موسّط، وروابط مسطَّرة. مكانٌ واحد لتغيير العلامة، وكلّ الصفحات تتبع.

Click to zoomاضغط للتكبير

Most Arabic Shopify stores are an English store flipped: the layout mirrors, but the type stays a default face that was never drawn for Arabic. The result reads as a translation, and customers feel it before they can name it.أكثر متاجر Shopify العربية متجرٌ إنجليزيٌّ مقلوب: ينعكس التخطيط، لكن الخطّ يبقى خطاً افتراضياً لم يُرسم للعربية قطّ. فتُقرأ النتيجة كترجمة، ويشعر العميل بذلك قبل أن يعرف كيف يسمّيه.

Because the identity file only spoke Latin, the Arabic voice was mine to build. The store runs on four faces, paired deliberately: an Arabic display face for headings, a serif for Latin display, an Arabic body face for reading, and a script for the brand's signature moments. The Arabic locale file is by far the largest in the theme — the copy is written in Arabic, not filled in from English — and the live store opens right-to-left by default, with English as the second edition.ولأن ملف الهوية لم يتحدّث إلا اللاتينية، كان بناء الصوت العربي لي. يعمل المتجر على أربعة خطوط، مقترنةٍ بقصد: خطٌّ عربيٌّ للعناوين، وسيريفيٌّ للعرض اللاتيني، وخطُّ متنٍ عربيٌّ للقراءة، وخطٌّ راقنٌ للحظات توقيع العلامة. وملفُّ اللغة العربية هو الأكبر في الثيم بفارقٍ واسع — فالنصوص مكتوبةٌ بالعربية لا معبَّأةٌ عن الإنجليزية — والمتجر الحيّ يُفتح من اليمين لليسار افتراضياً، والإنجليزية نسخته الثانية.

Arabic displayعرض عربي

Arabic Typesetting

Arabic bodyمتن عربي

Tajawal

Latin displayعرض لاتيني

Cormorant

Signature scriptخط التوقيع

Roundhand

Default directionالاتجاه الافتراضي

RTL — Arabic is primaryمن اليمين لليسار — العربية أساسية

Second editionالنسخة الثانية

Englishالإنجليزية

Perfume is bought as a gift as much as for oneself, and the product page is built around that. Under the order block sits a gift layer — wrapping plus a hand-written card — so the ritual of giving is part of the purchase, not an afterthought at checkout. The order block itself offers two clear paths, order or buy now, in the brand's burgundy; and the catalogue presents each bottle in clean studio photography with quick-add, letting the scripted bottle names carry the shelf. These are decisions the brand book had no reason to contain.العطر يُشترى هديةً بقدر ما يُشترى للنفس، وصفحةُ المنتج مبنيّةٌ حول ذلك. تحت كتلة الطلب تجلس طبقةُ إهداء — تغليفٌ وبطاقةٌ مكتوبةٌ بخط اليد — فيصير طقسُ الإهداء جزءاً من الشراء لا فكرةً متأخّرة عند الدفع. وكتلةُ الطلب نفسها تعرض مسارين واضحين، اطلب أو اشترِ الآن، بعنّابيّ العلامة؛ ويقدّم الكتالوج كلَّ قارورةٍ بتصوير استوديو نظيف مع إضافةٍ سريعة، تاركاً لأسماء القوارير المخطوطة أن تحمل الرفّ. وهذه قراراتٌ لم يكن لدليل الهوية سببٌ ليحتويها.

Click to zoomاضغط للتكبير

Gift ritualطقس الإهداء

Wrapping + hand-written cardتغليف + بطاقة بخط اليد

Order blockكتلة الطلب

Two paths: order / buy nowمساران: اطلب / شراء الآن

Catalogueالكتالوج

Studio bottles + quick addقوارير استوديو + إضافة سريعة

Measurementالقياس

GTM + social pixels wiredGTM وبكسلات التواصل موصولة

This is the project that taught me the commercial half of design. A brand file is an opinion about how something should look; a live store is a place where that opinion meets a thumb, a slow connection, and a customer deciding in four seconds. Working inside someone else's identity — respecting it, then extending it exactly where it ran out, in Arabic — turned out to be a harder and more useful skill than designing from a blank page.هذا المشروع هو الذي علّمني النصفَ التجاريَّ من التصميم. ملفُّ الهوية رأيٌ في كيف ينبغي أن يبدو شيء؛ أمّا المتجر الحيُّ فمكانٌ يلتقي فيه ذلك الرأي بإبهامٍ، واتصالٍ بطيء، وعميلٍ يقرّر في أربع ثوانٍ. والعملُ داخل هوية شخصٍ آخر — احترامُها، ثم تمديدُها في الموضع الذي نفدت فيه بالضبط، بالعربية — تبيّن أنه مهارةٌ أصعبُ وأنفعُ من التصميم على صفحةٍ بيضاء.