18 موقعًا للتجارة الإلكترونية مع تصميم UX بلا عيوب (و 3 أسماء كبيرة تمتصها)

إذا انضممت إلينا في مقالة UX لدينا في وقت سابق من هذا الشهر ، فستعرف أننا ناقشنا 25 عنصرًا أساسيًا لتصميم UX لموقعك على الويب.


الفكرة الأساسية هي: تصميم UX هو كل شيء عن الدخول إلى رأس الزائر. يتعلق الأمر بإنشاء تجربة بسيطة وسلسة وممتعة للمستخدمين. الفكرة هي توصيل المعلومات بسرعة وحتى جعلها تبتسم.

يعمل تصميم UX الجيد على إثارة الدوبامين والسعادة لدى زوارك. وهذا يجعلهم أكثر ثقة في الثقة بك. بشكل حاسم ، يجعلهم أكثر عرضة للشراء منك.

بعد استعراض 25 أساسيًا في مقالة تصميم UX الأخيرة ، دعنا نلقي نظرة على كيفية عملها. على وجه التحديد ، نحن ننظر إلى تصميم UX لمواقع التجارة الإلكترونية.

كيف تستخدم مواقع الويب هذه حيل تصميم UX ذكية لتشجيع زوارها على الشراء?

1. أسوس

أستخدم مثال أسوس كثيرًا ، ولكن هناك سبب وجيه لذلك. تصميم UX رائع.

كل شيء يبدأ بمقترح قيمة مقلوب. صورة رائعة ، وشرح بسيط ، وضمان “التوصيل المجاني” ، والعبارات الواضحة للعمل التي توجهك إلى قسم الرجال أو النساء.

asos2

واحدة من ميزات UX المتميزة هي منصة عرض الفيديو ، حتى يتمكن الزوار من رؤية شكل الزي. يمنح العملاء أفضل عرض ممكن للعناصر ، ويمنحهم الثقة للشراء.

لديهم أيضًا ميزة جديدة ممتازة تسمى “العرض السريع”. في صفحة المنتج ، تضغط على “عرض سريع” وتظهر نافذة منبثقة صغيرة مع صور إضافية وجميع المعلومات التي تحتاجها. يوفر على العميل النقر ذهابًا وإيابًا إلى صفحات مختلفة. تصميم بسيط وبديهي.

آسوس

2. زارا

موقع Zara الإلكتروني هو دروس متقدمة في البساطة. نظيفة وبديهية ومحدودة. إنها قصيدة ل قانون هيك: مبدأ تصميم يحد من خيار التنقل ويعطي المستخدم خيارات واضحة ولكن مقيدة.

الفكرة هي أن العديد من الخيارات سوف تربك الزائر. من خلال تقديم خيارات أقل ، يشعرون بمزيد من الثقة. سنلقي نظرة على المزيد من التنقل الممتاز خلال هذا المنشور ، لكن Zara’s هي واحدة من الأفضل.

زارا

3. أعلاه

يستخدم Abof (All About Fashion) خدعة UX ذكية بشكل واضح على موقعه على الويب. اضغط على الصفحة الرئيسية ، ولا يبدو موقعًا تقليديًا للتجارة الإلكترونية. بدلاً من ذلك ، تبدو أشبه بمدونة. إنها مليئة بالمحتوى الغريب الذي يلهم جمهورها.

أعلاه

في قصصهم ومقالاتهم ، يسلطون الضوء على الملابس في قسم بارز يسمى “تسوق القصة”. في مقالة UX السابقة ، تحدثنا عن أهمية إنشاء علاقة مع جمهورك. Abof يفعل ذلك بشكل مثالي مع القصص والمحتوى المرتبط.

أعلاه 2

فقط عندما يتم إلهام العميل ، يحاولون بيع شيء ما.

في صفحة المنتج الخاصة بهم ، لديهم ملاحظات “نصائح أنيقة” مفيدة ، وهي أمثلة مثالية على “التفاعلات الدقيقة” – قطع صغيرة تصل إلى جمهورك وتشركه.

أعلاه 3

لاحظ أن لديهم أيضًا “دليل المقاسات” لمساعدة العملاء في الحصول على قياساتهم بدقة (الخوف من عدم ارتداء الملابس هو أحد أكبر أسباب التخلي عن عربات التسوق). كما يستخدمون قسم “التسليم المقدر” لمنح العملاء المزيد من المعلومات.

4. برجهاوس

برجهاوس هي علامة تجارية للملابس في الهواء الطلق ، لكنك ستعلم ذلك في غضون الثانية الأولى من الهبوط على موقعها.

