تکرار، الگو و ریتم در طراحی و تجربه کاربری

3,991
تکرار، الگو و ریتم در نگاه اول، ممکن است به نظر شما بسیار سطحی و واضح باشد. با این حال، اگرچه به نظر می‌رسد که نیازی به معرفی ندارند، اما باید آن‌ها را مورد بررسی قرار دهیم. با درک این مفاهیم، قادر خواهید بود ضمن اثر بخش‌تر کردن طراحی‌های خود، آن‌ها را به طور مؤثرتر مورد جلب توجه کاربران قرار دهید.

با گفتن کلمه “تکرار” شما ممکن است فکر کنید که بارها و بارها یک کلمه را تکرار می‌کند اما در طراحی مفهوم متفاوتی دارد. تکرار یک چیز لازم نیست خسته کننده باشد، در واقع، زمانی که از روش صحیح استفاده شود، می تواند یک طرح را تقویت کند. همچنین می توان از آن اطمینان حاصل کرد که پیام ها بهتر درک شوند. به عنوان یک طراح، ما سه روش برای تکرار داریم : تکرار، الگو و ریتم.

تکرار

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

برای مثال، می توانید یک خط افقی رسم کنید و سپس چند خط افقی دیگر در کنار آن رسم کنید.

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

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

الگو

الگوها صرفا تکرار بیشتر از یک عنصر طراحی هستند که در ارتباط با یکدیگر کار می‌کنند.

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

الگو

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

طرز استفاده از الگو

هنگامی که در طراحی وب یا برنامه خود الگوها را در نظر بگیرید، نیاز دارید که درباره پیچیدگی الگوها فکر کنید.

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

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

ریتم

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

ریتم

ریتم تصادفی:

تکرار عناصر بدون فاصله منظم خاص، ریتم‌های تصادفی ایجاد می‌کند.

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

ریتم منظم:

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

ریتم متناوب:

شما می‌توانید بیش از یک عنصر را در یک طرح تکرار کنید.

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

به عنوان مثال، هنگام ماهی‌گیری مشاهده می‌کنیم که هر ماهی، دنبال نوع مشابه دیگری خود می‌رود. در زیر، دنباله تکرار می‌شود، اگرچه فضای خالی بین صف‌ها، ماهی‌هایی از رنگ دیگر را نشان می دهد که در مسیر دیگری شنا می‌کنند (که ما از آن به عنوان صفحه زمینه استفاده می‌کنیم)، نمونه عالی دیگری از این مورد، خطوط ظریف پره ماهی و دم‌هایشان است که با اولین الگوی مارمولک اسچر(۱۹۴۲) در هم آمیخته شده است. ترکیب سه رنگ از مارمولک ها با یک جفت مارمولک از هر رنگ که در فاصله ای دور (دم تا دم دیگری) با یکدیگر رو به رو می شوند. به همین سادگی یا پیچیدگی می‌خواهیم یک ریتم متناوب ایجاد کنیم، این می‌تواند راهی آسان برای از بین بردن یکنواختی یک ریتم منظم باشد.

ریتم جریانی:

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

ریتم تصاعدی:

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

طراحی با تکرار، الگو و ریتم

استفاده از عناصر بصری مکرر تکنیکی است که طراحان معمولاً در طراحی وب به کار می‌گیرند. برای مثال می‌توانید عناصر طراحی را تکرار کنید تا یک تجربه بصری مداوم ارائه شود. این روش تمرکز کاربران بر محتوا را آسان‌تر می کند زیرا آن‌ها متوجه می‌شوند که در کجا می‌توانند نوع محتوای خاص مورد نظر یا گزینه‌های لینک شده را پیدا کنند.

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

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

  • خلاصه

به عنوان یک طراح ، شما سه نوع تکرار دارید :

  • تکرار
  • الگو
  • ریتم

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

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

ما می‌توانیم از پنج نوع ریتم استفاده کنیم:

  • ریتم تصادفی
  • ریتم منظم
  • ریتم متناوب
  • ریتم جریانی
  • ریتم تصاعدی

برداشت دیگری از الگو نیز وجود دارد که از معمار کریستوفر الکساندر سرچشمه می‌گیرد.

منبع Interaction-Design
ارسال یک پاسخ

آدرس ایمیل شما منتشر نخواهد شد.