https://virgool.io/Produxlab/feed جایی برای ساختن تجربه های بهتر fa 2026-04-14 10:47:06 https://files.virgool.io/upload/publication/c7cxukio2e35/bbkajs.png https://virgool.io/Produxlab https://virgool.io/Produxlab/%D8%A7%D9%84%DA%AF%D9%88%DB%8C-%D8%AE%D9%88%D8%A7%D9%86%D8%B4-f-%DA%86%DB%8C%D8%B3%D8%AA-%DB%8C%D8%A7-%D9%85%D8%AA%D9%86-%D9%87%D8%A7-%D8%B1%D8%A7-%DA%86%DA%AF%D9%88%D9%86%D9%87-%D9%85%DB%8C-%D8%AE%D9%88%D8%A7%D9%86%DB%8C%D9%85-vqu1ettn4w9g متن‌ها را چگونه می‌خوانیم؟این مطلب، ترجمه‌ی مفصل مقاله Nielsen Norman Group است که به بررسی الگوی خوانش F یا (F shaped pattern) می‌پردازد؛ اگر وقت‌تان محدود است و می‌خواهید کلیت ماجرا را متوجه شوید، می‌توانید در این پست اینستاگرام خلاصه مقاله را مطالعه کنید، اما اگر مشتاقید همه جزییات را بدانید با من همراه شوید:)تحقیقات ردیابی چشم نشان می‌دهد که کاربران، صفحات وب و صفحه نمایش موبایل را با الگوهای مختلف اسکن می‌کنند که یکی از آنها شکل حرف F است. و حالا یازده سال پس از کشف این الگو، امروز معنای آن را دوباره بررسی می‌کنیم. الگوی خواندن محتوای وب بر اساس شکل حرف F در سال 2006 توسط گروه Nielsen Norman که از گروه‌های پیشرو در حوزه تجربه کاربری است، شناسایی شده‌است. در طول سال‌ها، بسیاری از طراحان به این تحقیق گاهی به درستی اشاره کرده‌اند و در بسیاری از موارد، آن را اشتباه تفسیر کرده‌اند!در این مقاله، قصد داریم گزارشی از تحقیقات اخیر در مورد بازبینی مجدد این الگوی خوانش را ارائه دهیم و برخی از تصورات غلط مربوط به آن را روشن کنیم. مخصوصا می‌خواهیم این نکات را شفاف سازی کنیم که: کاربران همیشه صفحات وب را با الگوی F اسکن نمی‌کنند و الگوهای اسکن رایج دیگری مانند الگوی کیک لایه‌ای، الگوی نقطه‌ای، الگوی متعهدانه و... نیز وجود دارند. الگوی F تاثیر منفی برای کاربران و کسب وکارها دارد؛ چون ممکن است بعضی موضوعات مهم، هنگام اسکن مطالب، نادیده گرفته شوند. یک طراحی خوب می‌تواند از اسکن مطالب با الگوی F جلوگیری کند.این تصویر یکی از اولین نمونه‌های الگوی F است که در مطالعات اوایل دهه 2000 بدست آمده است. این نقشه حرارتی، مسیر حرکت چشمِ بیش از 45 کاربر را جمع‌آوری کرده است. قسمت بالای نقشه حرارتی که بیشتر از سایر قسمت‌ها خوانده شده (با رنگ قرمز نشان داده شده است) شبیه حرف بزرگ "F" است.الگوی F شکلدر الگوی اسکن F، در زبان‌های چپ به راست مانند زبان انگلیسی، تمرکز بیشتر روی قسمت بالا و سمت چپ صفحه است، به طور مشخص:1. کاربران ابتدا در یک حرکت افقی، معمولاً قسمت بالای مطالب را مطالعه می‌کنند که نوار بالای F را می‌سازد.2. در مرحله بعد، کاربران صفحه را کمی به سمت پایین حرکت می‌دهند و سپس در حرکت افقی دوم که معمولاً منطقه کوتاه‌تری را نسبت به حرکت قبلی پوشش می‌دهد، مطالب را می‌خوانند و به این ترتیب نوار پایینی F ساخته می‌شود.3. در نهایت، کاربران سمت چپ محتوا را در یک حرکت عمودی اسکن می‌کنند. گاهی اوقات این اسکن آهسته انجام می‌شود و به صورت یک نوار عمودی در نقشه حرارتیِ ردیابی چشم (eye tracking heatmap) ثبت می‌شود. الگوی خوانش F در زبان‌های چپ به راستپیامدهای این الگو عبارتند از:* خطوط اول متن در یک صفحه،نسبت به خطوط بعدی در همان صفحه، بیشتر دیده می‌شوند.* چند کلمه اول در سمت چپ هر خط، نسبت به کلمات بعدی در همان خط، بیشتر دیده می‌شوند.البته این نکته را در نظر داشته باشید که الگوی اسکن F به ندرت یک F کامل است! به عنوان مثال، در برخی موارد، ممکن است افراد به پاراگراف پایین صفحه علاقه‌مند شوند و روی کلمات بیشتری تمرکز کنند و دوباره به سمت راست برگردند، بنابراین این الگو شبیه E می شود!الگوی F مربوط به بخش محتوای صفحه وب است. بنابراین، رفتار افراد را هنگام بازدید از یک صفحه وب و ارزیابی محتوای آن توصیف می‌کند، نه وقتی که در بخش جدیدی از وب‌سایت هستند و نویگیشن بار (معمولا در بالا یا سمت چپ صفحه) را بررسی می‌کنند تا تصمیم بگیرند کجای صفحه بروند.بنابراین، در الگوی F، توجه به سمت چپ محتوا جلب می‌شود، نه سمت چپ کل صفحه؛ مثلا اگر سمت چپ صفحه، نویگیشن ریل (navigation rail) قرار گرفته باشد، در الگوی خوانش F این قسمت لحاظ نمی‌شود.تحقیقات اخیر، نشان می‌دهد که الگوی اسکن F در دنیای امروز- هم در دسکتاپ و هم در موبایل- همچنان پابرجاست. این مورد یک مثال معمولی از طول عمر یافته‌های UX (تجربه کاربری) است که نشان می‌دهد نتایج مطالعات تجربه کاربری، بیشتر وابسته به رفتار انسان است تا فناوری.بر اساس تحقیقات اخیر، در زبان‌های راست به چپ مانند فارسی و عربی، شکل F برعکس است، یعنی توجه بیشتر به خط اول و کلمات سمت راست معطوف می‌شود. الگوی خوانش F در زبان‌های راست به چپ الگوی خوانش F ، تنها الگوی موجود نیست!علاوه بر الگوی F ، الگوهای دیگری از جمله موارد زیر وجود دارند: الگوی کیک لایه‌ای: وقتی که کاربر عنوان‌ها و زیرعنوان‌ها را اسکن می‌کنند و از مطالعه متن کلی چشم‌پوشی می‌کنند. الگوی نقطه‌ای: پرش از قطعه‌های بزرگ متن و اسکن کردن مطالب به نوعی که انگار دنبال چیزی خاص هستید؛ مانند لینک، اعداد، یک کلمه خاص یا مجموعه‌ای از کلمات با شکل متمایز (مانند آدرس یا امضا). الگوی علامت‌گذاری: متمرکز نگه داشتن چشم‌ها در یک مکان، در حالی که با موس صفحه را پیمایش می‌کنید یا با انگشت صفحه را اسکرول می‌کنید. این الگو در موبایل بیشتر از دسکتاپ انجام می‌شود. الگوی دور زدن: زمانی اتفاق می‌افتد که چندین خط با یک کلمه یکسان شروع می‌شود و افراد اولین کلمات آغازین خطوط را نادیده می‌گیرند. الگوی متعهدانه: تمرکز روی تقریباً همه چیز در صفحه!اگر کاربران به محتوا علاقه‌مند باشند، تمام متن در یک پاراگراف یا حتی یک صفحه را کامل می‌خوانند. (البته روی این الگو زیاد حساب نکنید:) در دنیای پرشتاب امروزی اکثر کاربران در حال اسکن اطلاعات هستند.)چرا کاربران مطالب را با الگوی F اسکن می‌کنند؟اگر هر سه عامل زیر وجود داشته باشند، کاربران از الگوی F استفاده می‌کنند:1. متنی که در صفحه یا بخشی از صفحه قرار دارد، زیرعنوان یا بولت ندارد و کاربر با دیواری از متن مواجه می‌شود.2. وقتی که کاربر سعی می‌کند بیشترین کارایی را در آن صفحه داشته باشد.3. کاربر آنقدر متعهد یا علاقه‌مند نیست که بخواهد هر کلمه را با دقت بخواند.دو عنصر آخر تقریباً خلاصه‌ای از تمام رفتارهای کاربران هنگام مشاهده یک وبسایت است:اکثریت قریب به اتفاق کاربران وب، ترجیح می‌دهند وظایف خود را با کمترین میزان تلاش و در سریع‌ترین زمان ممکن انجام دهند. آنها از یک صفحه بازدید می‌کنند زیرا می‌خواهند به جای خواندن پایان‌نامه درباره موضوع مورد نظرشان، پاسخی سریع پیدا کنند.وقتی نویسندگان و طراحان هیچ قدمی برای هدایت کاربر به مرتبط‌ترین، جالب‌ترین یا مفیدترین اطلاعات برندارند، کاربران مسیر خود را پیدا می‌کنند. اگر هیچ سیگنالی برای هدایت چشم کاربر وجود نداشته باشد، او مسیری را انتخاب می‌کند که نیازمند کمترین تلاش باشد و بیشتر توجهش معطوف به اولین نقطه‌ای می‌شود که خواندن را آغاز کرده است (که غالبا کلمات سمت چپِ بالای صفحه متن است).همان طور که پیشتر اشاره کردیم، کاربران همیشه صفحات وبسایت را به شکلF اسکن نمی‌کنند؛ اگرچه تجربه‌ی سال‌ها خواندن و مطالعه، احتمالاً این باور را در ذهن افراد ثبیت کرده است که محتوای مهم‌تر قبل از محتوای کم اهمیت قرار می‌گیرد و در نتیجه وقتی که هیچ نشانه قوی‌ای برای جذب چشم‌ها به سمت اطلاعات وجود ندارد، کاربر از الگوی F به عنوان الگوی پیش‌فرض استفاده می‌کند.افراد تمایل دارند هزینه تعامل را به حداقل برسانند و سودی را که از انجام کاری بدست می‌آورند به حداکثر برسانند. برای چشمان کاربران، این به معنای تمرکز کمتر روی مطالب و بدست آوردن بیشترین اطلاعاتِ مورد نیاز است. صرفه جویی در زمان نیز مساوی نگاه کردن به کلمات کمتر است!گاهی افراد هنگام اسکن متن خسته می‌شوند یا مطالبی که می‌خوانند اطلاعات اندکی به آنها ارائه می‌دهد و ترجیح می‌دهند به جای خواندن عمیق مطالب فقط صفحه وب را به طور اجمالی اسکن کنند.الگوی F تاثیر منفی برای کاربران و کسب وکارها داردوقتی افراد به شکل F اسکن می‌کنند، قطعه‌های بزرگی از محتوا را صرفاً بر اساس نحوه قرارگیری متن، از دست می‌دهند. عبارات و کلماتِ نادیده گرفته شده اغلب به اندازه کلمات خوانده شده مهم هستند- یا حتی مهمتر. اما کاربران متوجه این موضوع نخواهند شد، چون آگاهی‌ای درباره آنچه ندیده‌اند ندارند.در طراحی ریسپانسیو، چیدمان متن بسته به اندازه صفحه نمایش تغییر می‌کند. بنابراین اگر کاربری در موبایل مطالب را به شکلF اسکن کند، هنگام اسکن همان صفحه در دسکتاپ، روی همان کلمات تمرکز نمی‌کند، فقط به این دلیل که چیدمان محتوا در ابعاد مختلف صفحه نمایش تغییر می‌کند!به طور کلی، الگوی خوانش F برای کاربران و کسب و کارها تاثیر منفی دارد چون کاربران ممکن است محتوای مهم را صرفاً به این دلیل که در سمت راست صفحه قرار دارد نادیده بگیرند. قالب‌بندی خوب، اسکن F را کاهش می‌دهد. اگر صفحات شما قطعه‌های بزرگی از متن بدون قالب داشته باشد، افراد آن را به شکل F اسکن می‌کنند.بهترین پادزهرها برای جلوگیری از الگوی خوانش Fمتن را اولویت‌بندی و قالب‌بندی کنید تا کاربران را به سمت آنچه می‌خواهید ببینند و آنچه می‌دانید که می‌خواهند ببینند هدایت کنید. چند نکته ساده:1. مهمترین نکات را در دو پاراگراف اول صفحه درج کنید.2. از سرفصل‌ها و زیرعنوان‌ها استفاده کنید. اطمینان حاصل کنید که آنها مهمتر به نظر می‌رسند و بیشتر از متن معمولی قابل مشاهده هستند تا کاربران بتوانند آنها را به سرعت تشخیص دهند.3. عناوین اصلی و عناوین فرعی را با کلماتی که حاوی بیشترین اطلاعات هستند شروع کنید: اگر کاربران فقط 2 کلمه اول را ببینند، باید محتوای کلی و اصلی ادامه‌ی متن را دریافت کنند.4. مقداری از محتوا را به صورت بصری نمایش دهید یا برجسته کنید، به عنوان مثال، دور قسمتی از متن حاشیه بگذارید یا از یک پس زمینه متفاوت برای قسمت‌های مهمتر استفاده کنید.5. کلمات و عبارات مهم را پر رنگ کنید .6. از قالب‌بندی متفاوت برای لینک‌ها استفاده کنید.7. از بولت‌ها و اعداد برای اسکن سریعتر مطالب یک لیست یا فرآیند استفاده کنید.8. محتوای غیر ضروری را حذف کنید.خلاصه:اسکن مطالب در وب تحت تاثیر عوامل زیر قرار دارد:· میزان انگیزه کاربران برای کسب اطلاعات· اهدافی که برای رسیدن به آنها تلاش می‌کنند· طرح‌بندی صفحه و قالب‌بندی متن· محتوای صفحهکنترل انگیزه یا اهداف افراد سخت است، اما می‌توانید محتوا و نحوه ارائه آن را بهینه کنید تا کاربران بتوانند به سرعت به آنچه نیاز دارند دست پیدا کنند. به طور خاص، از تکنیک‌های قالب‌بندی خوب برای جلب توجه کاربر به سمت مهم‌ترین اطلاعات استفاده کنید.خوشحال میشم اگر این مقاله رو بدون استفاده از الگوی خوانش F مطالعه کرده باشید:) و خوشحال‌تر میشم از خواندن نظرها و پیشنهادهاتون:))راستی برای مشاهده مقالات بیشتر در مورد UI / UX می‌تونید ما رو در اینستاگرام @produxlab دنبال کنید. پروداکس لب سبا بصیری Fri, 01 Apr 2022 14:54:23 +0430 https://virgool.io/Produxlab/%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%D8%AF-%D9%82%D8%A7%D9%86%D9%88%D9%86-%D9%85%DB%8C%D9%84%D8%B1-%D8%AF%D8%B1-%D8%B7%D8%B1%D8%A7%D8%AD%DB%8C-%D8%AA%D8%AC%D8%B1%D8%A8%D9%87-%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%DB%8C-haq9ctuxtd4j قانون میلرحقیقت این است که مغز ما در پردازش اطلاعات، محدود است و شناخت این محدودیت‌ها در طراحی تجربه کاربری اهمیت بسیار زیادی دارد.بر اساس یکی از قوانین تجربه کاربری به نام قانون میلر، یک فرد معمولی میتواند فقط 7 (بعلاوه منهای دو) مورد را در حافظه کاری (بخشی از حافظه کوتاه مدت) خود نگه دارد.قبل از ادامه بحث، بهتر است اول تعریف مختصری از حافظه کاری (Working Memory) داشته باشیم.حافظه کاری بخشی از حافظه کوتاه مدت است که می‌تواند حین انجام یک کار دیگر، اطلاعات را برای مدت کوتاهی نگه دارد. اطلاعاتی که در حافظه کاری قرار می‌گیرند موقتی‌اند و ممکن است خراب یا جایگزین شوند. اکثر اطلاعاتِ حافظه فعال، در حافظه بلند مدت رمزگذاری نمی‌شوند.مواردی که از حافظه کاری استفاده می‌شود: یادداشت‌برداری در کلاس، پیروی از دستورالعمل‌های چند مرحله‌ای، به خاطر سپردن یک استدلال متقاعدکننده یا انجام محاسبه‌های ذهنیبرای استفاده بهینه از حافظه کاری، می‌توان استراتژی‌های زیر را به کار برد: مقدار اطلاعاتی را که مخاطب باید به خاطر بسپارد محدود کنید. اگر سه موضوع برای به خاطرسپاری وجود دارد، آن‌ها را یکی یکی و به ترتیبی که باید تکمیل شوند به او بگویید. اطلاعات را به روش چندحسی ارائه دهید، مثلا با متن و تصویر روتین ایجاد کنید. روتین‌ها کمک می‌کنند ضعف‌های حافظه کاری را دور بزنیم. روتین‌ها کارهایی هستند که آن‌ها را کاملا خودکار و بدون فکر انجام می‌دهیم و به حافظه کاری نیاز ندارند. مخاطب را تشویق کنید از اطلاعات مهم عکس بگیرد یا آن‌ها را جایی یادداشت کند تا چیزهایی را که مجبور نیست به خاطر بسپارد، بیرونی کند.چطور از این قانون برای بهبود تجربه کاربر استفاده کنیم؟یکی از راه حل‌های تاثیرگذار، "تکه تکه کردن" اطلاعات است. در زبان انگلیسی به این تکه‌ها "chunk" می‌گوییم.اصطلاح "Chunk" در روانشناسی شناختی، واحدهای قابل درک و آشنا هستند که در یک دسته‌بندی قرار می‌گیرند و در حافظه فرد ذخیره می‌شوند.اصطلاح "Chunk" در زبان‌شناسی نیز، به مجموعه‌ای از کلمات یا اعداد مرتبط به هم گفته می‌شود که بتوانند در قالب یک مفهوم، در حافظه ذخیره شوند.یک مثال بسیار ساده و روزمره، نحوه دسته بندی اعداد روی کارت‌های بانکی است که به دسته‌های چهارتایی تقسیم می‌شوند تا به خاطر سپاری اعداد ساده‌تر شود.استفاده از قانون میلر در طراحی کارت بانکیدر مثالی دیگر، کمپانی slack اطلاعات را طوری دسته‌بندی کرده است که بار شناختی کاربر کمتر شود.برای استفاده از قانون میلر سه نکته را در نظر بگیرید: از "عدد جادویی هفت" برای توجیه محدودیت‌های طراحی غیرضروری استفاده نکنید. برای کمک به کاربران در پردازش، درک و به خاطر سپردن آسان، محتوا را در قطعات کوچکتر سازماندهی کنید. به یاد داشته باشید که ظرفیت حافظه کوتاه مدت برای هر فرد، بر اساس دانش و زمینه قبلی، متفاوت است.خیلی عالی میشه اگر شما هم تجربه‌ای در استفاده از قانون میلر دارید، در ادامه به اشتراک بگذارید:) اینطوری ذخیره غنی‌تری از تجربه‌ها خواهیم داشت.راستی برای خوندن مقالات بیشتر در مورد UI / UX می‌تونید ما رو در اینستاگرام @produxlab دنبال کنید. پروداکس لب سبا بصیری Fri, 01 Apr 2022 14:53:34 +0430 https://virgool.io/Produxlab/%D8%A8%D8%A7-10-%D8%AF%DB%8C%D8%B2%D8%A7%DB%8C%D9%86-%D8%B3%DB%8C%D8%B3%D8%AA%D9%85-%D8%A8%D8%B1%D8%AA%D8%B1-%D8%A2%D8%B4%D9%86%D8%A7-%D8%B4%D9%88%DB%8C%D8%AF-kli02avvqezi در حال حاضر دیزاین سیستم ها به بخش اصلی کار روزانه هر شرکتی تبدیل شده. از بررسی تا ایجاد، به نظر میرسه که بخش جدا ناپذیری از زندگی طراح ها تبدیل شده. بعضیا اعتقاد دارن در آینده هر برند و محصولی از یک دیزاین سیستم ساده یا جامع مخصوص خودش استفاده میکنه. در این پست ما به معرفی ۱۰ دیزاین سیستم برتر حال حاضر می پردازیم.01. GOOGLE MATERIAL DESIGN گوگل متریال دیزاین سیستم در سال 2014 ، با طراحی مدرن و با هدف ایجاد زبان بصری برای کاربران، توسط گوگل ایجاد شد. متریال دیزاین کمک میکنه تا تجربیات کاربران در همه دستگاها و سیستم عامل ها متحد بشه. یک منبع اٌپن سورس برای طراحان و دولوپرها.البته نسخه اولیه متریال دیزاین با مشکلات و انتقادهایی همراه بود، اما گوگل در سال 2018 با ارائه نسخه جدید تا حد زیادی از مشکلات و انتقادات تونست کم کنه.در حال حاضر متریال دیزاین در بین طراحان خیلی محبوبه و اکثر اون ها از این دیزاین سیستم استفاده می کنن.02. MAILCHIMP از میل چیمپ همیشه به عنوان یکی از بهترین نمونه ها در رابطه با جزئیات دقیق در برند تجاری نام برده میشه. همچنین اونا به خاطر داشتن یک دیزاین سیستم خیلی کامل که شامل الگو ها و کتابخونه کاملی از اون هاست، نیز شناخته شده هستن. در دیزاین سیستم میل چیمپ می تونید دستورالعمل های دقیقی در مورد رنگ، دکمه، نوتیفیکیشن ها و هر چیز مرتبط با بازاریابی هست رو پیدا کنید.03. UBER DESIGNاوبر خودشو به عنوان یک برند تجاری جدید و جسورانه توصیف میکنه و این اصل رو میشه توی دیزاین سیستم اختصاصیش هم دید. توی دیزاین سیستم اوبر میشه یکپارچگی تصاویر، استفاده از لوگو گرفته تا رنگ، ترکیب بندی های فوق العاده و حتی نوع تصویرسازی ها و ... رو دید. جایی در مورد دیزاین سیستم اوبر نوشته بود: " آموزنده، غیرسرزده، متمرکز و به موقع"04. Lightning design systemشرکت Salesforce یک شرکت نرم افزاری مبتنی به رایانش ابریه. محصولات CRM، خدمات مشتری، اتوماسیون بازاریابی، تجزیه و تحلیل و توسعه برنامه. این شرکت آمریکایی یک سیستم دیزاین کامل و مستند داره به اسم Lightning که یک پروژه اٌپن سورس متمرکز بر ساخت برنامه های تجاریه و شامل دستورالعمل های مربوط به سیستم عامل های مختلف، دسترسی، اجزا و الگوهای رابط کاربری، کاربردپذیری، المان های طراحی و موارد دیگه میشه.05. ATLASSIANاطلسین (Atlassian) یک شرکت نرم افزاری استرالیاییه که احتمالا شما اونو با نرم افزار معروف Jira میشناسید. دیزاین سیستم این شرکت نه تنها نحوه استفاده از لوگو، رنگ های تجاری، فونت ها و سایر عناصر طراحی توصیف میکنه بلکه به اون ها اجازه میده شخصیت برندشون رو درخشان بکنن. با اسم هایی که برای رنگ های خودشون مثل Dragon’s Blood و Herky Jerky انتخاب کردن میشه متوجه شد که چرا سبک اونا را جسورانه، خوش بینانه و عملی توصیف می کنن. این دیزاین سیستم واقعا یکی از کامل ترین هاست.06. Fluent Design Systemشرکت ماکروسافت توی روز دوم کنفرانس 2017 Building خود از پروژه Neon، که الان به اسم Fluent Design System میشناسیمش رونمایی کرد. این دیزاین سیستم ی جورایی رقیب جدی متریال دیزاین حساب میشه، و دقیقا همون اهداف رو پیش گرفته که براساس اون دیزاین تمام اپلیکیشن ها ویندوزی یکپارچه میشه. این دیزاین سیستم بر پایه اصولی همچون: نور، عمق، حرکات، متریال و مقیاس استوار شده.07. Polarisدیزاین سیستم Polaris توسط شرکت Shopify توسعه یافته تا همه کاربرانش بتوانند از یک تجربه عالی همراه با طراحی فروشگاهی زیبا لذت ببرند. این دیزاین سیستم دستورالعمل هایی برای هر بخش از تجربه کار با شاپیفای ارائه داده است. از صفحه ادمین گرفته تا صفحه محصول و بخش های مختلف دیگر. این دیزاین سیستم به طراحان رابط و تجربه کاربری اجازه می دهد تا صفحات کاربر پسند برای فروشگاه شاپیفای طراحی کنن.8- MARVEL DESIGN مارول یک پلتفرم طراحی مشارکتیه که یک دیزاین سیستم تقریبا خوب برای کاربراشون ایجاد کردن.9- APPLE DESIGN SYSTEM دیزاین سیستم شرکت اپل که خیلی شبیه متریال دیزاین و دیزاین سیستم مایکروسافت فلوئنت هست که دستورالعمل هایی برای طراحان رابط و تجربه کاربری ایجاد کرده است.10- AIRBNB DESIGN SYSTEM ویژگی اصلی این زبان طراحی اینه که هر مولفه به تنهایی میتونه به عنوان یک موجودیت جداگانه استفاده بشه در حالی که انسجام خودش رو حفظ میکنه.برای مشاهده مقالات بیشتر در مورد UI / UX می توانید ما را در اینستاگرام @produxlab دنبال کنید. پروداکس لب احسان سبحانی Sat, 27 Jun 2020 16:11:10 +0430 https://virgool.io/Produxlab/%D9%86%D8%AD%D9%88%D9%87-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D9%86%D9%82%D8%B4%D9%87-%D8%B3%D9%81%D8%B1-%D9%85%D8%B4%D8%AA%D8%B1%DB%8C-%D8%A8%D8%B1%D8%A7%DB%8C-%D8%B7%D8%B1%D8%A7%D8%AD%DB%8C-%D8%A8%D9%87%D8%AA%D8%B1-%D9%85%D8%AD%D8%B5%D9%88%D9%84-jpiw5faknvwo نقشه سفر مشتری چیست؟ اگه بخوام نقشه سفر مشتری رو بصورت خلاصه تعریف کنم، در واقع مسیری میشه که یک مشتری به دنبال رسیدن به یک هدف خاص در سایت شما طی میکنه و در طول این مسیر دارای یکسری احساساته. ما در مورد اینکه چطور این مسیر و احساسات مشتری رو بهتر کنید به شما میگیم.نقشه سفر مشتری برای موارد زیر میتونه خیلی خوب باشه:رفتار مشتری رو میتونی بهتر درک کنی. فرصت هایی که میتونستیم بهترعمل کنیم و از دست دادیمشون رو متوجه بشیم و از این فرصت ها بهتر استفاده کنیم.اینکه متوجه میشی کاربر در طول مسیر دارای چه احساساتی هست (نقاطی که باعث آزارش میشه یا مانع کارش میشه و یا باعث تردیدش میشه)نیازها و انگیزه مشتری رو میشه بهتر درک کرد. بهترین نقشه سفر مشتری نقشه ای که شامل یک مرور کلی درباره کل فرآیند از اولین تا آخرین نقطه تماس مشتری با سایت یا محصول ما باشهنحوه ایجاد یک نقشه سفر مشتری اولین موضوعی که باید در نظر داشته باشید اینه که نقشه سفر باید از دید مشتری طراحی بشه و در غیر اینصورت کارتون بیهوده است.با پرسونا شروع کنید برای ایجاد پرسونا می تونید از همکارای خودتون شروع کنید.ممکنه بعضی از داده ها با هم یکی باشه ولی همیشه اینجوری نیست. ما باید اینکار رو انجام بدیم چون افراد مختلف از سایت ما دیدن میکنن.وارد ذهنیت مشتری بشید من همیشه اولین کاری که میکنم اینکه خودم رو جای مشتری میزارم و مسیری رو طی میکنم که مشتری برای هدف های خودش طی میکنه. تمام احساساتی که یک مشتری در طول مسیر داره رو سعی میکنم حس کنم. در اینجور مواقع میگم باید خودتو جای شخصی بزارید که شاید اولین بار باشه داره با کامپیوتر کار میکنه. البته میتونید با تست روی دو یا سه نفر توی این بخش کمی احساسات کاربران رو بیشتر درک کنید.به نقاط تماس با مشتری ها دقت کنیدبه نقاطی که مشتری در سایت با اونها تماس داره دقت کنید. مثل دکمه افزودن به سبد خرید، رفتن به سبد خرید، بررسی سفارش شاید اضافه یا حذف چیزی توی سبد خرید، اینکه دوست دارن توی سایت عضو بشن یا بصورت مهمان خرید کنن، همه اینها نقاط تماس با مشتریه وقتی این نقاط رو به هم وصل کنید نقشه را ایجاد کردیم.چه اطلاعاتی باید جمع آوری کنیم؟بعد از شناسایی نقاط تماس با مشتری، اطلاعات مختلفی برای هرکدومشون نیاز داریم:احساساتاندیشه هااهداف نقاط درد (Pain points)فرصت هاشاخص عملکرد (KPIs)احساسات (Emotions)احساس مشتری چیه؟ این نقطه تماس چه حسی به مشتری میده؟ باعث شده هیجان زده ، ناراحت ، مردد، مصمم، اذیت، ناامید، سردرگم و یا کنجکاو بشن؟ احساسات میتونه توی هر نقطه تماس تغییر کنه. ممکنه یکی با ثبت نام کردن توی سایت هیجان زده بشه، یکی با خریدن یک محصول و کم شدن پولش ناراحت بشه. اینجاست که به اهمیت پرسونا توی نقشه سفر مشتری پی میبرید، اینکه دو نفری که یک کفش ۲میلیون تومنی خریدن ممکنه احساسات متفاوتی در مورد خرید از سایت شما داشته باشن.افکار (Thoughts) افکار و احساسات معمولا دست به دست هم میدن. چه کسی مشتریه و چه سوالاتی داره؟ مثلا شخصی که میخواد یه دوره آنلاین آموزشی رو بخره به این فکر میکنه که آیا این دوره ارزش پولی که میده رو داره؟اما ممکنه شخص دیگه ای با خودش بگه این همون دوره آموزشیه که دنبالش بودم و کلی واسش صبر کردم و همین الان میخرمش. این فقط ۲تا نمونه ساده هستن. افراد توی هر نقطه تماس افکار متفاوتی دارن. اونها رو بنویسید.اهداف (Goals)مشتری توی این نقطه تماس دنبال چیه؟ چه کاری میخواد انجام بده؟ انگیزه حضورش توی اون نقطه چیه؟ممکنه یکی وارد سبد خریدش بشه با هدف چک کردن لیست خریداش، یا اینکه ببینه کد تخفیفش کار میکنه یا نه. همه چی به شخصیت و تفکر فرد بستگی داره.نقاط درد (Pain points) چرا مشتریا ناراحت یا ناامید میشن؟ چه چیزای باعث بوجود آوردن مشکل توی سایت میشه؟ چه موانعی سر راه مشتری قرار داره؟ چه چیزی باعث اذیت و درد مشتری میشه؟ نقاط درد میتونه چیزایی مثل خطا، هنگام پرداخت کاربر باشه یا ارور درست وارد نکردن آدرس ایمیل. شاید متوجه شده باشین که مشکلی وجود داره که کاربران رو به سمت مسیر نادرست سوق میده. نقاط درد دیگه ای هم وجود داره مثل اینکه چرا کاربر سبد خرید خودش و رها میکنه، یا اشتراک خودش توی سرویس و لغو میکنه. افراد ممکنه بدون توجه به اینکه چقدر سایت شما بهینه سازی شده، بیخیال سبد خریدشون بشن. این موارد میتونه به نیازهای مخاطبان مورد نظر و یا نقاط درد عمومی مربوط بشه.فرصت ها (Opportunities) توی این بخش میتونید در مورد فرصت ها و ایده هایی که برای بهبود بخشیدن به سایت یا محصولتون دارید بنویسید. هر ایده کوچیک و بزرگی که به ذهنتون میرسه بنویسید. این مرحله بهترین مرحله برای نوشتن ایده ها در مورد نقاط تماس با مشتریه.شاخص عملکرد (KPIs)در آخر، یادداشت برداری از اینکه چه نوع شاخص های عملکردی این نقطه تماس یا ویژگی رو ردیابی میکنن، میتونه ایده خوبی باشه. آیا این نقطه تماس نرخ تبدیل (Conversion Rate) یا نرخ پرش ( Bounce rate) یا هر دو هست؟ اگر دارید A/B تست یا تست کاربری میگیرید روی این موضوع دقت کنید. این راه هوشمندانه ایه برای اینکه بفهمید در گذر زمان نقطه تماس چه عملکردی داشته.نتیجهنقشه سفر کاربر یک ابزار فوق العاده کاربردی در رابطه با سایت یا محصول شماست. این ابزار ارزشمند به شما تیمتون کمک میکنه که وضعیت مشتریان را خوب نگه دارید. نقشه سفر مشتری توی هر مرحله خاص هنگام تعامل مشتری با محصول یا سایت، به شما بینش خارق العاده ای میده. پس حتما در پروژه های بزرگی که انجام می دهید از نقشه سفر مشتری غافل نشوید.منبع: این مقاله توسط Paula Borowska و در سایت designmodo منتشر شده است.برای مشاهده مقالات بیشتر در مورد UI / UX می توانید ما را در اینستاگرام @produxlab دنبال کنید. پروداکس لب احسان سبحانی Sun, 14 Jun 2020 01:06:12 +0430 https://virgool.io/Produxlab/3-%D8%A7%D8%B3%D8%AA%D8%B1%D8%A7%D8%AA%DA%98%DB%8C-%DA%A9%D9%87-%D8%A8%D8%AA%D9%88%D8%A7%D9%86%DB%8C%D8%AF-%D9%81%D8%B1%D9%88%D8%B4%DA%AF%D8%A7%D9%87-%D8%AE%D9%88%D8%AF-%D8%B1%D8%A7-%D9%86%D8%AC%D8%A7%D8%AA-%D8%AF%D9%87%DB%8C%D8%AF-msevtixle5fy Featured image via Unsplash. زمانی هست که میبینی وب سایتت نمیتونه کاربران رو جذب کنه و بخش زیادی از کاربرانی که به سایت شما سر زدن به اصطلاح، فرار و بر قرار ترجیح دادن.من به این نتیجه رسیدم که که بعضی وقتا باید یک جفت چشم تازه داشت، تا ببینیم مشکل کار از کجاست. در اینجا ما ۳ استراتژی رو برای اینکار دنبال میکنیم.‏۱- تجزیه و تحلیل و اسپلیت تستینگ وقتی نمیدونید مشکل از کجا و کدوم بخشه سایتتونه، باید اونو مورد تجزیه و تحلیل قرار بدید با ابزارهایی مثل گوگل آنالیتیکس، گوگل تگ منیجر، هات جار و ... بعد از این باید به سراغ اسپلیت تستینگ بریم. اگر سایت شما ۲۰۰۰ بازدید کننده داره و %۷۰ اونها سایت شما رو ترک میکنن بهتره دوتا صفحه فرود برای سایت بگذارید و یا حتی چندتا، می تونید توی صفحات جای تصاویر دکمه ها و حتی نوع نوشتن اونا رو تغییر بدید و ببینید کدوم صفحه بازخورد بهتری داشته.‏۲- تست حضوریبهتره که این مرحله رو حتی قبل از بالا آوردن سایت اصلی و روی نسخه های پروتوتایپ انجام بدید. البته این تست رو میشه بصورت ریموت هم انجام داد.برای انجام این تست به نظر من ۳ نفر کافیه، چون نتایج معمولا در آخر یک چیزه. خوبیه این تست اینکه که افراد جدید سایت شما رو میبینن و مشکلی که شما ندید رو اونا به خوبی پیدا کنن.توی این مرحله از افرادی که دارید ازشون تست میگیرید، بخواهید که کار خاصی توی سایت انجام بدن، مثلا یک محصول بخرن، یا بخش جستجو رو توی سایت پیدا کنن، یا منوی دسته بندی ها و هرچیزی که براتون مهمه. زمانی که افراد دارن کاری که شما خواستین انجام میدن، حتما به حالت چهره اونها توجه کنید و مسیری که موس روی صفحه طی میکنه رو ببینید حالات و احساسات اونها خیلی مهمه.‏۳- ساده کردن روند فروشمشتریای خودتون رو در مورد چگونگی خرید توی سایت راهنمایی می کنین؟ یا اینکه مثلا بهشون میگید که هزینه ارسال پستی براشون رایگانه؟ یا اینکه روی محصولاتتون تخفیف های خوبی گذاشتین؟ یا در مورد خدمات خاصی که ارائه میدید بهشون میگید؟در مورد هزینه های اضافه ارسال پستی، زمان ارسال، مالیات و ... به اون ها توضیح بدید. مشتریا دوست دارن که به شما اعتماد کنن، پس باهاشون رو راست باشید. داشتن یک پشتیبانی خوب و صفحه سوالات متداول و یا نظرات دیگر کاربران در مورد فروشگاه شما می تونه اعتماد اون ها رو جلب کنه و این برای شما خوبه.منبع: SPLINTERTEAL پروداکس لب احسان سبحانی Fri, 12 Jun 2020 21:54:51 +0430 https://virgool.io/Produxlab/15-%D9%82%D8%A7%D9%86%D9%88%D9%86%DB%8C-%DA%A9%D9%87-%D9%87%D8%B1-%D8%B7%D8%B1%D8%A7%D8%AD-%D8%AA%D8%AC%D8%B1%D8%A8%D9%87-%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%DB%8C-%D8%A8%D8%A7%DB%8C%D8%AF-%D8%A8%D8%AF%D8%A7%D9%86%D8%AF-ezq0ktqechun تجربه کاربری یک رشته گسترده از مهارت های مختلفی است که هر طراح تجربه کاربری باید در آنها مهارت داشته باشد. با اینکه نمیشه تمام اطلاعات مفید در مورد تجربه کاربری رو در یک مقاله خلاصه کرد اما هنوز هم میشه قوانینی رو برای اینکار در نظر گرفت که هر طراح تجربه کاربری باید رعایت کنه.در این پست 15 قانون اساسی که هر طراح تجربه کاربری باید با آنها آشنا باشد را به مختصر مرور میکنیم.1- تجربه کاربری (فقط) رابط کاربری نیسترابط کاربری بخشی از تجربه کاربری است.لازمه که اول از همه تفاوت بین تجربه کاربری و رابط کاربری رو بدونیم و درک کنیم که این دو، موضوعات متفاوتی از هم هستن.در این مورد مقالات زیادی موجوده که میتونین مطالعه کنین ولی اگه بخواهیم به اختصار بگیم، رابط کاربری فضایی که در اون تعامل بین شخص و یک محصول رخ میده، در حالی که تجربه کاربری اون احساسی هست که بعد از تعامل شخص و محصول، رخ میده.طراحی رابط کاربری برای یک شبکه اجتماعی. هنگامی که کاربر صفحه را مجدد بارگزاری می کند، حسی که به او دست می دهد همان تجربه کاربری است.2- مخاطبان خود را بشناسیدتحقیقات کاربر اولین قدم، در فرایند طراحی است.یکی از مهمترین عواملی که موقع طراحی یک محصول باید در نظر بگیرید، مخاطب های شما هستن.اگه می خواهید محصولی طراحی کنید که مخاطباتون اونو دوست داشته باشن، باید ببینین که اونا چی میخوان، این به این معنیه که شما حتما مرحله تحقیقات کاربر (User Research) را به درستی انجام بدین.این خیلی مهمه که این بخش و بالای فهرست کارهایی که برای طراحی تجربه کاربری هست قرار بدید.3- شما کاربر نیستیدانجام تست با کاربران واقعی یک بخش اساسی در فرآیند تجربه کاربری است.اغلب طراحان فکر میکنن که افرادی که از یک محصول استفاده می کنن، مثل خودشون هستن. در نتیجه رفتارها و واکنش های خودشون نسبت به یک طراحی رو توی کار اعمال میکنن. این موضوع در روانشناسی بهش میگن "اثر اجماع کاذب". اثر اجماع کاذب چیه؟منظور از اثر اجماع کاذب اشاره به این ایدهٔ رایج ولی نادرست است که افراد فکر می‌کنند دیگران هم عقاید، نظرات و جهان‌بینی‌ای مشابه با آن‌ها دارند.چکار کنیم که دچار اثر اجماع کاذب نشیم؟به احتمال زیاد ، افرادی که از محصول شما استفاده می کنن ، پیشینه ها، ذهنیت‌‌ها، مدل های ذهنی مختلف و اهداف متفاوتی دارن. به عبارت دیگه ، اونا شما نیستین.روشی وجود داره که به طراحان تجربه کاربری کمک میکنه به اثر اجماع کاذب خودشون غلبه کنن به نام تست کاربردپذیری (usability testing). اگه شما میخواین محصولی طراحی کنین که کاربران دوستش دارن باید این تست و با کاربران واقعی انجام بدین. این موضوع ممکنه وقت گیر باشه ولی مطمئنن تنها راهیه که به شما مسیر درست رو نشون میده.4- طراحی برای توجه کوتاهکاربران را با اطلاعات بیش از حد غافل نکنیدبه مدت زمانی که شخص روی کاری متمرکز شده بدون اینکه حواسش پرت بشه، "توجه" میگیم.براساس مطالعاتی که مایکروسافت توی سال 2015 انجام داد، متوسط مقدار توجه افراد از 12 به 8 ثانیه کاهش یافته، و این به این معنیه که ما در حال حاضر گستره توجه کمتری حتی نسبت به یک ماهی قرمز داریم. چیزی که مشخصه اینکه طراحان تجربه کاربری باید به این موضوع توجه کنن و دستیابی به اطلاعات برای کاربران رو سریعتر کنن.اپلیکیشن ها و وب سایت های جدید باید محتوای قابل توجهی را ارائه بدهند که کاربران سریع بتوانند آن را هضم کنند. طراحان باید با از بین بردن عناصر یا محتوای غیر ضروری که بکار کاربران نمیاد، رابطه ها رو ساده کنن. اینجاست که میشه از تکنیک مینیمالیسم استفاده کرد. البته این به این معنی نیست که تجربیات رو محدود کنیم. باید کلیه اطلاعات با ارزش و مرتبط باشن.با داشتن اطلاعات بصری کم، متن ها توجه کاربر رو به خودشون جذب میکنن و تاثیر خودشون روی کاربر رو دارن5- روند تجربه کاربری یک چیز ثابت نیستروند طراحی خود را، برای محصولی که طراحی می کنید تطبیق دهیدروندی که برای تجربه کاربری یک محصول در نظر میگیریم، بخش مهمی از طراحی تجربه کاربری هست. بدون مشخص بودن روند تجربه کاربری، به عنوان طراح عملا در تاریکی داریم راه میریم. از طرف دیگه، روند واضح و مختصر در تجربه کاربری باعث میشه تجربیات شگفت انگیزی برای کاربران ایجاد بشه.طراحی کلی جریان تجربه کاربری.روند تجربه کاربری وابسته به نوع پروژه است.خیلی از طراح‌ها فکر میکنن که جریان میتونن برای طراحی تجربه کاربری فقط از یک روند برای همه پروژه ها استفاده کنن. اما همچین چیزی در طراحی به عنوان یک قانون اساسی وجود نداره. هر پروژه ممکنه توی تعریف گام های فردی متفاوت باشه و براساس الزامات و نیازهای خاص پروژه روند طراحی تجربه کاربری تغییر کنه. این به این معنیه که برای ایجاد بهترین تجربه کاربری طراح براساس ویژگی های پروژه مسیر جدیدی برای تجربه کاربری در نظر بگیره.به عنوان مثال اگر شما دارید روی طراحی یک محصول جدید کار میکنید باید زمان بیشتری روی تحقیقات کاربر و توضیحات پروژه بگذارید. اما اگه دارید یک محصول رو به اصطلاح ریدیزاین میکنین، ممکنه لازم باشه وقت بیشتری صرف اعتبار سنجی طرح بگذارید. ( انجام A / B تست، یا تجزیه و تحلیل گزارش های طراحی فعلی )6- ارائه پروتوتایپ قبل از ساخت محصول واقعیمرحله طراحی برای محصولات دیجیتالی باید شامل یک مرحله پروتوتایپ سازی باشد.استفاده نکردن از پروتوتایپ و نادیده گرفتن این بخش، یکی دیگه از اشتباهاتیه که معمولا تیم های طراحی مرتکب میشن. وقتی محصولی رو طراحی میکنیم و از نظر ما فوق العادست، بازم استرس این موضوع هست که آیا بعد از ارائه محصول اصلی بازم همین حس رو داریم یا نه.توی پروتوتایپ در واقع ما یک نمونه اولیه از محصول رو ایجاد میکنیم که قبل از رفتن به مرحله ساخت و پیاده سازی نهایی میتونیم مورد تست قرار بدیم. طراحان برای اینکار از روش های متفاوتی استفاده میکنن، که یکی از آنها ایجاد پروتوتایپ سریع (Rapid Prototyping) است که در یک پست جداگانه در مورد این موضوع صحبت خواهیم کرد.این روش یکی از محبوب ترین روش ها برای ایجاد یک پروتوتایپ سریع برای یک وب سایت یا اپلیکیشنه که میتونیم با کاربران واقعی هم مورد تست قرار بدیم.پیاده سازی پروتوتایپ اپلیکیشن در برنامه Adobe XD7- هنگام طراحی از محتوای واقعی استفاده کنیداز متن های لورم ایپسوم و آماده استفاده نکنیدتقریبا طراحی هر محصول براساس محتوا انجام میشه، چه متن، عکس یا فیلم. میتونیم بگین طراحی نوعی پیشرفت در ارائه محتواست. با این حال، متاسفانه خیلی از طراح ها در طول طراحی خودشون از اهمیت این موضوع قافل میشن و از محتوای آماده و غیرمرتبط با طرح استفاده میکنن. وقتی شما یک طرح رو با محتوای غیر واقعی پر میکنید ممکنه به ظاهر خیلی خفن شده باشه، اما وقتی محتوای واقعی شامل متن، عکس و فیلم جایگزین میشه میبینید که طرح چقد متفاوت میشه.باید این موضوع رو در نظر بگیریم که هدف ما به عنوان یک طراح اینه که تا حد ممکن به تجربه واقعی یک کاربر هنگام مواجه با طرحمون نزدیک بشه. بنابراین نباید خودمون را با گذاشتن محتوای غیر واقعی گول بزنیم.8- کارها را ساده و سازگار نگه داریدسادگی و سازگاری ویژگی بارز یک رابط کاربری عالی است.توی بحث محصولات دیجیتال، منظور از سادگی اینکه درک و تعامل با یک محصول آسون باشه. نباید کاربران نیاز به آموزش خاصی برای کار با سایت یا اپلیکیشن شما داشته باشند. این وظیفه شماست که به عنوان یک طراح همه مواردی که مورد نیاز کاربر است رو به صورت ساده، شفاف و دقیق در دسترسش بزارید و اونو به جایی که میخواهید هدایت کنید.توی این نمونه سایت می بینید که همه مواردی که لازمه کاربر ببینه رو جلوی دستش قرار دادن و کاربر هم متوجه میشه که قراره توی مرحله بعدی چه اتفاقی براش بیفته.مورد دیگه ای که باید در نظر داشته باشید اینکه در طول طراحی باید عناصر طراحی ثابت باشن، مثلا اگه از دکمه سبز توی سبد خرید استفاده کردین، در تمام صفحات همین رنگ باشه و از رنگ های مختلف برای یک کار مشترک استفاده نکنین. یا آیکون های جستجو، کارت های محصول و... همگی باید در تمام صفحات از یک جنس باشن تا کاربر دچار سردرگمی توی صفحات نشه. این یکی از مشکلاتی هست که توی خیلی از طراحی ها می بینیم. این خیلی مهمه که عناصر طراحی رو برای کاربر آشنا نگه داریم. یادتون باشه اصل طراحی اینکه حداقل سردرگمی و تعجب رو برای کاربر هنگام کار با محصولمون داشته باشیم.9- یادآوری کنیداستفاده از عناصر و المان هایی که باعث یادآوری چیزی به کاربر میشه، میتونه باعث افزایش بازدید بشه.به دلیل محدودیت های حافظه انسانی، طراح ها باید اطمینان حاصل کنن که می تونن کاری کنن که کاربر ویژگی های خاص یک محصول را به طور خودکار به یاد بیاره و یا اونا رو مجدد ببینه. باید سعی کنی این رابطه ها را جایی بگذارید که به راحتی برای کاربر قابل مشاهده باشد.در یوتیوب با یادآوری و نمایش ویدئوهایی که کاربر بصورت کامل ندیده، به کاربر کمک میکنه تا یادش بیاد که داشته یک ویدئو رو چند روز پیش تماشا میکرده و کامل ندیدش.این موضوع میتونه باعص افزایش بازدید و بالا بردن مدت زمان ماندن کاربر در سایت بشه.10- طراحی را قابل استفاده و در دسترس قرار بدیدباید در نظر داشته باشید طرحی که میزنید برای مجموعه متنوعی از کاربران است که با محصولات شما تعامل دارند.وقتی بحث طراحی میشه، اکثر طراحان به جای اینکه عملکرد و قابلیت دسترسی رو مورد توجه قرار بدن، وسواس بیشتری روی ظاهر و جذابیت طرح دارن. بیشتر ما سعی میکنیم همه چیزو زیبا جلوه بدیم. اغلب این امر به شرایطی منجر میشه که زیبایی شناسی برای طراحان مهمتر از قابلیت استفاده میشه.البته زیبایی شناسی از اهمیت بالایی برخورداره و قطعا باید سعی کنیم طرحامون رو جذاب کنیم، اما بعد از داشتن محصولی با قابلیت استفاده.مهمترین کار محصولات و خدمات دیجیتال انجام یک عملکرده.مردم از محصولاتی دیجیتال برای که اینکه انیمیشن های جالبی دارن و یا بصورت بصری هیجان انگیزن استفاده نمیکنن. اونا از این محصولات بخاطر اینکه ارزش مملوسی دارن، استفاده میکنن.طراحی تعاملی مناسب به کاربرا اجازه میده، همه توانایی خودشون رو طوری هدایت کنن که بتونن از یک محصول دیجیتال با موفقیت استفاده کنن. یک محصول خوب باید طوری طراحی بشه که همه افراد با توانایی های مختلف، از جمله افرادی با بینایی کم، نابینا، کم شنوا، ناشنوا و نقص حرکتی بتونن باهاش کار کنن. درسته که این مسئله میتونه در طراحی خیلی سخت باشه، ولی اینو در نظر بگیرید که میتونه تعداد کاربران شما رو افزایش بده. برای کسب اطلاعات بیشتر در مورد نحوه ایجاد رابط های کاربری برای افراد خاص میتونین از دستور عمل های متریال دیزاین و WCAG 2.0 استفاده کنین.تجربه شخصی:یادمه 5 سال پیش، در جریان طراحی فروشگاه اینترنتی شهروند در شرکت حامد پردازش میخواستیم شرایط رو برای افراد کم بینا و نابینا محیا کنیم تا بتونن بدون کمک از فروشگاه خرید کنن. و برای اینکار باید شخص نابینا یا کم بینا روی دیوایس خودش برنامه ای نصب میکرد و همچنین در بخش فرانت سایت باید همکارمون از دستورعمل های خاصی استفاده و اونارو رعایت میکرد. کارهای زیادی انجام شد اما نتیجه خوبی داشت. ( البته نمیدونم در حال حاضر این مورد روی سایت شهروند هست یا نه )فردی که دارای دید کم بینایی است و در حال مرور وب است.11- سعی نکنید خودتان یک مشکل را حل کنیدطراحی یک ورزش تیمی است – در انزوا کار نکنین.همونطور که لیندون جانسون ( سی و ششمین رئیس جمهور آمریکا ) یکبار گفت " هیچ مشکلی وجود نداره که ما نتوانیم با هم حل کنیم و خیلی کم پیش میاد که به تنهایی حل کنیم"تجربیات بزرگ نتیجه همکاری بین طراحان، دوولپر ها، سهامدارن و کاربران است. چیزی به عنوان یک نابغه تنها وجود نداره. وقتی دارید روی طرحی کار میکنید، باید با تعداد زیادی از افراد سرو کار داشته باشید تا ایده ها، بینش ها و افکار لازم برای طراحی رو بدست بیاورید.12- سعی نکنید همه مسائل را یکباره حل کنیدطراحی یک فرایند تکرار شونده استدرک این نکته مهمه که طراحی تجربه کاربری یک فرآیند خطی نیست. مراحل فرآیند تجربه کاربری (ایده پردازی، نمونه سازی اولیه، انجام تست) اغلب دارای همپوشانی قابل توجه ای هستن و معمولا زیاد پس و پیش دارن. همونطوری که در مورد کاربران، مشکلات و جزیئات پروژه (مخصوصا محدودیت ها) باید اطلاعات بیشتری کسب کنیم، ممکنه که لازم بشه یک سری از تحقیقات انجام شده رو مجددا بررسی کنیم یا ایده های جدید رو امتحان کنیم. هیچوقت فکر نکنید که بعد از انجام پروژه ای طرح شما کامل شده.طراحی تجربه کاربری یک روند خطی نیست. برای ساخت یک محصول عالی باید تغییرات زیادی روی اونها انجام داد و تستشون کرد. در واقع طراحی تجربه کاربری بر مبنای تفکر، ایجاد و بررسی است.13- جلوگیری از خطاها بهتر از رفع آنهاستبه قول معروف پیشگیری همیشه بهتر از درمان است. باید همیشه محصولاتی طراحی کنید که خطاهای احتمالی آن به حداقل برسد.اشتباه کردن جزئی از انسان است. اشتباهات معمولا زمانی رخ میده که افراد با رابط کاربری سروکار دارن. بعضی وقتا این اشتباهات، اشتباهاتی هست که خود کاربر مرتکب میشه و بعضی وقتام بخاطر مشکلات یک برنامه ست. علت این خطاها و اینکه اونا رو چجوری اداره کنیم تاثیر زیادی روی تجربه کاربری داره. کاربرا از اشتباه کردن متنفرن و از حسی که باعث بوجود اومدن این رفتار شده بیشتر متنفرن. بنابراین باید تلاش کنید که این خطاها رو تا جای ممکن از بین ببرید و یا اونا رو مورد بررسی قرار بدین قبل اینکه کاربرا به اون ها بر بخورن.کار جالبی که توئیتر انجام داده که به کاربر قبل از اینکه روی دکمه عضویت کلیک کنه میگه ایمیلی که وارد کرده، قبلا ثبت شده و اگه اون ایمیل واسه اونه میتونه با اون ایمیل لاگین کنه یا رمز خودش رو بازیابی کنه. چیزی که مخصوصا در فرم هایی با فیلدهای زیاد میتونه به کار کاربر بیاد.14- بازخورد مفید ارائه بدیدیک اپلیکیشن یا وب سایت باید همیشه کاربران را در مورد اتفاقی که داره میفته آگاه کنه.یکی از ده مورد مهم در دسترس پذیری، براساس تحقیقاتی که Jakob Nielsen در مجموعه نیلسون نورمن انجام داده، مشاهده وضعیت سیستم بعد از انجام کاری توسط کاربره. مثلا وقتی که شما روی دکمه جستجو کلیک میکنید، میخواهید ببینید بازخورد این حرکت شما چیه، اگه سیستم به شما نگه در حال جستجوی مطلب مورد نظر شماست، احتمالا با خودتون میگید خوب چی شد؟ چرا اتفاقی نیفتاد؟! در حالی اون سیستم در حال لود نتایج مرتبط با درخواست شماست. در اینجا استفاده از یک تصویر به عنوان اینکه به کاربر بگه سیستم در حال یافتن نتایج جستجوی شماست، میتونه از اون حس سردرگمی در کاربر کم کنه.15- از طراحی مجدد بصورت گسترده پرهیز کنیدقانون وبر را برای تغییرات قابل توجه به یاد داشته باشید.تحقیقات نشون میده که کاربران از تغییر زیاد در محصولاتی که ازشون استفاده می کنن متنفر هستن، حتی اگه این تغییرات به نفع اونا باشه. اگه یه طراحی مجدد گسترده روی محصولتون انجام بدین احتمال زیادی وجود داره که کاربران از این امر راضی نباشن. این پدیده حتی یک اسم علمی هم داره که به قانون وبر معروفه. قانونی که توسط "ارنست وبر" دانشمند آلمانی در قرن 19 کشف شد. .قانون وبر چی میگه؟ این قانون بطور خلاصه اشاره داره به مقدار تغییر لازم، برای اینکه فردی متوجه یک تغییر بشه. و میگه مردم متوجه تغییرات کوچیک نمیشن و وقتی شما یک تغییر کوچیکی انجام میدین، در واقع انگار کاری نکردین ( حد آستانه تشخیص تفاوت )حالا از این قانون چطوری توی طراحی استفاده میشه؟به عنوان مثال میتونیم سایت eBay رو بگیم، این سایت در طراحی خود در ابتدا از بکگراندهای زرد استفاده کرده بود، و یک شبه تصمیم گرفت تمامیه رنگ های زرد رو به سفید تغییر بده. نتیجه ای که پیش اومد اعتراض گسترده ای از کاربران با این تصمیم بود. کاربرا بدجوری معترض شدن و eBay مجبور شد دوباره طرح رو برگردونه به همون بکگراند زرد. و تصمیم جدیدی گرفت، اینکه فرآیند تغییر رنگ رو توی چند ماه و کم کم انجام بده، و اینجوری شد که تونست توی چند ماه بدون اینکه کاربران تقریبا تغییرات رو متوجه بشن به خواسته خودشون برسن.سایت eBay قبل از طراحی مجدد سایت. رنگ زرد به خوبی توی این سایت مشهود بود.بنابراین، بهترین راه برای انجام یک طراحی مجدد، انجام اون بصورت آروم آرومه. یکم تغییر اینور یکم تغییر اونور. با اینکار اغلب کاربرا متوجه طراحی مجدد شما روی محصول نمیشن تا زمانی که همه بخش ها رو تغییر بدید. توی نمونه های داخلی میشه گفت دیجی کالا توی این سال ها خیلی خوب از قانون وبر استفاده کرده.نتیجه گیری – از اشتباه کردن نترسیدهمه اشتباه می کنند و این تنها راه یادگیری چیزی است.شما وقتی اشتباه می کنید، در واقع یاد می گیرید، به قول معروف تجربه میشه واستون. پس اگه از اشتباه کردن می ترسین و سعی می کنین همه چیزو کامل انجام بدین، قطعا یاد گیری رو از دست میدین. قوانینی که در این سری پست ها گفتیم رو دنبال کنید، اما مهمتر از همه سعی کنین تکنیک ها و روش های جدید طراحی تجربه کاربری رو برای پیدا کردن راهی بهتر در انجام کارها برای خود و مشتریان همواره جستجو کنید.امیدوارم در این مقاله تونسته باشیم، شما را در مسیر بهتری برای انجام پروژه هاتون قرار داده باشیم.منبع: این مقاله توسط جناب Nick Babich در سایت ادوبی منتشر شده است.برای مشاهده مقالات بیشتر در مورد UI / UX می توانید ما را در اینستاگرام @produxlab دنبال کنید. پروداکس لب احسان سبحانی Thu, 11 Jun 2020 23:59:44 +0430