طراح محصول جونیور / علاقه مند به کسب تجربه های جدید
برای محصول خود، شخصیت انتخاب کنین!
مقدمه
هر محصولی شخصیتی داره که این شخصیت متاثر از یه سری عوامل هست که توی این مقاله قصد دارم اونها رو نام ببرم.
۴ عامل موثر در شخصیت محصول :
- تایپوگرافی
- رنگ
- گردی گوشه المان ها
- زبان نوشتار
۱. تایپوگرافی
تایپوگرافی (Typography) از دو واژۀ تایپ (حروف قابل تکثیر) و گراف (نمایش تصویری و هندسی) تشکیل شده. پس متوجه میشیم که تایپوگرافی به هنر چیدمان تایپ و فونت برای رسیدن به یک زبان تصویری گفته میشه.
تایپوگرافی هنری است که در آن طراح تلاش میکنه با تغییر عناصر متن، مثل اندازه، فاصله حروف، شکل حروف، فاصله خطوط، پاراگراف بندی و طراحی و چیدمان حروف و اندازه نقاط، طول خط و رعایت هر آنچه که باعث انسجام یا گسستگی در نوشتار میشه و خودآگاه یا ناخودآگاه مخاطب رو به خواندن متن ترغیب میکنه.
بهتر است یه تعاریفی اولیه از یک سری واژه ها داشته باشیم :
- تعریف تایپ : در متون لاتین، «تایپ» به حروفی گفته میشود که از پیش طراحی و با هر تکنیکی ساخته شدهاند و قابلیت تکرار و چیده شدن در کنار یکدیگر رو دارن و از چینش آن ها کنار یکدیگر کلمات، جمله ها و درنهایت متن ساخته میشه.
- تعریف فونت : در دوران حروفسازی و حروفچینی دستی، به هر مجموعه از حروف فلزی با یک سبک و «اندازه» مشخص، یک «فونت» گفته میشد. به عبارت دیگر، “نیان” ۱۲ پوینت یک فونت بود و “نیان” ۱۴ پوینت یک فونت دیگر
- تعریف تایپ فیس : «تایپفیس» عبارت است از مجموعهای از حروف و سایر نشانههای نوشتاری با یک طراحی یکپارچه و مرتبط. تایپفیس آن چیزی است که میبینیم. فونت آن چیزی است که استفاده میکنیم. تایپفیس نمود ظاهری و فونت نمود فیزیکی مجموعهای از تایپها (حروف) ست. (مثلا تایپ فیس ایران یکان)
خب حالا از انواع تایپ فیس ها به چه صورت استفاده میشه؟
اگر میخواهید ظاهری پیراسته یا کلاسیک داشته باشین، میتونین یک تایپ فیس سریف رو انتخاب کنین.
برای ایجاد ظاهری بازیگوش و صمیمی تر، میتونین از یک تایپ فیس سنز - سریف مدور استفاده کنین.
اگر به دنبال ظاهری ساده تر هستین یا میخواهید برای ارائه شخصیت به عناصر دیگر موجود در طرح تکیه کنین، استفاده از سنز - سریف معمولی عالیه!
تشخیص شخصیت و لحن تایپ فیس ها
۹۰ درصد اطلاعاتی که در فضای دیجیتال در اختیار کاربران قرار میگیره به صورت نوشتار هست. (این آمارو نمیدونم از کجا اومده ولی توی وبینار یواکس شیراز گفته شد :)) )
همانطور که میدونیم لحن گفتار سایت ورزشی با یک وبسایت خبری یا سرگرمی قطعا متفاوته. (با توجه به مخاطب هدف)
دو عامل روی نوع لحن تاثیر میذاره :
- نحوه نوشتار (رسمی / دوستانه)
- نوع تایپ فیس (مثلا برای متن های عرفانی و اشعار از تایپ فیس نستعلیق یا شکسته نستعلیق استفاده میشده)
۴ اصل مشترک در تایپ فیس ها وجود داره که به تایپ فیس ها زیبایی و هویت (شخصیت) میدن!
- اصول
- کرسی بندی
- تناسب
- ترکیب
اما توی این مقاله روی اصول تمرکز میکنیم چون مهم ترینش هست و بیشترین کمک رو بهمون میکنه. اصول به معنی ریشه و پایه هست.
اصول شامل موارد زیر میشه :
- زاویه قلم
- کنتراست ضخامت
- سطح و دور
- فضای مثبت و منفی
زاویه و کنتراست ضخامت قلم
زمانی که قلم موازی با خط کرسی (Baseline) حرکت میکنه، بیشترین ضخامت رو داره و در حرکت عمودی و مورب کمترین ضخامت رو داره.
حالا چه تاثیری در لحن داره؟
زمانی که بیشترین کنتراست ضخامت (بین دو دایره) رو داشته باشیم، لحن تایپ فیس کلاسیک، رسمی و جدی تره. اما اگه کمترین کنتراست بین دو دایره برقرار باشه لحن تایپ فیس مدرن تر و امروزی هست!
زاویه برش قلم
در تایپ فیس های امروزی زاویه برش انتهای حروف هم ساده تر شده و چیزی بین ۰، ۹۰ یا ۱۳۵ درجه هست. در حالی که در تایپ فیس های خوشنویسی این زاویه ها تند در هستن.
سطح : به حرکات مستقیم قلم میگن
دور : به حرکات دوار و منحنی قلم گفته میشه
که فونت انجمن در مثال زیر خنثی تره چون هر دو مورد رو داره!
پس منحنی های بیشتر ==> حرکت بیشتر، انرژی بیشتر و احساسی تر در نتیجه سن و سال کمتر (جوان تر)
سطح های بیشتر ==> آروم تر، خنثی تر، جدی تر و ایستاتر
فضای سفید و خوانایی
تایپ فیس خوب در خوانایی راحتتر نیز تاثیر داره. توجه کنین که کاربران متن رو اسکن میکنن پس بهتره که حروف به شکلی ساده باشن که راحت دیده بشن و هم فضای سفید درستی در تایپ فیس وجود داشته باشه.
فاصله بین خطوط در خوانایی بهتر متن کمک میکنه.
۱۴۰ درصد بالاترین و پایین ترین کرسی متن رو در نظر بگیرید و به این میزان فاصله، شروع خط بعدی خواهد بود.
۲. رنگ
معلومات زیادی در رابطه با علم روانشناسی رنگ وجود داره اما در عمل، باید تنها به احساسی که رنگ های مختلف برای شما ایجاد میکنن، توجه کنین.
رنگ آبی ===> امن و آشنا
طلایی ===> لوکس، گران و پیراسته
صورتی ===> کمی صمیمی بوده و چندان جدی نیس
پس به منطق روانشناسی رنگ و احساسی که میده با توجه به مخاطب هدف محصولتون، رنگ مناسب انتخاب کنین.
۳.گردی گوشه المان ها
کم بودن گردی گوشه های المان ها ===> نسبتا خنثی
گرد بودن زیاد گوشه المان ها ===> شیطنت آمیز
عدم وجود Corner Radius (گردی گوشه ها) در واقع تیز بودن گوشه ها ===> جدی یا رسمی
نکته : در کل دیزاین، انسجام (Consistency) رو رعایت کنین. یعنی اگه یک نوع دکمه رو گرد کردید، سعی کنین تمام دکمه ها رو گرد طراحی کنین.
۴.زبان نوشتار
لحن نوشتار خودمانی و محاوره ===> دوستانه
عدم استفاده از لحن خودمانی و محاوره ای ===> رسمی تر یا حرفه ای تر
منو توی شبکه های اجتماعی دیگه میتونین دنبال کنین :
منابع
خرید کتاب جادوی رابط کاربری (Refactoring Ui)
ارائۀ عاطفه محمدی (طراح تایپ فارسی QuickStudio) در یواکس شیراز
مطلبی دیگر از این انتشارات
۲۷ ترفند و روش کاربردی برای انجام تحقیقات کاربری در محیطهای واقعی
مطلبی دیگر از این انتشارات
چرا حوصله خدمات رایگان به مشتری رو ندارید ؟!
مطلبی دیگر از این انتشارات
تئوری رنگ - مبانی انتخاب رنگ برای یک رابط کاربری - قسمت اول