برجهاوس

هذه علامة تجارية تفهم تمامًا جمهورها المستهدف ، وتتأكد من التواصل معهم في أسرع وقت ممكن. لقطة البطل الأولى هي دعوة ملهمة. إنه يتصل بالمجتمع ويغريك.

الجانب السلبي الوحيد؟ إن عبارة قوية تحث المستخدم على اتخاذ إجراء ستغلق الصفقة هنا حقًا.

5. تفاحة

كنت تتوقع من شركة تضع التصميم والابتكار في صميمها أن تتفوق في تصميم UX ، وهم يفعلون ذلك. تحقق من صفحات منتجاتها لبداية.

هم يستخدمون التمرير المنظر لجعل الصور ديناميكية ، وجذب المستخدم ، وإزالة أي نقاط خروج. أنت منغمس في عالم Apple.

لقطة شاشة يوم 28 يوليو الساعة 8.43.00 ص

تظهر لك الرسوم المتحركة الذكية كيف تعمل المنتجات بالضبط ، مثل اللمسة ثلاثية الأبعاد الجديدة. تدعوك معارض التمرير إلى التفاعل والاستكشاف ، وتخبرك نسخة ذكية بالضبط كيف سيحسن iPhone الجديد حياتك (بدلاً من قائمة طويلة من الميزات).

تنقلها بسيط ونظيف ، وأنا أحب استخدامها للصور لزيادة التمييز بين الخيارات (نحن نفحص الويب ، لذلك عادة ما تكون الكلمات مزجها مع بعضها البعض)

التفاح 2

خلال عملية الخروج ، يمنحك خيار الدردشة مع أخصائي أثناء الشراء. إنها خدعة بسيطة ولكنها مفيدة. إنه يقدم للمبتدئين بعض المساعدة عبر الخط ، ولكنه لا يعيق المشترين الواثقين من إخراج بطاقتهم الائتمانية.

6. بيلروي

بصفتك بائعًا جديدًا للتجارة الإلكترونية نسبيًا ، فإن مهمتك الأولى تتمثل في توضيح مدى اختلافك عن الآخرين. تقوم شركة Bellroy بذلك بشكل مثالي مع مجموعتها من المحافظ الرفيعة والمضغوطة.

bellroy 3

والأفضل من ذلك ، على صفحات منتجاتها ، تحتوي كل محفظة على مقطع فيديو خاص بها ، يعرض للعملاء جميع الميزات الفريدة.

بيليروي 4

7. إيجار المدرج

يمتلك The Rent The Runway مفهومًا فريدًا جدًا: فأنت تقترض ثوبًا أو زيًا لبضعة أيام ، بدلاً من شرائه. يعد هذا أمرًا رائعًا لحفلات الزفاف أو الأحداث التي لا ترغب في ارتداء ملابس قد لا ترتديها مرة أخرى.

يقدم الموقع المفهوم ببساطة ، ثم يدعو تفاعل المستخدم ، مما يدفعهم إلى اختيار المناسبة.

إيجار المدرج

علامات إضافية لتقويم التسليم الخاص بهم أيضًا ، مما يتيح للعملاء معرفة وقت وصول الزي بالضبط ومتى يجب إعادته.

إيجار المدرج 2

بسيطة للغاية ، ولكنها مطمئنة للغاية.

8. الأمازون

أمازون هو أكبر موقع للتجارة الإلكترونية في العالم ، وبصراحة هو واحد من أفضل المواقع. يمكنك اختيار أي من ميزاتها كمثال على تصميم UX.

من حزمهم الذكية إلى توصيات عملائهم ، فإنهم يتوقعون احتياجات مستخدميهم ويقدمونها. ومع ذلك ، فإن نظام الطلبات بنقرة واحدة هو الذي نسلط الضوء عليه اليوم.

أمازون

لا يزال أفضل مثال على كفاءة الدفع على الويب. يعتبر تصميم عربة التسوق وعملية الخروج من جوهر تصميم UX للتجارة الإلكترونية. كلما كان سلاسة أفضل. ولا تصبح أكثر سلاسة من الطلب بنقرة واحدة!

9. رعي

صورة تخبرك بكل ما تحتاج إلى معرفته. الصياغة والتصميم بشخصية. خصم فوري للمستخدمين الجدد وعبارة كبيرة تحث المستخدم على اتخاذ إجراء.

خدش

هذا درس بسيط في تصميم UX.

10. توب شوب

