كيف نصمّم apps.
Every product we ship starts as a Figma file, and the distance between that file and the App Store is the whole craft. This is the process, the principles, and the proof.
أربع قواعد لا نحيد عنها.
Our designers and engineers share a standup. Every screen drawn in Figma gets a look from the person who will build it, while it's still being decided rather than after it ships.
لا نصوص حشو، ولا أسماء مثالية تصادف أنها قصيرة كلّها. نصمّم ببيانات إنتاجية: أسماء عربية طويلة، وأرصدة من تسعة أرقام، وحالات فارغة، وحالات خطأ، وحالات دون اتصال.
RTL is designed as a mirror from the first wireframe, with typography, iconography and motion tuned for both scripts. If it only works in English, it isn't done.
Animation explains hierarchy and state. We cut anything that's just decoration, so every transition has a job to do before it ships.
من الموجز إلى الإطلاق، في ست خطوات.
Each step ends with something you can open, click, and judge for yourself, not a status update.
- 01Understand
الاكتشاف قبل البكسل
Workshops, user interviews and competitor teardown in FigJam. We leave with the user's actual job-to-be-done in writing, plus a list of features to drop because they don't serve it.
You getخريطة المشكلة + مسارات محدّدة النطاق - 02Structure
المسارات والمخطّطات الهيكلية
Every screen of every flow, low-fi and clickable. This is where we argue out the navigation and fix it cheaply, in grayscale, before anyone falls in love with a gradient.
You getنموذج أوّلي هيكلي قابل للنقر - 03تصميم
شاشات عالية الدقّة في Figma
محتوى حقيقي، باللغتين، وكل حالة حدّية. فاتح وداكن. مكوّنات مبنيّة بمتغيّرات وتخطيط تلقائي كي لا يكسر تغيير في النصّ أربعين شاشة.
You getHi-fi Figma file (a live link you can open) - 04Systemize
الرموز ونظام التصميم
Colors, type, spacing and radii become named tokens that match the codebase one-to-one. The Figma component library mirrors Storybook, down to the names, props and states.
You getنظام التصميم + تصدير الرموز - 05Validate
النمذجة، الاختبار، التعديل
النماذج الأوّلية التفاعلية تُعرَض على مستخدمين حقيقيين (Maze، وجلسات مُدارة) وعلى المستثمرين حين يكون ذلك الهدف. وتعود النتائج إلى الملفّ في الأسبوع نفسه.
You getتقرير قابلية الاستخدام + شاشات مُحسَّنة - 06Ship
تسليم ليس تسليماً
Engineers were in the file all along, with Dev Mode, annotated edge cases, and motion specs down to curves and durations. Design reviews every build until the shipped screen matches the drawn one.
You getواجهة إنتاج بتطابق البكسل
Figma في المركز.
One live file from kickoff to launch, with flows in FigJam, screens and tokens in Figma, parity with Storybook in code.
صُمِّمت هنا، وأُطلِقت هنا.
الفريق نفسه الذي رسم هذه الشاشات كتبها. افتح أيّاً منها لترى الشاشات والحزمة التقنية والقصّة.
لديك شيء يحتاج designing?
Two-week discovery sprint: workshops, flows, and a clickable prototype that's yours to keep either way.