قوانین طراحی آیکون

قوانین طراحی آیکون :

فهرست مطالب

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

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

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

قوانین طلایی در فرآیند طراحی آیکون :

یکی از مواردی که یک آموزش طراحی را مؤثر میکند، شناخت قوانین آن است. در ادامه توضیحاتی در خصوص قوانین اصلی طراحی آیکون به شما داده میشود.

قوانین طراحی آیکون

اهمیت توجه به شبکه بندی در بین قوانین طراحی آیکون :

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

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

دو نماد خانه که روی یک شبکه کشیده شده اند :

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

ابتدا به اطراف نگاه کنید :

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

ذره بین کوچکی را در نظر بگیرید که همه جا می بینیم و می گوید «جستجو». ذره بین تنها موردی نیست که می تواند بگوید “جستجو”. با این حال، ما آنقدر از آنها استفاده کرده‌ایم که اکنون به نماد جستجوی استاندارد تبدیل شده‌اند. استفاده از آیکون های مختلف به کاربر نیاز دارد که چیز جدیدی یاد بگیرد و در نتیجه سرعت آن را کاهش دهد. این برای یک تجربه کاربری روان چندان مناسب نیست!

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

جزئیات قوانین طراحی ایکون :

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

آموزش ایجاد ارتباط بین اجزا در طراحی آیکون

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

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

به شکاف ها توجه کنید :

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

کار خود را تست کنید :

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

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

از اشکال ساده استفاده کنید :

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

برای مطالعه بیشتر ...