طراحی رابط کاربری UI

طراحی رابط کاربری UI

بدون‌شک با شنیدن اسم UI، این سوال به ذهن بسیاری از اشخاص خطور می‌نماید که‌ طراحی رابط کاربری UI چیست؟

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

در نتیجه، شرکت‌ها دریافته‌اند که بهترین روش برای رقابت در دنیای اینترنت، ایجاد یک رابط کاربری جذاب و کارآمد میباشد.

رابطی که تجربه مخاطب (UX) را بهینه می‌نماید.

دراین مقاله، بررسی می کنیم که UI چیست؟

و در باب عناصر UI گفت و گو میکنیم.

در پایان نکاتی را برای ایجاد رابط کاربری مطلوب بیان خوا‌هیم کرد.

طراحی UI چیست؟

رابط کاربری (UI) نقطه تعامل و ارتباط انسان و کامپیوتر در یک دستگاه می باشد.

این می‌تواند دربرگیرنده صفحه نمایش، کیبورد، ماوس و ظواهر دسکتاپ باشد.

همچنین روشی می باشد که از طریق آن مخاطب با یک نرم‌افزار کاربردی یا یک سایت رابطه برقرار می نماید.

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

 

 

طراحی رابط کاربری (UI)

طراحی رابط کاربری (UI) فرآیند ساخت رابط ها در اپ یا دستگاه های رایانه ای با تمرکز بر ظواهر یا سبک میباشد.

سفارش ui یا user interface یکی‌از وسیع ترین فرآیند طراحی و ساخت یک وبسایت یا نرم افزار یا این که برنامه حرفه ایست.

بی دلیل نیست که استخدام طراح UI در سالهای اخیر اهمیت فراوانی پیدا نموده است.

هدف طراحان رابط کاربری ایجاد طرح هایی میباشد که دسترسی راحت و لذت بخشی برای استفاده مخاطب فراهم میکنند.

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

امروزه پیاده سازی رابط کاربری یا این که UI design یکی اثر گذارترین مهارت های طراحی وب و نرم افزار میباشد.

رابط کاربری نخستین تجارب و عکس العمل مخاطب با وب سایت یا نرم افزار میباشد.

بنا بر تحقیقات بر روی اهمیت UI بیش از ۷۰ درصد بازدیدکنندگان وب سایت ها ترجیح می‌دهند یک صفحه زیبا که عکس هایش به‌سرعت باز میشود را ببینند.

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

طرح UI تنها درخصوص تصاویر جذاب و طراحی عناصر گرافیکی وجود ندارد.

رابط کاربری در حقیقت تعامل در بین مخاطب و یک محصول را تعریف می نماید.

یک طراحی رابط کاربری خوب بایستی پیام درست را به مخاطب نهایی منتقل نماید.

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

 

تاریخچه UI

برای فهم بهتر UI و جواب UI‌ چیست می بایست اول تاریخچه رابط کاربری را بدانیم.

با ظهور ویندوز ۱٫۰ در دهه ۱۹۸۰ به زودی مشخص شد که داشتن یک اینترفیس دیجیتال که خوشایند مخاطب باشد، جهت خلق تجارب کاربری به‌یادماندنی و لذت‌قسمت، ‌جزئی ضروری محسوب میشود.

با این هم اکنون علی‌رغم این انقلاب بلندمرتبه، همچنان تا سال ۲۰۰۷ یعنی سالی که شرکت اپل با معرفی نخستین موبایل iPhone این حوزه از فناوری را دگرگون ساخت، هنوز عمق دگرگونی در طراحی UI معین نشده بود.

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

امروزه اغلب کسب‌وکارها، تأثیر این رابط کاربری بهتر را برای ساخت حس وفاداری مشتری و شناسایی برند درک کرده‌اند.

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

به صورت خلاصه طراحی رابط کاربری می تواند تعیین‌کننده موفقیت یا ناکامی یک فرآورده باشد.

 

 

UI از کجا آمد؟

 

پیش از سال ۱۹۷۰، درصورتی که شما میخواستید از کامپیوترها استفاده نمائید، ناچار بودید از رابط کاربری خط فرمان (command line) کمک بگیرید.

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

همین کار معمولی، الان شغل سختی میباشد نه؟

در دهه ۱۹۸۰ اولین رابط کاربری گرافیکی بوسیله شرکت زیراکس (Xerox) گسترش پیدا کرد؛

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

 این به معنی بود که دیگر کدنویسی نیاز نبود و انقلاب در UI از همین مجال به بعد صورت گرفت.

در سال ۱۹۹۴ شرکت اپل کامپیوتر شخصی مکینتاش را به بازار وارد کرد؛

این سیستم او‌لین PC موفق تجاری بود که از کلیک و ماوس تحت عنوان رابط کاربری جدید استفاده می کرد.

 دسترسی و رایج شدن کامپیوترهای شخصی سبب شد که جرقه‌ی طراحی رابط کاربری در ذهن اشخاص زده گردد،

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

در نتیجه طراحی UI متولد شد.

مولفه های یک رابط کاربری خوب

• وضوح و سادگی استفاده ui
• همگام با دیوایس های مختلف و داشتن طراحی ریسپانسیو
• جلوگیری از خطاها
• سازگاری رابط کاربری
• ایجاد مسیر حرکت مناسب برای کاربر

برای استخدام بهترین طراحان رابط کاربری سایت و اپلیکیشن می توانید یک پروژه رایگان روی کارلنسر ثبت کنید.

پس ار مدت کوتاهی از ثبت پروژه فزیلنسرهای طراح UI پیشنهادات خود را برای سفارش شما ارایه می دهند.

با بررسی و مقایسه فریلنسرها و نمونه کارهای آنها می توانید بهترین طراح UI را برای پروژه خود انتخاب نمایید.

 

انواع رابط کاربری

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

به لوازمی که‌با حواس تعامل دارند “رابط کاربری چندین رسانه‌ای” می گویند.

به عنوان مثال، رابط کاربری روزانه، شامل ترکیبی از ورودی لمسی (کیبورد و ماوس) و خروجی بصری و شنیداری (مانیتور و بلندگوها) میباشد.

انواع دیگر رابط‌های کاربری میتواند مشتمل بر موارد ذیل باشد:

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

از جمله، منوی تنظیمات در دستگاه بر اساس فرم میباشد.
رابط کاربری گرافیکی: ورودی UI لمسی با خروجی UI بصری (کیبورد و مانیتور).
رابط کاربری منو محور: نوعی که از لیستی از گزینه ها برای پیمایش در برنامه یا وبسایت استفاده می نماید.

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

مثلا می‌توان به دستیارهای مجازی ، متن به گفتار، GPS و موارد دیگر اشاره نمود.

 

 

 

 

 

Ui چیست ؟

Ui مخفف کلمه‌User Interface و به‌معنی رابط کاربری است.

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

به صورت کلی ظواهر یک وبسایت را ui یا رابط کاربری می نامند.

میتوان ذکر کرد ui قلب وبسایت از نگاه مخاطب می باشد.

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

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

 

 

Ui در فضای مجازی

