رفتن به مطلب
جامعهٔ برنامه‌نویسان مُدرن ایران

طراحی و توسعه

  • نوشته‌
    15
  • دیدگاه
    1
  • مشاهده
    3,281

مشارکت‌کنندگان این وبلاگ

اصول طراحی: ثبات و سازگاری

الهه انصاری

56 بازدید


1_B0pKth3Pzk8Cn0np_gg3uA.jpeg.1988739bf38c779b517a4883ca3fec82.jpeg

ثبات یک اصل اساسی در زندگی و طراحی است. بدون آن نمی‌توانیم ادامه دهیم. اگر از عهده‌ی اعمال آن برآیید، حتی سخت‌ترین مشکلات نیز از بین خواهند رفت! ثبات یکی از اصول طراحی است که دوست داریم به طور مرتب آن را نقض کنیم. من نیز در انجام این کار مقصر هستم و به آن افتخار نمیکنم. پیش بردن کامل کارها به صورت خلاقانه می‌تواند به راحتی این اصل طراحی را زیر پا بگذارد. موضوع مورد مطالعه پیرامون اصل ثبات در طراحی بسیار زیاد است. من تمام تلاش خود را برای بیان مهم‌ترین نکات آن خواهم کرد. در ادامه می‌توانیم یاد بگیریم که چگونه از ثبات  استفاده کنیم و چگونه آن را در طرح‌های خود حفظ کنیم بدون اینکه این اصل را نقض کنیم.

اصل ثبات در طراحی چیست؟

ثبات یکی از مولکول‌های دی ان ای طراحی است. طراحی سازگار، طراحی بصری است. بسیار مفید است و جهان را به مکانی بهتر تبدیل میکند. به طور خلاصه، هنگامی که عناصر مشابه ظاهر و عملکرد یکسانی داشته باشند، قابلیت استفاده و یادگیری بهبود می‌یابد. وقتی سازگاری و ثبات در طراحی شما وجود داشته باشد، افراد می‌توانند دانش را به زمینه‌های جدید منتقل کنند و موضوعات جدید را به سرعت و بدون دردسر بیاموزند. به این ترتیب آن‌ها می‌توانند بر اجرای کار تمرکز کنند و نیازی به تمرکز بر یادگیری این که چگونه هر بار رابط کاربری محصول تغییر زمینه می‌دهد ندارند.
ما انسان‌ها به طور پیش فرض ثبات را دوست داریم! بدن‌های جسمانی ما به طور دائم در تلاش برای کسب تعادلی مداوم هستند؛ بنابراین می‌توانیم سالم باشیم. ما باید احساس کنیم که شرایط برای احساس امنیت و ایمنی سازگار است.

مزایای ثبات و یکپارچگی

کاربران، نحوهٔ استفاده از طرح شما را سریع‌تر یاد می‌گیرند. فرض کنید که عناصر سازگار در طراحی شما همان حروف الفبا هستند. وقتی کاربر الفبای شما را یاد گرفت، می‌تواند به هر قسمتی از محصول برود و بتواند بدون هیچ مشکلی با رابط ارتباط برقرار کند.
داشتن رابط متناقض همانند تلاش برای برقراری ارتباط با کاربر به چندین زبان است. در این حالت فقط کاربران پیشرفته و حرفه‌ای قادر به انجام کارهای خود خواهند بود؛ بنابراین باید رابط ساده و سازگاری داشته باشید.
ثبات و سازگاری، سردرگمی را از بین می‌برد! وقتی کاربر احساس سردرگمی کند، مرحلهٔ بعدی احساس ناامیدی است. ما نمی‌خواهیم کاربر عزیز ما این گونه احساس کند، نه؟
ثبات باعث صرفه جویی در هزینه و زمان می‌شود! طراحی سازگار اغلب توسط اجزای از پیش تعریف شده ساخته می‌شود. این امر به طراحان و ذینفعان اجازه می‌دهد تا بدون صرف وقت با ارزش برای استدلال، سریع تصمیم بگیرند. این مورد باعث صرفه جویی در وقت میشود که میتواند برای ساخت محصول و پیشرفتهای چشمگیر و افزایشی به کار گرفته شود.

 

چهار نوع مختلف ثبات و سازگاری

بیایید چهار نوع سازگاری را بررسی کنیم که مهم است که هنگام طراحی از آن آگاه باشید.