المتاجر التي تبيع الكثير من المنتجات لديها مهمة أكثر صعوبة عندما يتعلق الأمر بتصميم UX. كيف يمكنك تنظيم كل بنطلون جينز مختلف وتقديمه?

لحسن الحظ ، لدى TopShop خطة رائعة. باستخدام قرص تصفية كبير مكتنز يطفو مع الصفحة ، يمكنك إجراء تعديلات مستمرة على نمط منتجاتك ولونها وتناسبها وسعرها.

توب شوب 2

حتى أكثر برودة ، يتحول كل منتج إلى صورة للنموذج يرتديها عند التمرير فوق الماوس. يشجع على التفاعل ويعطي العملاء نظرة أفضل على العناصر.

11. الاحتجاج

قد يكون لدى الاحتجاج أكبر وأكبر تصفح على الويب.

ص

إنها واضحة ومقتضبة ومرتبة. كما أنه يقلل من فرصة تجول العميل. يحافظ اللون الأزرق على انتباه العميل في المكان الذي يريده.

تستخدم الاحتجاجات أيضًا الكثير من الرسوم المتحركة الصغيرة عبر موقعها. يتم تشغيل كل واحد عند التمرير فوقه. يحافظ على اهتمام العملاء ، ويشجع على التفاعل ، ويجعل الموقع بأكمله يشعر بالديناميكية.

12. نظرة جديدة

تحصل New Look على مكان في القائمة لسلالتها المبتكرة. يجلس على شريط التنقل الخاص به في جميع الأوقات مع مؤشر جريء لتذكيرك أنه موجود.

نيو لوك 2

عندما تنقر عليها ، فإنها لا تجذبك إلى صفحة مختلفة. بدلاً من ذلك ، تحصل على لوحة منزلقة تتحرك من الجانب لتظهر لك ما في حقيبتك. هذا يعني أن العملاء لا يضيعون أبدًا ، ويمكنهم الخروج بسهولة متى شاءوا.

مظهر جديد

13. قلم رصاص ، بنسبة 53

إذا كنت ستبيع قلمًا بسعر 60 دولارًا تقريبًا ، فعليك بيعه حقًا! لحسن الحظ ، “قلم رصاص” ، بقلم 53 ، يقوم بعمل ممتاز ، باستخدام عدد من حيل تصميم تجربة المستخدم.

يستخدمون صفحة تمرير طويلة ومتوازية لشرح جميع الميزات ويوضحون لك بالضبط ما يمكنك القيام به به.

قلم رصاص 2

يستفيدون أيضًا من المراجعات الرائعة لشرح سبب كونهم أفضل بكثير من الخيارات الأخرى الموجودة. يعد استخدام اقتباس من “Wired” حيلة رائعة لمنح مصداقية المنتج وتحديد فائدته.

قلم

14. Farmdrop

في مقالنا الأخير حول تصميم تجربة المستخدم ، أوضحنا مدى أهمية التعاطف مع جمهورك المستهدف والتواصل معهم. يقوم Farmdrop بذلك عن طريق وضع بيان مهمتهم في المقدمة والمركز.

مزرعة

إنهم “سئموا وتعبوا من رؤية الطعام من مصادر بعيدة”. هذا شيء يمكن لمعظم العملاء الانضمام إليه. قبل أن يحاولوا بيعك أي شيء ، يتواصلون معك ، ويعطونك سببًا للشراء.

15. سيد ماشبورن

مجرد قائمة منسدلة رائعة أخرى ، كاملة برموز صغيرة. إنها خدعة بسيطة تساعدنا على فهم قائمة واسعة النطاق. بالإضافة إلى ذلك ، يمنح الموقع شخصية أكثر قليلاً.

أيقونات

16. ساعات بطيئة

هذه ساعة بيد واحدة فقط. إنه مفهوم فريد من نوعه ، لذلك يحتاج إلى شرح! تعمل Slow Watches بشكل جيد مع فيديو شرح ملء الشاشة.

ساعات بطيئة

بالإضافة إلى شرح المفهوم ، يتحدثون أيضًا من خلال فلسفتهم وراء إنشائه (رائعة للتواصل مع العميل) ، ويستخدمون صورًا جميلة تبرز وتستهدف جمهورهم المثالي.

17. Firebox

عندما لا تتناسب سلعك مع الفئات العادية ، كن مبدعًا! يتخصص Firebox في الهدايا غير العادية والعناصر غير المعتادة. أفضل 50 مخططًا هي الطريقة المثالية لاستكشاف منتجاتهم الأكثر شعبية.

الصور