با نگاهی کلی به شبکه های اجتماعی نظیر اینستاگرام می بینیم که هشتگ #Ui در حدود ۳٫۲ میلیون فیلم و عکس در ارتباط با این مسئله طراحی گردیده‌است و این میزان نشان دهنده مهم بودن موضوع طراحی رابط کاربری است.
اثر ui بر بازدید وبسایت
تصور کنید شما به‌دنبال مقاله آموزشی می‌باشید و با سرچ در گوگل وارد دو وب سایت می‌گردید .

وبسایت اول رنگ زمینه وبسایت سفید و رنگ متن وبسایت هم زرد رنگ میباشد.

مسلما با خواندن ۳ خط نخستین چشم شما خسته می‌گردد و مسلما هیچوقت وارد اون وبسایت نمیشوید .

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

خب شما شروع به خواندن آن می کنید و ظاهر عالی این وب سایت با ارتباط کاربری مطلوب به یاد شما می‌ماند و به طبع در سرچ های بعدی هم او‌لین انتخاب وبسایت شما است.

سایتی که ui خوبی داشته باشد استفاده از آن ساده‌ تر میباشد و به همین دلیل، کاربران تمایل بیشتری به وبسایت نشان می ‌دهند.

هر چه تعداد کاربران وبسایت فراتر رود، رتبه وب سایت نیز بهبود بیشتری پیدا خواهد کرد و این روی بهینه سازی وبسایت نیز اثر گذار خواهد بود.

 

 

به عنوان یک طراح UI، چه چیزهایی باید بلد باشید؟

لازم نیست با یک استعداد ذاتی در طراحی رابط کاربری داشته باشید، تا بتوانید UI و Ux کار خوبی باشید.

متخصصان حرفه‌ای این شغل شاید قبل از یادگیری چیزی بلد نبودند و قطعا حرفی برای گفتن نداشتند.

ولی با چند سال تمرین و تجربه و همچنین مطالعه توانستند به طراح ui قدرتمندی تبدیل شوند.

درست است که کار طراح UI با طراحی گرافیک فرق می‌کند.

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

 

 

رنگ شناسی در رابط کاربری

مسلما رنگ ها می‌توانند به بیننده وبسایت انواع حس ها را مانند استرس ، هیجان ، انرژی و ... بدهد.

مانند وبسایت گوگل که در آن از ۴ رنگ قرمز‌رنگ آبی رنگ زرد رنگ سبز استفاده شده است.

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

مثلا میتوان به دکمه خرید در وبسایت اشاره نمود که به مخاطب احساس درست بودن انتخاب را خواهد بخشید.

 

تاثیر فونت روی رابط کاربری

هر فونت شخصیت خاصی برای خودش دارد و به کار گیری نادرست از آن می تواند سبب زشت شدن ظاهر وب سایت و همینطور پسندیده نشدن توسط کاربران شود.

در طراحی رابط کاربری بایستی به خوانا بودن فونت و تغییرات آن در سایز های کوچک و بزرگ بررسی کرد.

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

 

اندازه المان ها برای رابط کاربری

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

 

مهارت های لازم برای طراحی UI

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

یکی‌از این مورد ها، آشنایی با نرم‌افزار های گرافیکی مثل فتوشاپ و ایلوستریتور و ادوب اکس دی میباشد.

ولی نباید از اولِ پروژه به سراغ این ابزارها بروید.

شروع کار یک طراح UI با وایر فریم یا ابزارهای طراحی اولیه میباشد.

می توانید از یک کاغذ سفید به عنوان وایر فریم استفاده نمایید و طرح گزینه نظرتان را روی آن پیاده نمائید.

ابزارها و نرم‌افزارهای دیجیتالی نیز جهت این کار وجود دارند.

 

 

 

 

۵ ابزار طراحی رابط کاربری

• اسکچ
• ادوبی XD
• فیگما
• فتوشاپ
• اکشر

 

 

Sketch نرم افزاری مشتمل بر ابزارهای طراحی وکتور میباشد که مارا قادر می سازد تا کار با لایه های متعدد را انجام دهیم

به‌ عنوان یک ابزار طراحی Ui و Ux برای اکثر طراحان اینترنت جایگزین فتوشاپ گردیده‌است.

قیمت سالیانه این نرم‌افزار به گفته وبسایت سازنده چیزی حدود ۹۹ دلار می باشد.

ادوبی XD
با‌یقین نام شرکت ادوب (adobe) تا به حال بارها شنیده اید و شاید هم نام برنامه های این شرکت را شنیدید.

مانند فتوشاپ ، ایلوستریتور adobe XD یک ابزار طراحی وب سایتمیباشد که حریف اسکچ میباشد و میتوان اظهار کرد که جای نرم افزار فتوشاپ را در صنعت طراحی رابط کاربری و همینطور طراحی تجربه کاربری پر کرده است.

قیمت ماهانه این نرم افزار به گفته وبسایت سازنده چیزی حدود ۹٫۹۹ دلار می باشد

فیگما

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

فتوشاپ
همانگونه که پیش تر گفته شد جای این اپ را ادوب اکس دی گرفته میباشد.

البته همچنان بسیاری از طراحان Ui و گرافیست ها از این نرم افزار استفاده میکنند و قصد مهاجرت به برنامه های مدرن تر و راحتر را ندارند.

اکشر
برنامه Axure یک ابزار چندکاره برای ساخت و طراحی وایرفریم (wireframe) ، نمونه‌های اولیه، انواع دیاگرام، نقشه سفر مشتری (Customer Journey) و مهم‌تر از همه رابط کاربری وبسایت ها و نرم افزار‌ ها می‌باشد.

 

این اپ طراحی UI با بقیه ابزارهای معروف مثل ادوبی اکس دی و اسکچ به طور کاملً سازگار میباشد.

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

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

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

لوگو چیست ؟

لوگو چیست ؟

لوگو چیست ؟ “نماد‌واره” یا این که “لوگو” یا این که “نشان” عنصری گرافیکی از علائم دیداری می باشد به‌طوری که با مدل حروف یا این که قلم خاصی تهیه شده یا این که با گونه های تصویری به صورت ویژه (و نه الزاماً خوانا)

چیده شد‌ه‌است. شکل، رنگ، مدل حروف و … می بایست مشخصاً از دیگر علایم مشابه دیگر متفاوت باشد.

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

بازمی‌نمایاند.

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

مخاطب (بیننده) جذابیت، زیبایی و مفهومی را انتقال دهد.

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

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

همچنین یک لوگو می‌تواند از ترکیبی از حروف، تصویر و یا این که ادغام از این دو باشد که شکل و مشخصه یک برند را شکل می دهد.

ولی مضمون‌ لوگو خیلی بیشتر از اینهاست!

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

درگیر به چه کسب و کاری میباشید. شما چه خدمتی ارائه می دهید شما کی می باشید و برای چه چیزی قیمت قائلید. برای لوگو چهره برند سهل و آسان وجود ندارد!

لوگو ها یک کدام از چالش برانگیزترین بخش های پیاده سازی گرافیک می باشند. صرفا یک کارشناس میتواند با پیش بینی ضوابط تصویری و گرافیکی ، یک لوگوی ماهر و متناسب با نیازهای برند بسازد.

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

لوگو می‌خواهد در خلاصه ای کوتاه و ساده یاد آور شما باشد و وظیفه برندینگ بیزنس را به دوش میکشد.

تاریخچه لوگو ها: لوگو ها جدید نیستند!

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

آن گاه پادشاهان ، آرتیست و هر دسته احتمالی جامعه به اینگونه چیزی احتیاج داشتند.