سازگاری بصری
عناصر مشابه که به همان شیوه درک می شوند ، قوام بصری را تشکیل می دهند. این باعث افزایش یادگیری محصول می شود. برای حفظ قوام بینایی ، قلم ها ، اندازه ها ، دکمه ها ، برچسب زدن و موارد مشابه باید در سراسر محصول باشند.

سازگاری عملکردی
کنترلهای مشابه که به همان روش کار میکنند ، قوام عملکردی را تشکیل میدهند. قابلیت پیش بینی محصول را افزایش میدهد. پیش بینی پذیری موجب میشود تا کاربران احساس امنیت و امنیت کنند. به عنوان مثال، راه برگشت به یک مرحله در جریان باید به همان روش در سراسر محصول کار کند.

سازگاری داخلی
این ترکیبی از هماهنگی بصری و عملکردی در طراحی محصول شما است. این قابلیت استفاده و یادگیری محصول را بهبود میبخشد. حتی هنگامی که ویژگی ها یا صفحات جدید را معرفی میکنید، کاربران تا زمانی که قوام داخلی را حفظ کنید، از آن‌ها آسان استفاده خواهند کرد.

سازگاری خارجی
این نوع سازگاری زمانی حاصل میشود که ثبات طراحی در چندین سیستم یا محصول وجود داشته باشد. به این ترتیب میتوان از دانش کاربر برای یک محصول در محصول دیگر استفاده مجدد کرد. بله، این به از بین بردن بسیاری از اصطکاکها کمک می کند و تجربه‌ٔ کاربری خوبی را ارائه میدهد. مثال خوب سازگاری خارجی رابط کاربری محصولات Adobe است. هنگامی که کار با فتوشاپ را میدانید استفاده‌ٔ‌ مجدد از همان دانش برای استفاده از Illustrator و غیره بسیار سادهتر است.

دستیابی به این چهار نوع سازگاری به طراحی شما کمک میکند تا از قابلیت استفادهٔ بهتر و استفاده کنندگان خوشحالتری برخوردار شود.

 

چگونه سازگاری را فراهم کنیم؟ 

ماهیت سازگاری این گونه است که بتوانید یک عمل یا عنصر مشابه را چندین بار تکرار کنید و همچنان با دستیابی به کار از کاربر پشتیبانی کنید.

عوامل بصری

تایپوگرافی، رنگ‌ها، فضا، شبکه (grid)، اندازه و موقعیت‌ها؛ این عناصر باید در یک مکان مرکزی تعریف شده و سپس در کل سیستمی که طراحی می‌کنید استفاده شوند. سلسله مراتب بصری قوی تعریف کنید؛ به طوری که مهم‌ترین موارد، بزرگ‌تر از موارد کم اهمیت‌تر باشند. از همان پالت رنگی در سراسر محصول استفاده کنید. حاشیه‌ٔ داخلی (padding) و حاشیه‌ٔ خارجی (margin) باید در تمام عناصر مشابه (دکمه‌ها، کارت‌ها و غیره) سازگار باشند. همه چیز را باید در یک شبکه به انتخاب خود مرتب کنید که امکان چیدمان همه‌ٔ اجزا را به روشی زیبا و ظریف فراهم کند. داشتن عوامل بصری سازگار به کاربر این امکان را می‌دهد تا سیستم را سریع یاد بگیرد و تجربه‌ای روان و دلنشین داشته باشد. وقتی از عوامل بصری سازگار استفاده می‌کنید، طراحی شما از فنگ شویی خوبی بهره خواهد برد. در این لینک نمونه‌های مناسبی با دستورالعمل‌هایی از این سبک آورده شده است.

صدا و لحن

زبان و لحنی که شما در کل جریان کاربر استفاده می‌کنید، بر نحوه‌ٔ درک کاربر از محصول تاثیر می‌گذارد. صدا و لحن را در حالت ثبات و سازگاری حفظ کنید تا ارتباط گیرا، مختصر و مفیدی با کاربر شکل بگیرد. ما نمی‌خواهیم ذهن کاربر خیلی درگیر و شلوغ شود، مگر نه؟ 🙂
اگر می‌خواهید صدایی بامزه و دوستانه در طراحی محصول خود داشته باشید، این کار را تا دریافت پیام‌های خطا ادامه دهید. MailChimp نمونه‌ی خوبی از صدا و لحن سازگار است.

1_FoyYzFbv7N85ot68ZTbDkQ.png.5a6b2cca1d83dadba137538628957615.png

 

از الگوهای آشنا استفاده کنید