يُعد تخطيط الصندوق رائعًا للتصفح بسرعة عبر المنتجات ، والعديد من الصور ديناميكية ومتحركة وتتفاعل مع العميل.

نظرًا لأنهم متخصصون في الهدايا ، فإن لديهم أيضًا “مكتشف الهدايا” في شريط التنقل الخاص بهم ، وهي طريقة رائعة لتضييق الخيارات.

18. كسول عوف

غالبًا ما يبدو التسوق عبر الإنترنت متشابهًا تمامًا ، وسيفتقد الكثيرون العملية القديمة للنقر من خلال مجلة أو كتالوج.

Lazy Oaf يعيد هذا مع قسم “كتب البحث” الرائع. بدلاً من وضع الملابس واحدة تلو الأخرى ، تظهر الملابس في مجموعات مختلفة في وقت واحد. بعد كل شيء ، هكذا كانوا ينظرون في الكتالوج.

عوف كسول

انقر على الصور وستحصل على مربع “شراء سريع” لاختيار كل عنصر من العناصر الثلاثة المعروضة. إنها طريقة أكثر عمقًا وطريقة غامرة للتسوق.

ما الذي عليك عدم فعله!

لا نود أن نمزق مواقع الويب الأخرى إلى أجزاء ، ولكن هناك بعض الأسماء الكبيرة التي تخطئ تمامًا … إليك واحد أو اثنين من أسوأ المجرمين.

1. بيت فريزر

إنهم أحد أكبر المتاجر في العالم ، لكنهم يرتكبون خطأً فادحًا بمجرد تحميل موقع الويب الخاص بهم.

على الفور ستظهر لك نافذة منبثقة بملء الصفحة تطلب منك الاشتراك في النشرة الإخبارية الخاصة بهم.

هورس فريزر

على الرغم من كونها متجرًا كبيرًا للأسماء ، إلا أنها طريقة سريعة للغاية ستؤدي إلى إبعاد معظم المتسوقين. تذكر ، هذا هو الانطباع الأول. من الأفضل إنشاء رحلة مستخدم لتعليم وإلهام الزائر قبل طلب عنوان بريد إلكتروني.

ليس هذا فقط ، ولكن لا يوجد حافز حقيقي للتسجيل في نشرتهم الإخبارية. سيكون خصم رمز القسيمة خيارًا رائعًا هنا ، وقد يساعد العملاء على مسامحة النافذة المنبثقة الغازية.

2. وول مارت

يواجه Wal Mart تحديًا صعبًا. إنهم يبيعون كل شيء تقريبًا ، فكيف يمكنك تصنيفه وجعله بسيطًا؟ حسنًا ، لست متأكدًا … ولكن ليس هكذا …

جدار مارت

لسوء الحظ ، هذه مجرد فوضى من الفئات يكاد يكون من المستحيل العثور على ما تبحث عنه.

هناك ببساطة الكثير من المعلومات الجارية هنا. عندما تقدم للمستخدمين العديد من الخيارات ، غالبًا ما يصيبهم بالذعر ويغادرون.

3. راي بان

هذا خيار متوسط ​​قليلاً ، لأن معظم موقع Ray-Ban سهل الاستخدام للغاية. في الواقع ، لديها الكثير من الميزات الرائعة.

ومع ذلك ، فإنهم يفعلون شيئًا تفعله العديد من مواقع التجارة الإلكترونية مما يزعج العملاء حقًا. هذه:

حظر الأشعة

ربما رأيت صفحة مثل هذه مائة مرة. لا يبدو الأمر سيئًا للغاية ، ولكنه في الواقع يخلق حاجزًا آخر أمام البيع.

إذا كنت عميلاً عائدًا ، فأنت مشغول الآن تتساءل عن كلمة المرور التي أنشأتها. إذا كنت لا تستطيع تذكره ، فسيتعين عليك إجراء عملية “كلمة المرور المنسية” بأكملها. قد تفقد هذا العميل في أي وقت …

إذا كنت عميلًا جديدًا ، فهناك خدمة دفع ضيف ، بالتأكيد ، ولكن كل ما فعلته هو منحهم زرًا آخر للنقر. فرصة أخرى للنقر بعيدا.

عند هذه النقطة ، يتم فصل عميلك تمامًا عن سلة التسوق وعملية الشراء. لا تسحبه للخارج ، فقط أغلق عملية البيع!

تصميم UX الرائع يدور حول التعديلات الصغيرة التي تجعل الأشياء أسهل لعملائك. هذه المواقع الـ 18 تقوم بذلك بشكل مثالي.

الميزات التي ستستخدمها على موقع الويب الخاص بك?

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map