آن‌ها نشانه را بر روی برده ها ، حیوان ها ، سکه ها و جای جای دیگری که بتوانند درست کردند تا نام‌و‌نشان وابسته به صاحب و مالک را تشخیص دهند و ثابت نمایند.

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

حک گردیده بود و با این نماد و لوگو خودشان را معرفی می کردند و طومار نگاری ها اعمال می‌شد

بعضا از الگوهای انتزاعی تحت عنوان علامت به کارگیری می کردند و برخی از حیوان ها تحت عنوان علامت خویش به کار گیری می کردند.

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

هنرمندان از امضای خویش تحت عنوان لوگو به کارگیری می نمایند.

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

که هر جا مشاهده کنید فوری شناسایی میکنید.

به جهت این التفات برای لوگوی خویش وقت بگذارید و شایسته ترین گزینش را داشته باشید.

مقصود از پیاده سازی لوگو چیست؟

کلیه لوگو ها و علامت ها یک مقصود مشترک دارند که آن هم به رسمیت شناختن اسم تجاری کسب و کارها میباشد. لوگو به منظور شناسایی بصری یک کمپانی یا این که موسسه است،

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

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

 

چرا به لوگو نیاز داریم؟

حالا که پی بردیم  به این که لوگو چیست ؟ برای اینکه بتوانیم به بیزنس خویش نام و نشان دهیم به لوگو نیاز داریم. لوگو این قدرت را به شما میدهد که بتوانید کسب وکار خویش را حرفه ای‌تر نشان دهید

و اعتماد مشتریان متعددی را جلب نمائید.

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

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

لوگوها به خواسته شناسایی بصری موسسه ها میباشند و می‌توانند اسم کمپانی یا این که تنها نمایشی، بصری باشند. با پیاده سازی لوگو کمپانی خویش، قادر خواهیم بود که دقت اشخاص را

با سرعت بیشتری به کمپانی مان جذب کنیم.

لوگوی یک مارک اکثر وقت ها روی هر سیرتکامل سرویس ها و محصولاتی که ارائه می‌شوند حک میشود و شرکتهای از آن در حوزه تبلیغاتی، قراردادها و هدیه های تبلیغاتی و اهدایی به خیریه ها و …

تحت عنوان نشانه رسمیت بیزنس خویش استفاده می نمایند.

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

و فقط با اکران نماد و نشانه ای به کاربر بیان کنیم

انواع لوگو چیست

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

لوگو تصویری

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

آیتم به کار گیری قرار میگیرد.

این تصاویر بایستی قصه مارک شما و نوع مدل شغل شما‌را به کاربر نمایش دهد. لوگوهای تصویری خیلی خوب در ذهن کاربر ماندگار می ماند،

برای همین شرکت ها متعددی به به کار گیری از این لوگوها روی آورده اند.

 

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

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

که به نوعی با ادغام فونت ها و تغییراتی در اندازه و روش چیدمان کلمه ها همراه با نوآوری آن را به یک نشان بصری زیبا تبدیل می نماید.

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

لوگو ترکیبی

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

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

لوگو مونوگرام (monogram) یا این که لوگوی حرف نماد

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

 

از این لوگو وقتی که اسم کمپانی یا این که مارک، دشوار و وقت گیر باشد، به کار گیری میگردد و لوگوهایی بسیار گوناگون و ایده پرداز می‌باشند و کاربر جای اینکه به‌دنبال تصاویری فانتزی باشد

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

لوگوی HP و CNN در مدل لوگوی مونوگرام پیاده سازی گردیده اند.

لوگو امبلم (emblem) یا این که لوگوی نشان

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

لوگوی نماد دربرگیرنده آرم یا این که نمادی با مهر ، تاج و آرم میباشد که با قرار دادن نوشته و متن داخل شکل، تشکیل میگردد.

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

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

لوگوی انتزاعی

این سبک لوگویی میباشد که یک تصویر فارغ از هیچ متن و حرفی پیاده سازی میشود و به کار گیری از این لوگو در هنگام ورود شما به بازار مقداری ریسک پذیر میباشد.

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

و بوسیله به اکران در وارد شدن یک تصویر خاص میتواند شغل کمپانی و مارک تجاری تان را به طور نمادین جابجایی دهد.

امیدواریم که تا به این قسمت از مقاله ی ( لوگو چیست ) رضایتمند باشید

خصوصیت‌های طراحی یک لوگو عالی و موفق :

پیاده سازی عالی و موفق می بایست دارای خصوصیت‌هایی ذیل باشد؛

اعتبار و سنخیت:

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

می بایست با موضوع، مضمون‌ و خصوصیات برند هم‌خوانی داشته و معنای خویش را به‌سرعت به کاربر انتقال دهد.

به یادماندنی و استوار:

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

انعطاف پذیر:

یک طراحی بهتر و غالب می بایست بتواند به دو شکل سیاه و سپید (تکرنگ) و آحاد رنگی چاپ و در سایزهای گوناگون آیتم به کار گیری قرار بگیرد. فارغ از تغییر تحول در ظواهر و مضمون ها آن.

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

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

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

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

اصول طراحی لوگو چیست؟

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

اتود و طرح نخستین برای برند مربوطه را مهیا سازی فرمائید.

به مفهوم و مضمون‌ نهفته پشت لوگو دقت داشته باشید.

در طرح کلی لوگو تعادل و هماهنگی را در نظر بگیرید.

برای طراحی لوگو ابعاد و اندازه آن را برای تمام سطوح با سایزهای متفاوت در نظر بگیرید.

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

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

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

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

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

نباید های UI Writing

نباید های UI Writing

تایپ کردن کار ساده ای نیست. این را افرادی بهتر درک می‌نمایند که تجربه‌ی تایپ کردن برای کاربر خاصی را داشته‌اند.

ما آدم‌ها می‌نویسیم که پیام مشخصی را به کاربر خاصی منتقل کنیم. میشود به مدل‌ها و لحن‌های مختلفی نوشت.

با هدف ها و علت‌های مختلفی هم می‌توان نوشت. با هر هدف و به هر سبکی که بخواهید بنویسید می بایست بدانید که قواعدی وجود دارد که بایستی رعایت شوند.

در دل این قواعد بایدها و نبایدهای مختلفی مخفی میباشد.

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

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

در صورتی‌که رپورتاژآگهی می‌نویسید، بایستی حواستان باشد چیزی را مستقیما تبلیغ نکنید و حرفتان را غیرمستقیم بزنید.

درحال حاضر در حالتی‌که کسی بخواهد به مخاطب یک وبسایت بگوید که‌این درخواست شما امکان‌پذیر نیست زیرا فلان خطا رخ داده، چطور می بایست این را بنویسد؟

به عنوان مثال درصورتی که کسی وظیفه‌اش این میباشد که Tooltips پیاده سازی نماید،‌چطور می بایست متن آنها‌را بنویسد؟

چه باید‌ها و نبایدهایی را می بایست برای تایپ کردن پیغام‌هایی که در نرم افزار‌ها به کاربران نشان داده میشود رعایت کرد؟

جواب این سؤالات را طراح رابط کاربری و تجربه‌ی کاربری بایستی بدانند.

زیرا تایپ کردن همه‌ی آن ها که گفته شد وظیفه‌ی نویسنده‌ی تجربیات کاربری یا به عبارتی UX Writer میباشد.