افرادی که از طرح‌های ما استفاده می‌کنند ،خواه دیجیتال باشد یا نباشد، از مدتی قبل با آ‌ن‌ها درگیر بوده‌اند. این بدان معنی است که آن‌ها طراحی‌های دیگری را تجربه کرده و یاد گرفته‌اند و کار با الگوهای به کار رفته در آن‌ها را به خوبی می‌دانند.

1_Rgnuo5cD1ArXf6G-JNEflA.png.7683baf658f8eab10e8906211c0887ce.png

http://www.mobile-patterns.com

ما باید از این مورد استفاده کنیم و الگوهای آشنا را در طراحی‌های خود بگنجانیم. در این صورت سفر کاربر بسیار روان‌تر خواهد بود و افراد حتی فکر نمی‌کنند که «هوم، چگونه از این استفاده کنم؟»؛ آن‌ها مستقیما بدون درنگ از آن بهره می‌برند.
در این دو منبع، موارد خوبی برای بررسی الگوهای مختلف وجود دارد: Mobile Patterns و Design Patterns.

 

ثبات را به دست آورید، آن‌ها را بر هم نزنید

ممکن است تصور کنید که سازگاری می‌تواند کاربر را خسته کند. اگر اجزا را همیشه در حالت ثبات نگه داریم تقریبا دیگر هیچ نوآوری وجود نخواهد داشت. قبل از این‌که بخواهیم از قوانین بهره‌ای ببریم ابتدا باید آن‌ها را یاد بگیریم. بله، سعی کنید آن‌ها را دور نزنید! سازگاری شکسته شده و زیر پا گذاشته شده برابر است با یک طراحی و تجربه‌ٔ کاربری خراب.

1_cwiC9HGtMDGC2JKf1HnCNg.gif.826cecb43807b4485e6a9e25fe868db9.gif

این مسئله هم برای کاربر و هم برای سازمان یک درد است. روند طراحی کند می‌شود. کلی سرمایه‌ٔ اضافی صرف می‌شود تا افراد در اتاق جلسات بر سر این که بهترین رنگ برای آن دکمه چیست، بحث کنند. هر کسی زمان ارزشمند خود را از دست می‌دهد تا تصمیماتی بگیرد که پیش از این باید اتخاذ شده و اکنون دوباره مورد استفادهٔ مجدد قرار گیرد. طراحان باید تا حد امکان ثبات را حفظ و ایجاد کنند.
ثابت نگه داشتن امور به معنای کند شدن تغییر است. ما هنوز هم نیاز داریم که محصولمان لذت بخش و جذاب باشد. ما به آن‌ها نیاز داریم تا به نسخه‌ی بهتری تبدیل شوند.
بنابراین، چگونه باید ثابت قدم بمانیم و همچنان به موقعیتی که می‌خواهیم برسیم و تغییر کنیم؟
«راز» این کار در درک کاربران است. تمام تصمیمات طراحی شما باید از همین درک حاصل شود. فقط درصورتی که سیستم مورد نظر شما از نیاز کاربر مطلع شده باشد، تنظیمات را اعمال کنید. انجام این تغییرات کوچک، محصول را به نسخهٔ بهتری مبدل ساخته و ثبات آن را حفظ می‌کند.

 

افکار نهایی

طراحی خود را با انتظارات کاربران هماهنگ کنید. کاربران خود را بشناسید دقیقا همان طور که شریک زندگی خود را می‌شناسید. قادر باشید از زاویه‌ٔ دید آن‌ها نگاه کنید و از طریق قلب آن‌ها احساس کنید. با آن‌ها یکی شوید.
آن را با درک کامل از اصول طراحی مانند سلسله مراتب بصری، تایپوگرافی، الگوهای کاربردی و غیره ترکیب کنید. به یاد داشته باشید که تغییرات اندک خوب است اما تغییر بیشتر لزوما بهتر نیست! ثبات را ایجاد کنید تا قابلیت استفاده را بهبود بخشید و با کاهش اجزای غیر منتظره، لذت وصف ناپذیری در تجربه‌ٔ کاربر ایجاد نمایید.

منبع

امیدوارم مطالب برای شما همراهان عزیز مفید واقع شوند. با نظرات ارزنده‌ٔ خود ما را در این مسیر یاری کنید🌻



0 دیدگاه


نظرهای پیشنهاد شده

هیچ دیدگاهی برای نمایش وجود دارد.

مهمان
افزودن دیدگاه

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از ۷۵ اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به عنوان یک لینک به جای

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

  • کاربران آنلاین در این صفحه   0 کاربر

    هیچ کاربر عضوی،در حال مشاهده این صفحه نیست.

×
×
  • جدید...