لوحة تنظّم مصروفك في بداية كل شهر، فتصل إلى رؤية واضحة لمصروفات الشهر وسجل يمكنك الرجوع إليه.
- نوع المشروع
- مشروع شخصي
- الأدوات
- ReactTypeScriptPostgreSQLTailwind
- السنة
- ٢٠٢٦
- الحالة
- منشور
- الموقع
- budgettr.com
رحلة المشروع
- نظرة عامة
Budgettr، مشروع شخصي صمّمته وبنيته من الطرف إلى الطرف. وهو لوحة لمصروفات الشهر مبنية بـReact وTypeScript وPostgreSQL وTailwind، وتعمل بالعربية والإنجليزية.
- المشكلة
كانت مصروفاتي موزّعة على طول الشهر دون رؤية واحدة تجمعها. فتتبّع المصروفات يعني التنقّل بين الملاحظات وكشف الحساب، ويظل هدف الادخار تخمينًا لا شيئًا يمكن قياسه.
- البحث والفهم
جرّبت تطبيقات الميزانية الموجودة أولًا. ولم يتعامل أيّ منها مع العربية والإنجليزية والريال السعودي بالشكل المطلوب، كما أنها مبنية حول تسجيل عملية لا حول الشهر بوصفه دورة. ولمّا بدأ آخرون باستخدامها، صارت شاشاتهم الأولى جولة البحث الثانية: كيف يبدو حساب جديد لا بيانات فيه بعد.
- الحل والعملية
بنيتها حول دورة شهرية، بتحديد الدخل والفئات في البداية، ثم تسجيل المصروفات عليها، ومتابعة هدف الادخار وهو يتحدّث مع مرور الشهر. والبديل الذي استبعدته هو استخدام تطبيق جاهز، للسبب أعلاه. وقد عاملت النسخة الأولى الشاشات الفارغة كحالة هامشية فبدت معطّلة، فأُعيد بناء كل حالة فارغة لتسمّي الإجراء الذي يملؤها ولتبقي المجاميع عند ٠٫٠٠ ريال بدل أن تختفي.
- النتيجة
لوحة تعمل فعليًا تغطي الدخل وميزانية كل فئة والفواتير والأهداف باللغتين، وبوضعين نهاري وليلي. والصور أدناه في مجموعتين: التطبيق وفيه بيانات شهر كامل، ثم الحالات الفارغة التي يبدأ منها المستخدم الجديد.
- الأثر
يستخدمها ٢٧ شخصًا، وهي أداتي اليومية أنا أيضًا، ومن هناك جاءت تذكيرات الفواتير والحالات الفارغة أصلًا.
- الخلاصة والدروس
استخدام ما تبنيه بنفسك يوميًا يكشف التفاصيل الصغيرة التي لا تلتقطها أي مواصفة مكتوبة. وما كنت سأغيّره: بناء الحالات الفارغة أولًا لا أخيرًا، فهي أول شاشة يراها كل مستخدم جديد، وقد كانت آخر ما صمّمته.
التطبيق وفيه بيانات شهر كامل
الحالات الفارغة، لأن أول شاشة يراها المستخدم الجديد بلا بيانات