متن‌های کوتاهی که مخاطب را در وب سایت یا اپلیکیشن هدایت می‌نماید یا پیش میبرد بخشی از پیاده سازی آن وبسایت یا نرم افزار میباشد.

درواقع تکمیل‌کننده‌ی پیاده سازی آن میباشد و نمیشود و نباید از آنها غافل شد

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

در‌حالتی که میخواهید بدانید UI Writing چیست و در آن چه نبایدهایی هست که باید رعایت شوند، محتوای درستی را پیدا کردید.

در ادامه این مقاله قصد داریم به طور کامل نباید های UI Writing را برای شما شرح دهیم.

نباید های UI Writing چیست

نباید های UI Writing چیست؟ طراح رابط کاربری با همکاری گروه UX ، ساختار و محل قرارگیری آیکون‌ها، دکمه‌ها، فضاها، تصاویر، پیغام‌ها و پیاده سازی واکنش‌گرا در وبسایت یا نرم‌افزار را پیاده سازی می‌نماید.

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

این متن ها ممکن میباشد یک واژه باشد یا چند جمله. به‌این متون UI text or UI copy می گویند.

گاهی و در برخی پروژه‌ها ممکن میباشد حتی یک نویسنده‌ی خبره برای تایپ کردن این متون انتخاب گردد.

زیرا این متن ها، حتی یک واژه، بخشی از پیاده سازی می باشند و بخشی از محصول. به‌همین‌دلیل تایپ کردن آن ها، هرکس که بخواهد بنویسد، باید‌ها و نبایدهایی دارد.

پس هدف در UI writing هم کمک به مخاطب و راهنمایی اوست.

درکل، متن‌های ui بایستی معمولی، مختصر، واضح و درخدمت ارتقا کاربردپذیری باشند.

در ادامه، به‌این می پردازیم که‌این متون درکل و جزء چه‌چیزهایی نباید باشند.

۱. از عبارات و اصطلاحات فنی، تخصصی و خاص به کار گیری نکنید

چرا بایستی برای استفاده کننده مهم باشد که دلیل بروز اشتباه چیست؟

مگر کاربرهای وب سایت شما تخصص دارند که بتوانند علت را بفهمند. برای مثال چرا پیغام error در یک وب سایت می بایست این‌قدر طولانی و فنی باشد؟

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

۲. نا مفهوم ننویسید

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

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

صرفا اینکه به مخاطب بگویید تاریخ درستی وارد نکرده کافی نیست.

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

۳. زیاد و پرجزئیات ننویسید

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

می بایست فکر کرد و کوتاه‌‌ترین و گویا‌ترین پاراگراف را پیدا کرد.

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

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

شما اگر جای مخاطب بودید، کدام پاراگراف برایتان کافی و بدیهی بود؟

۴. اعداد را به حروف ننویسید

درصورتی که در پیغامی یا روی کلید یا آیکونی بایستی عددی نوشته گردد، آن را به‌شکل رقمی بنویسید.

به عنوان مثال بایستی بنویسید «تا ۲۴ ساعت آینده پست الکترونیک تایید را دریافت می کنید» نه تا بیست‌وچهار ساعت بعدی … .

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

دیگری این میباشد که ارقام جای کمتری را اشغال می‌نمایند.

۵. از افعال مجهول به کار گیری نکنید

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

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

تصور کنید در توضیح دکمه‌ای این پاراگراف به شما نمایش داده گردد: وقتی کلمه‌ی موردنظر در کادر نوشته شد، می بایست کلید جستجو کلیک گردد.

کدام کاربری از خواندن این جمله احساس خوشایندی خواهد داشت؟

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

از جمله پیغامی که میخواهد به مخاطب بگوید نتیجه‌ای برای درخواستش در وبسایت پیدا نشده میباشد: نتیجه‌ای برای جستجوی شما یافت نشد.

۶. از زمان گذشته و آینده به کار گیری نکنید

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

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

(دقیقا مثل هنگامی که میخواهید به کسی نشانی بدهید.) خوبی فعل‌های دستور این میباشد که خیلی جاها خودشان به‌تنهایی مراد را به مخاطب می رسانند، مثل Submit یا این که Apply.

می توان فعل امر را با لطفا همراه کرد تا مودبانه‌تر به‌نظر رسد.

۷. از علائم نگارشی (نماد‌گذاری) خیلی به کار گیری نکنید

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

درست است از مخاطب سؤالاتی هم پرسیده میگردد و خب به علامت سؤال هم نیاز میباشد (مخصوصا در نرم افزار‌ها).

البته علامت تعجب و نقطه‌ویرگول خیلی کارایی ندارد.

درصورتی که میخواهید از علامت تعجب استعمال فرمایید، می بایست دلیل محکمی داشته باشید.

نکته اینجاست که تا میتوانید بایستی جملا‌ت کوتاه و معمولی بنویسید.

۸. همیشه از مخاطب تایید نگیرید

قطعا کتاب آشپزی دیدید. آیا پس از هر فرمان تالیف کننده از شما تایید خواسته که آن را اجرا دادید یا خیر؟

برای مثال، در حالتی که دستور این باشد که «در‌این مرحله بایستی مقدار کمی نمک اضافه نمائید»؛ بعدش نوشته شده میباشد «نمک را اضافه کردید؟».

این دقیقا کاری میباشد که شما در پیاده سازی رابط کاربری و متن‌های آن نباید انجام دهید.

همیشه نباید به مخاطب پیغامی نشان دهید که آیا مطمئنی که فلان کار را انجام دادی یا این که خیر ولی شاید برای برخی از کارها یک‌بار پیغام تایید

مورد نیاز باشد، آن‌هم یک پیغام کوتاه و مختصر و موءثر.

۹. استفاده کننده را غافلگیر نکنید

برای تایپ کردن هر متن رابط کاربری بایستی به‌این توجه فرمائید که برای چه سایت یا اپلیکیشنی می‌نویسید.

موضوعش چیست؟ مخاطب چه توقعاتی درباره‌ی این وبسایت یا نرم افزار داراست؟

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

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

متن ui تایپ کردن بااینکه خلاقیت می خواهد البته جای آزمودن لغات نو و نادر نیست.

مخصوصا زمانی که دارید برچسب (Label) دکمه‌ها را می‌نویسید.

مخاطب بایستی با یک نگاه بفهمد آن المان در وبسایت یا برنامه چه می‌کند.

برای مثال، برای استفاده کننده راحت‌تر میباشد کلمه‌ی فردا یا امروز یا این که روز گذشته را ببیند نه تاریخ‌ها را (۱۴۰۰/۸/۱).

 

۱۰. از زبان محاوره‌ای یا جنسیت‌زده یا طنز به کارگیری نکنید

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

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

شاید برخی‌ها به هیچ عنوان از طنز یا زبان محاوره و عامیانه خوششان نیاید. خوشبختانه، در زبان فارسی ضمایر خنثی می باشند.

البته بازهم می بایست توجه کرد که درکل از زبان و لحن خنثی مصرف شود.

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

مثل کاری که اسنپ کرده. حتما اسنپ دلایل خودش را داشته. ولی درهرحال نمیتوان مطمئن بود همه‌ی کاربران از واژه بی‌خیال خوششان بیاید.

