قمت بعمل صفحة الدخول و التسجيل و ربطها بقاعدة البيانات معينة
ثم قمت بتصميم الواجهة باستخدام bootstrap
و اود ارائكم في الواجهة لانني اظنها غير جميلة
و اريد اقتراحاتكم من فضلكم و السلام عليكم
برأيي لا داعي لأن تجمعَ بين خياري تسجيل حساب جديد وتسجيل الدخول في نفس الصفحة، اعزل كلَّ واحدٍ منهما في صفحة، أو اجعل خياراً للتنقّل بين أحدهما للآخر، فمعظم المواقع الشهيرة التي تهتم بالتصميم تضع زرّاً في form تسجيل االدخول من أجل إنشاء حساب جديد (في حال أنّ المستخدم لا يملك حساباً)، والعكس أيضاً، فيتم وضع زر في form إنشاء حساب جديد من أجل تسجيل الدخول (في حال أنّ المستخدم لديه حساب مسبقاً).
وتكون عملية الانتقال بين الصفحتَين (أو بين الفورمَين) عملية سلسلة وجميلة وفيها حركات انسيابية.
انظر إلى هذا المثال إن أردت:
الكلمات الأولى من كل جملة يجب أن تكون مبدوءةً بحرف كبير.
الـ placeholder طويل، فلا داعي لوضع عبارة "enter your xyz"، يكفي وضع اسم الحقل، أو يفضّل أن تستعيض عن ذلك بوضع label لكل حقل للدلالة على ما يجب تعبئة الحقل به.
تحتاج حقل إضافي من أجل تأكيد كلمة المرور في form إنشاء حساب جديد.
تحتاج زر "هل نسيتَ كلمة السر؟" في حقل تسجيل الدخول، فهذا الأمر يجب مراعاته في التصميم كي لا تضطر لاحقاً لإضافته عند الحاجة فيتشوّه التصميم.
إذا أردت جعل خلفية الـ form شفافة فاجعل لونها وألوان صورة الخلفية متناسقة مع بعضها، واختر ألواناً للخطوط تكون متناسقة مع كل ما سبق.
تستسطيع -كخيارٍ إضافي- أن تتلاعب بشكل الحقول، فيمكنك إلغاء إطاراتها الخارجية أو أن تضيف إليها animation معينة عند الضغط عليها.
ربما تجدها ملاحظات كثيرة أو مبالغ فيها، ولكن بالنسبة لأي شركة أو عميل فإنّ التصميم مهم جداً وتجربة المستخدم تستولي على اهتمامهم.
بالتوفيق
شكرا لك على المعلومات القيمة
سوف احاول القيام بها ثم مشاركته من جديد
لكن هناك سؤال لماذا يجب وضع كل فورم وحده و شكرا
يُفضّل (وليس يجب) من باب جمالية التصميم.
الـ form الخاص بإنشاء حساب جديد يحوي 4 حقول (اسم المستخدم والإيميل وكلمة السر وتأكيد كلمة السر)، أما form تسجيل الدخول يحوي حقلَين فقط (الإيميل وكلمة السر).
عندما تضع الفورمَين بجانب بعضهما ستظهر المساحات الفارغة في form تسجيل الدخول بشكلٍ واضح مقارنةً بالـ form الآخر، فستضطر لملء الفراغات أو تجعل الخط أكبر أو تقوم بتكبير الأزرار أو الحقول حتى يتم التناسق في المظهر، وهذا بالطبع يؤثر بشكلٍ سلبي على التصميم.
لذلك، إمّا أن تفصل الفورمَين عن بعضهما، أو يجب أن تجدَ طريقة مناسبة لتناسق المظهر.
التعليقات