۱۱. از صفات و قیدها به کارگیری نکنید

بروید سر اصل مقاله. اصل مقاله هم فعل‌ها می‌باشند. کارهایی که استفاده کننده بایستی انجام دهد (Actions).

در اصل در نباید های UI Writing جایی برای لغات اضافی نیست. هر کلمه و واژه می بایست برای کمک به مخاطب در متن مورد نیاز و ضروری باشد.

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

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

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

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

البته چرا این کار را نکرده؟ زیرا بحث اصلی راهنمایی‌کردن مخاطب برای اشتراک گذاری میباشد.

۱۲. چیزی را گردن مخاطب نیندازید

در حالتی که استفاده کننده کاری را خطا انجام داده یا این که اصلا انجام نداده، تقصیر وی نیست.

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

استفاده کننده خوشش نمی‌آید و از وب سایت یا نرم افزار شما می‌رود و دیگر هیچ زمان بر نمیگردد!

جمع‌بندی و نتیجه‌گیری

۱. متن‌های رابط کاربری می خواهند کاربر وب سایت یا این که نرم افزار مشخصی را وقتی میخواهد کاری با آن انجام دهد هدایت نماید.

پس کلیه‌‌ی آیین نامه‌ها و پیغام‌ها بایستی متناسب با این مقصود نوشته شوند.

۲. هر چه را که نوشتید آزمایش نمائید و نظر کاربران حقیقی وواقعی را جویا گردید.

۳. متن‌های رابط کاربری که می‌نویسید بایستی یک پارچه باشند.

۴. توجه فرمائیداگر برای نرم افزار گوشی می‌نویسید یا وب سایت فرق‌های متعددی در تایپ کردن برای برنامه یا وبسایت وجود دارد. به عنوان مثال در برنامه گوشی از Tap به کارگیری میگردد نه Click.

۵. هر واژه‌ای که میخواهید انتخاب فرمایید یادتان باشد برای استفاده کننده می‌نویسید.

در شرایطی‌که جایی با المان‌های بصری و گرافیک و رنگ‌ها و تصاویر استفاده کننده خوب هدایت می‌شود، تایپ کردن (ui text) را کنار بگذارید.

زیرا همه‌چیز به مخاطب برمی‌گردد.

۶. ui writing کامل کننده پیاده سازی‌ صحیح محصول میباشد. همان‌طور که تا قبل از این هم اشاره شد، درصورتی که توجه و وقت مورد نیاز برای ui text‌ها صرف نشود، پیاده سازی ui و درنتیجه پیاده سازی محصول به‌نتیجه‌‌ای که می بایست نمیرسد.

امیدواریم مطلب نباید های UI Writing از گروه سه سوت برای شما مفید باشد.

معرفی سایت های طراحی UI

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

انتخاب و پیاده سازی شایسته ترین الگوی طراحی وب سایت هم تحت اثر همین گزینه میباشد که اثر زیادی در seo دارد.

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

اما ممکن میباشد بعضی وقت ها طراحان ایده ای نداشته باشند.

در‌این‌حالت‌ خوب میباشد با نگاه کردن با نمونه کارهای بقیه افراد و ایده گرفتن از آن‌ها ذهن خویش را برای پرورش طرح های نو بازتر نمایند.

به فروشگاه های آنلاین دقت نمائید. اکثر این وب سایت ها دارنده یک نوار ناوبری در بالای کاغذ می‌باشند.

ورود کاربران از روش اسم کاربری و رمز ورود و یک دکمه ارسال داده ها انجام می گردد. بعد از خرید کالاهای مورد نظر، خروج نیز از همین بخش انجام می گردد.

الگوهای پیاده سازی رابط استفاده کننده (UI) برای مواردی شبیه مورد بالا پیاده سازی می گردند.

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

با توضیحاتی که در‌این بخش دادیم حتما به اهمیت پیدا کردن شایسته ترین الگوهای طراحی وب پی برده اید.

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

در سال ۲۰۲۱، داشتن یک رابط کاربری بصری (UI) برای هر محصول دیجیتالی مانند برنامه گوشی، وبسایت، SaaS و حتی B2B و نرم‌افزار سازمانی ضروری میباشد.

در این مقاله قصد معرفی سایت های طراحی UI را داریم.

چرا از خدمات وبسایت‌های پیاده سازی UI و UX استفاده کنیم؟

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

تنها گزینه برای شما این میباشد که با یک وب سایت همکاری فرمایید یا یک مشاور ارائه دهنده سرویس های پیاده سازی UX پیدا فرمایید.

از سوی دیگر، بخش اعظمی از وبسایت‌های برتر UX که کارهای عالی انجام میدهند، چراغ خاموش عمل می‌نمایند و پروژه‌های نو را صرفا به طور شفاهی و کلامی دریافت می‌نمایند.

چرا الگوی ساخت سایت مهم میباشند؟

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

الگوهای ساخت وب سایت را می شود به عنوان یک راه حل مطلوب در seo وبسایت در نظر گرفت.

طرح ui از فرآیند ساخت سایت میباشد و از آن تحت عنوان یک راه‌حل تازه در مسئله رفع خطاها وبسایت یاد می‌شود.

روی هم رفته UI سایت روندی در طراحی وب سایت نمی‌باشد.

مزایای به کار گیری از الگوهای UI

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

معرفی سایت های طراحی UI

۱. Clay

وب سایت پیاده سازی UI/UX در سان فرانسیسکو
مکان: سان فرانسیسکو، کالیفرنیا
مشتریان مهم: Slack ،Facebook ،Google ،Credit Karma ،Coinbase ،Coca-Cola
تعداد اشخاص تیم: ۵۵ نفر

Clay یک وبسایت توسعه و برندینگ و پیاده سازی UI/UX با سرویس های بدون نقص در سان فرانسیسکو میباشد.

اکثر تعاملات آنان سری میباشد. آن ها عمدتا با یونیکورن‌های (به شرکت‌هایی که ارزش فعلی آنان بیشتراز یک میلیارد دلار میباشد، گفته می شود) دره سیلیکون و شرکت‌های Fortune 100 فعالیت می‌نمایند.

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

آن‌ها همینطور با Bay Area و استارتاپ‌های جهانی منتخب همکاری می‌نمایند تا با بنیانگذارانشان همکاری نزدیکی داشته باشند و بتوانند چشم اندازهایشان را تحقق بخشند.

Clay یکی‌از معدود وب سایت‌های پیاده سازی UX میباشد که قادر است پروژه‌ای را از ایده اولیه به محصول نهایی و حتی بالاتر از آن برساند.

۲. Instrument

یک سایت پیاده سازی UX با سرویس های بدون نقص instrument.com
مکان: پورتلند و نیویورک
مشتریان مهم: Nike ،Sonos ،Levi’s ،Spotify ،Intercom ،Airbnb ،Dropbox
تعداد اشخاص گروه: ۳۳۰ کارمند

Instrument یک وب سایت برتر در مسئله UX و دیجیتال میباشد که دفتر کار مرکزی آن در پورتلند میباشد.

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

در سال ۲۰۱۹، آن ها با خرید استودیوی پیاده سازی دیجیتال ThisAlso مستقر در بروکلین که به صورت انحصاری بر پیاده سازی محصول، UX و UI تمرکز داشت، به ساحل شرقی گسترش یافتند.

آن ها به لطف زمینه‌های وب سایت‌های تبلیغاتی و یادگرفتن پیاده سازی UX UI، به سایت‌های بازاریابی کاملاً امروزی و تعاملی مشهور می‌باشند.

Instrument تحت عنوان یک شرکت پیاده سازی چند وجهی، شایسته ترین قسمت‌های یک مشاوره تجاری، وبسایت خلاق و شرکت مهندسی را برای ارائه کارهای درخشان ترکیب می‌نماید.

۳. IDEO

پیاده سازی تجربیات جهانی و سایت ux با وب سایت ideo.com
مکان: سانفرانسیسکو، پالو آلتو، نیویورک، لندن، توکیو و موردها دیگر
مشتریان اساسی: Verizon ،Swarovski ،Ford ،IKEA ،GE ،Procter & Gamble
تعداد اشخاص گروه: بیشتراز ۱۳۰۰ کارمند

IDEO یک مشاور جهانی طراحی با دفاتری در آمریکا، اروپا و آسیا میباشد که در مورد محصول های دیجیتال، سرویس ها و پیاده سازی UX حرفه ای است.

این موسسه در سال ۱۹۹۱ احداث گردیده و یکی‌از تأثیرگذارترین شرکت‌های پیاده سازی محصول و تجربه کاربر در صنعت می باشند.

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

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

۴. Red Antler

یک پیاده سازی تجربه کاربری و وب سایت دیجیتال، redantler.com
مکان: بروکلین، نیویورک
مشتریان اساسی: Casper ،Allbirds ،Foursquare ،Betterment ،Zagat ،Brandless
تعداد اشخاص مجموعه: ۱۲۱ کارمند

Red Antler یکی‌از شایسته ترین شرکت‌های برندینگ و پیاده سازی UX برای استارتاپ‌ها و مشاغل تازه میباشد که دفتر کار مرکزی آن در بروکلین نیویورک میباشد.

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

Red Antler تصمیم گرفت به صورت انحصاری با استارتاپ‌ها همکاری نماید تا بتواند از روش قدرت برندینگ و استراتژی دیجیتال به رشد و توسعه رسد.

آن ها یک وبسایت پیاده سازی UX UI میباشند که پشت برخی از موفق‌ترین استارتاپ‌های D2C (سبک D2C به برندها اجازه می دهد تا ارتباط حقیقی با مصرف کننده نهایی خویش برقرار نمایند) مانند Casper و Allbirds قرار دارا‌هستند.

۵. Bakken & Bæck

وبسایت پیاده سازی و توسعه و گسترش UI/UX با وب سایت bakkenbaeck.com
مکان: اروپا (اسلو، بن، آمستردام)
مشتریان مهم: Coinbase ،Vipps ،Kron ،Wake ،Kolonial ،Alva
تعداد اشخاص دسته: ۶۰ نفر

Bakken & Baeck یک استراتژی دیجیتالی و استودیوی پیاده سازی UI میباشد که در سال ۲۰۱۱ با دفاتری در اسلو، بن و آمستردام تاسیس شد.

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

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

گذشته از پروژه‌های مشتری، آن ها میزبان یک کنفرانس پیاده سازی یک روزه An Interesting Day و یک گرد هم آیی به اسم Stackid Hackathon میباشند.

آن‌ها تولیدات خویش مانند اپلیکیشن Daylight و ابزار همکاری پیاده سازی Wake را فعال‌سازی کرده‌اند که جدیداً بوسیله Vision خریداری گردیده‌است.

بعد از معرفی سایت های طراحی UI ، نوبت به معرفی بهترین وب سایت های ایده در این زمینه می باشد.

معرفی ۱۵ وب سایت برتر برای ایده دریافت کردن رابط کاربری

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

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

ما در ادامه این مقاله تعدادی از وبسایت های توانا و دیدنی در قضیه ایده پردازی برای رابط کاربری و منابع لازم برای ساخت وب سایت را به شما معرفی میکنیم.

۱- Pinterest

وبسایت قدرتمند پینترست، در واقع یک کانال اجتماعی مشهور و معتبر میباشد که علی رغم تجهیزات و قابلیت و امکان های فوق العاده ای که دارد

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

محتوای این نرم افزار بسیار جامع میباشد ومناسب برای هر ذوق وسلیقه و شغلی است.

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

۲- dribble

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

گرافیست ها، طراحان وبسایت و دیگر مشاغل برای پیاده سازی رابط کاربری (UI) از این وبسایت به کارگیری می نمایند.

همینطور نمونه کارها و پروژه های دوستداشتنی خویش را در‌این پلتفرم با یکدیگر به اشتراک میگذارند.

۳- Unsplash

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

وبسایت آنسپلش با تنوع و تعداد بالای و همینطور کیفیت فوق العاده ای که در عکس هایش داراست میتواند این گرفتاری را رفع نماید.

۴- freepik

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

این وبسایت در سال ۲۰۱۰ احداث شد و امروزه بسیار پرمخاطب میباشد. در freepik میتوانید تصاویری برای ساخت بروشور، کارت ویزیت، استوک و … را پیدا نمایید.

۵- sketch app sources

sketch app sources یک منبع فوق العاده مطلوب برای انواع فولدر های گرافیکی، پلاگین ها، فرم های آموزشی و دیگر مواقعی میباشد که بسیار مورد نیاز طراحان UI میباشد.

۶- psdfa

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

این وبسایت که از سال ۱۳۹۵ احداث گردیده دارنده طرح های گرافیکی قشنگ، موکاپ، وکتور، بروشور، قالب مجله و .. میباشد که نیاز طراحان وب سایت را برطرف می نماید.

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

۷- UI Patterns

UI Patterns یکی‌از وبسایت هایدوستداشتنی در مورد پیاده سازی رابط کاربری میباشد.

این وب سایت مرجع جامعی از مقاله‌ها در ارتباط با پیاده سازی UI میباشد.

در‌این وب سایت میتوانید پیاده سازی الگوهای موردنیاز خویش را پیدا نمائید و موارد مورد علاقه تان را در یک مجموعه قرار دهید.

۸- WELIE

WELIE دارنده طرح های تعاملی فوق العاده میباشد که آن را به یک منبع مطلوب در قضیه وبسایت برای ایده دریافت کردن رابط کاربری تبدیل نموده است.

۹- Pattern Tap

Pattern Tap دارای ۱۰ هزار گروه رابط کاربری میباشد.

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

۱۰- UI Scraps

در بلاگ UI Scraps می‌توانید از UI های خوب تا کارهای زشت را پیدا نمایید و با یکدیگر پژوهش فرمائید.

۱۱- Pattern Browser

با Pattern Browser می‌توانید میان الگوهای پیاده سازی UI در مرورگر خویش جا به جا گردید.

۱۲- User Interface Engineering

UIE هم یک منبع فوق العاده از گونه های الگوهای پیاده سازی رابط کاربری میباشد. ایده های کاربران این وبسایت نیز به شما کمک می نماید.

۱۳- Design snips

Design snips یک کتابخانه گرافیکی فوق العاده از همه الگوهای پیاده سازی UI میباشد.

۱۴- NMP

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

۱۵- Element of Design

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

زیرا دسته ای از عناصر پیاده سازی رابط کاربری را در خویش داراست.

جمع بندی معرفی سایت های طراحی UI

امروزه با توسعه تکنولوژی، راه‌اندازی وب سایت و طراحی UI کار بسیار آسوده و معمولی ای نخواهد بود.

برای پیاده سازی شایسته ترین UI وبسایت می بایست به‌دنبال الگوهای پیاده سازی مطلوب و قشنگ باشید که در نهایت یک رابط کاربری فوق العاده را برای شما به ارمغان بیاورد.

اما فراموش نکنید علاوه بر خلاقیت و دانش پیاده سازی بایستی در مسئله روانشناسی، شناخت پرسونا و دیگر مواردی که مخاطب پسند میباشد نیز تمرکز مورد نیاز را داشته باشید.

امیدواریم مطلب معرفی سایت های طراحی UI از سایت سه سوت برای شما مفید باشد.

سلسله مراتب بصری UI و UX در هدایت چشم کاربر

سلسله مراتب بصری UI و UX در هدایت چشم کاربر

سلسله‌مراتب بصری (Visual Hierarchy) چیست؟ چرا از مهم‌ترین مفاهیم در پیاده سازی تجارب کاربری و پیاده سازی رابط کاربری میباشد؟

پیاده سازی سلسله‌مراتب بصری چه اصولی داراست؟ در‌این مقاله به‌این سوال ها جواب جواب خواهیم داد

و مفصل درباره ی یکی از مهمترین مفاهیم در پیاده سازی UI/UX توضیح خواهم بخشید.

نمادها در تاریخ و تمدن بشری نقش مهمی داشتند. خواندن و تفسیرکردن اثرهای به‌جامانده‌ از مردمان باستان جزبا تفسیرکردن نشانه‌ها و نمادهای به‌کاررفته در آن اثرها امکان‌پذیر نبوده میباشد.

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

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

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

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

در زندگی روزانه‌ی ما هم اشکال و رنگ‌ها (نمادها) کاربرد بسیار وسیعی دارا‌هستند،‌ به عنوان مثال علائم راهنمایی‌ورانندگی و بنرهای تبلیغاتی.

نمونه بسیار بهتر دیگر برای کاربرد نمادها و نشانه‌ها و مفاهیم ایجادشده با شیوه‌ی قراردادن اشکال کنار یکدیگر پیاده سازی کالا (وب سایت و نرم افزار) میباشد.

بله، این‌طور نیست که طراح وب سایت یا این که طراح UI/UX فارغ از هیچ اصول و قاعده‌ای المان‌های صفحه های وب سایت را کنار یکدیگر بچیند.

طراح رابط کاربری و طراح تجربیات کاربری بایستی درمیان المان‌ها سلسله‌مراتب بصری (Visual Hierarchy) ایجاد نمایند و براساس اصول سلسله‌مراتب بصری المان‌ها را کنار یکدیگر قرار دهند.

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

در این مقاله قصد داریم سلسله مراتب بصری UI و UX در هدایت چشم کاربر را برای شما شرح دهیم.

قانون هیک در پیاده سازی UI و UX

قانون هیک نتیجه‌ی پژوهش های دو روانشناس بریتانیایی و آمریکایی به‌اسم‌های William Edmund Hick و Ray Hyman در دهه‌ی ۶۰ میلادی میباشد.

این قانون با زبان ریاضی (یک معادله) ذکر می شود. این قانون درواقع رابطه دربین مدت زمان واکنش آدم (Reaction Time or RT) به محرک‌های مو جود در دور و بر را براساس تعداد محرک‌ها ذکر می‌نماید.

به‌زبان ساده، هرچه محرک‌ها بیشتر باشد؛ مدت زمانی که آدم به آنها واکنش نشان میدهد (جواب می دهد) نیز بیشتر میگردد. به‌بیان دیگر:

قانون هیک میگوید که هرچه آدم با انتخاب‌های بیشتری روبه‌رو گردد،‌ زمان بیشتری نیاز داراست تا تصمیم بگیرد.

پس، هرچه انتخاب‌ها (آیتم‌ها، تعاملات، کارهایی که بایستی اعمال دهد) کمتر باشد؛ آدم در مدت زمان کمتری واکنش نشان می دهد، تعیین می‌نماید و یا این که کاری را انجام می دهد.

ضابطه هیک بیشتر از آنچه شما تصور کنید در پیاده سازی محصول مهم میباشد.

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

مزایای قانون هیک

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

پس استفاده کننده را برای انتخاب‌کردن به‌زحمت و دردسر نمی‌اندازد.

۲. طراح ux و ui با به کارگیری از این قانون، انتخاب‌های استفاده کننده را به ضروری‌ترین‌ها و کاربردی‌ترین‌ها محدود می‌نمایند.

بدین‌ترتیب، مخاطب به اندازه‌ی کافی در وب سایت میماند و میچرخد، ساده و آسان چیزی را که میخواهد پیدا می‌نماید.

بعد از تجربه‌ی تعاملش با وب سایت یا اپلیکیشن (UX) راضی خواهد بود.

۳. طراح بایستی باتوجه به تمامی اصول و قوانین و استاندارهای پیاده سازی رابط کاربری و تجربیات کاربری وبسایت یا نرم‌افزار را پیاده سازی نماید.

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

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

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

سلسله مراتب بصری UI و UX در هدایت چشم کاربر

شما چطور کتاب‌ها را در کتابخانه اتاقتان دسته‌بندی میکنید؟ بعضی‌ها میباشند که مثل کتابخانه‌ها فعالیت می‌نمایند.

بعضی‌ها هم کتاب‌هایی را که مهم‌تر میباشند و بایستی در دید باشند تا سریع پیدا شوند، می گذارند جلوتر یا جوری میگذارند که دریک‌نگاه پیدا شوند.

نمیشود همه‌ی کتاب‌ها به‌یک‌اندازه مهم باشند. این مطلب در زمینه ی داده ها نیز درستی می‌باشد. همه‌ی داده ها به‌یک‌اندازه مهم نیستند.

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

تابه‌حال به صفحه‌بندی روزنامه‌ها دقت کردید؟ در صفحه اولیه روزنامه همه‌چیز براساس اهمیتی که داراست درجای خاصی قرار میگیرد.

تیتر مهم بایستی طوری پیاده سازی و نوشته گردد که رهگذرها هم دریک‌نگاه کوتاه بتوانند آن را بخوانند.

وب سایت‌ها و نرم افزار‌ها هم همین‌طور می‌باشند.

وبسایت‌ها برای عرضه‌ی محتوا و داده های خاصی به استفاده کننده پیاده سازی و ساخته می گردند.

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

اصولا مخاطب نباید دنبال چیزی در وب سایت بگردد و این وظیفه‌ی طراح محصول میباشد که مطمئن گردد پیاده سازی UI/UX وب سایت و طرح‌بندی هر برگه‌ (Page Layout) از وبسایت به‌گونه‌ای میباشد که مخاطب را به مهمترین و کاربردی‌ترین داده ها هدایت می‌نماید.

برای رسیدن به آن هدف طراحان از مفهومی به‌اسم سلسله‌مراتب بصری بهره می برند.

تعریف معنا Visual Hierarchy

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

بگذارید مثال بزنیم تا معنای سلسله‌ مراتب بصری و همینطور عناصر تولید کننده‌ی آن خیلی بهتر روشن خواهد شد.

در برخی تصاویر که از رنگ قرمز استفاده می کنند او‌لین چیزی (یعنی مهم ترین چیز برای آن کسب‌وکار که میخواهد شمای مخاطب آن را بدانید) که می دانید چیست؟

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

چرا طراح از رنگ قرمز استفاده نموده است؟ زیرا رنگ قرمز در کنتراست (تضادومغایرت) با رنگ پس‌زمینه‌ی وب سایت میباشد.

محصولات کسب‌وکار خیلی منظم و دریک‌راستا کنار هم قرار می گیرند.

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

وقتی کاربر وارد اینوب سایت می گردد، او‌لین چیزی که می‌بیند چیست؟ دومی و سومی چطور؟

طراحان این وب سایت  می‌خواستند چطور چشم استفاده کننده را هدایت نمایند؟

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

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

براین اساس، عناصر تولیدکننده‌ی سلسله‌مراتب بصری مجموعه‌ی المان‌های بصری (رنگ، فونت، فونت سایز، کنتراست، فضای خالی، تقارن یا عدم تقارن و …) می باشند.

در هر وبسایت و در هر برگه از وبسایت براساس نوع و اهمیت محتوا و اطلاعاتی که قرار میباشد به استفاده کننده منتقل گردد، طراح UI/UX از یک یا این که چندتا از آن عامل ها بهره می گیرد تا سلسله‌مراتب بصری در بین داده ها را بسازد.

اهمیت و مزایای سلسله مراتب بصری UI و UX در هدایت چشم کاربر

هرچه دراهمیت سلسله‌مراتب بصری گفته شود، کم میباشد. سلسه‌مراتب بصری وسیله‌ای برای هدایت‌کردن چشم استفاده کننده برای دیدن داده ها به‌ترتیب اولویت آن‌هاست.

سوالی که پیش می آید این میباشد که حق تقدم برای چه کسی، کاربر یا صاحب وبسایت؟

پاسخ این میباشد که هردو! وبسایت فروشگاهی چه میخواهد؟ فروش محصولاتش. کاربر وبسایت فروشگاهی چه میخواهد؟

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

به این ترتیب، وبسایت فروشگاهی در‌صورتی‌که نخواهد مشتری ازدست دهد، نباید کاربرش را گیج نماید.

سوای سلسله‌مراتب بصری در وبسایت یا نرم افزار مخاطب نمی‌داند کجا را بایستی نگاه نماید!

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

پس محصول چنانچه بهترین محتوا را داشته و بسیار جالب صفحه آرایی گردیده باشد.

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

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

درنتیجه، فرآورده (وب سایت یا نرم افزار) برای استفاده کننده بهره‌ و کاربردی هم نخواهد داشت.

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

سلسله مراتب بصری ممکن میباشد به‌وسیله‌ی تغییر و تحول در رنگ و ساخت‌و‌ساز کنتراست، در اندازه و همینطور دسته‌بندی محتواها ایجاد گردد.

اصول پیاده سازی سلسله مراتب بصری

چطور می شود سلسله‌مراتب بصری توانا و شفافی در یک برگه تشکیل داد؟

آیا درصورتی که هرچیز که مهم‌تر میباشد را با سایز بزرگ‌تر بنویسیم یا این که آن‌ها‌را در نوار قرمز رنگی بالای کاغذ یا این که میانه کاغذ قرار دهیم، سلسله مراتب بصری ایجاد کردیم؟

نه! ساختن سلسله‌مراتب بصری اصول و قواعد خودش را داراست و دیزاینرها می بایست براساس اصول پیاده سازی سلسله مراتب بصری آن را در هر کاغذ از وب سایت بسازند.

۱. باکمک‌گرفتن از اصول روان‌شناسی، چشم استفاده کننده را براساس تمایلات طبیعی ذهن آدم هدایت نمائید

همان‌طور که درابتدا اشاره‌ کردیم، در پیاده سازی محصول چون مقصود پایانی این میباشد که محصولی متقاعدکننده برای استفاده کننده (انسان) پیاده سازی گردد، UI/UX دیزاینرها از یافته‌های روان‌شناسی بسیار سود میبرند.

علاوه‌بر قانون هیک، دانش روان‌شناسی به ما می گوید که چشم (ذهن) مخاطب با الگوهای آشنا و قابل‌پیش‌بینی مانوس‌تر میباشد و گرایش دارد از آن الگو‌ها تقلید نماید.

برای مثال، چشم فارسی‌زبان عادت کرده و تمایل دارد از راست به چپ بخواند.

همینطور، ذهن آدم به بازشناسی تمایل داراست.

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

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

۲. فقط رنگ‌ها یا این که یک المان بصری سلسله‌ مراتب را نمی‌سازد

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

رنگ‌ها و ایجادکردن کنتراست بسیار بسیار اساسی میباشد. جایی و گاهی ممکن میباشد کنتراست به شایسته ترین صورت سلسله مراتب را ایجاد نماید.

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

اما دقت فرمائید که نباید از رنگ‌ها و تضاد و مغایرت رنگ‌ها بیش‌ازحد استفاده نمود.

استدلال بسیار مهم دیگر که در پیاده سازی سلسله مراتب بصری می بایست به آن توجه ویژه کرد، اندازه‌ و مقیاس المان‌هاست.

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

بدین ترتیب، طراحان از سه سایز (و سه فونت سایز) در پیاده سازی المان‌‌ها به کار گیری می‌نمایند: small, medium & large.

درباره ی اندازه‌ی المان‌ها یک قانون کلی وجود دارد: مهمترین المان بایستی بزرگ‌ترین المان برگه باشد.

۳. سلسله مراتب بصری بایستی یک کل واحد و منسجم را بسازد

درست است که می بایست از کنتراست و المان‌های درشت و تغییر و تحول در اندازه‌ی المان‌ها برای ساختن سلسله‌مراتب بصری استفاده نمود؛ البته این ابدا بدین معنا نیست که یکپارچگی و انسجام بصری محصول ازبین برود و هرچیز ساز خودش را بزند.

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

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

۴. سلسه مراتب بصری پیاد ه سازی‌ شد ه بایستی آزمایش گردد

هیچ‌چیز در پیاده سازی رابط کاربری و تجربیات کاربری بدون آزمایش‌شدن نهایی نمیشود.

برای سنجیدن سلسله‌مراتب بصری معمولا از تستی به‌اسم The Squint Test کمک‌ استفاد‌ه میشود.

در‌این آزمایش صفحه‌ی وب سایت یا اپلیکیشن را مقداری تار می‌‌نمایند تا ببینند آیا سلسه‌مراتب بصری و دسته‌بندی محتوا‌ها همچنان مشخص میباشد یا نه.

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

گوگل کروم پلاگین‌ای به‌اسم Squint برای این آزمایش داراست.

جمع‌بندی و نتیجه‌گیری

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

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

۲. سلسله مراتب بصری مفهومی بسیار مهم در پیاده سازی UI/UX میباشد.

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

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

۴. پیاده سازی سلسله مراتب بصری اصول و قواعدی دارد.

سلسله مراتب بصری را بایستی براساس آن اصول و همینطور باتوجه‌به هدف محصول و نیازهای خاص کاربر آن کالا طراحی کرد.

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

امیدواریم مطلب سلسله مراتب بصری UI و UX در هدایت چشم کاربر از گروه سه سوت برای شما مفید باشد.