زبان طراحی دقیقا چیست؟

عبارت زبان طراحی (Design Language) برای توصیف تمام زوایای طراحی بصری یک محصول دیجیتال به کار می رود. احتمالا شما پیش از این منابعی برای تعریف زبان طراحی خودتان داشته اید. اما سوال اینجاست که چه ترکیبی از اجزا رابط کاربری در کنار هم یک زبان طراحی را می سازند؟

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

علی رغم این که ارتباط تصویری وجودی پیچیده است ، ما در بسیاری از موارد آن را به اندازه شمایل یک رابط کاربری، ساده می کنیم. اما نباید فراموش کرد رابط بصری(visual interface) در حقیقت روشی بسیار پیچیده از ارتباط تصویری است که توجه به جزئیات و نحوه استفاده از عناصر طراحی برای تعامل با کاربران را تضمین می کند.

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

زبان چیست؟

اجازه دهید با تعریف آن در لغت نامه شروع کنیم:

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

- هر ترکیبی از نمادها ، نشانه ها ، صداها ، حرکات یا مانند آن ها که به عنوان ابزاری برای برقراری ارتباط فکر ، احساسات و غیره استفاده می شود.

- همه انواع مختلف ارتباط به صورت رسا، معنی دار و غیره.

اینجا کاملا واضح است ، برای اینکه بتوانیم مجموعه ای از طرح ها را زبان طراحی بنامیم به یک سیستم یکپارچه و رسمی به عنوان راهی برای برقراری ارتباط معقول با کاربران نیاز داریم.

برای مثال ارتباطات کتبی و کلامی را در نظر بگیرید. که در همه آنها ساختار ها و الگو ها ظاهر می شوند:

1- کلمات معنی دارند.

2- علائم سجاوندی دارای معنی هستند.

3- اشکال گوناگون کلمات (اسم، صفت یا فعل) معنی مستقل دارند.

4- کلمات مرکب داری معنی و ساختارند.

5- جملات هم ساختار دارند و هم مفهوم را منتقل می کنند.

6- پاراگراف ها نیز هم ساختارمند هستند هم معنی دار.

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

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

قوانین واضح و ثابت همان چیزی ست که باعث موفقیت زبان ها می شود. تناقضات ، ابهامات یا تضادهای مستقیم می تواند یادگیری، آموزش و درک زبان را دشوار کنند. مثلا قاعده " I before E, except after C " ]در دستور زبان انگلیسی[ را در نظر بگیرید. این قاعده می گوید همیشه i قبل از e می آید،مگر اینکه حرف قبل از آنها c باشد.

زبان همانطور که به رابط بصری مربوط می شود

]طراحی اتمی روشی متشکل از پنج مرحله مجزا است که با هم کار می کنند تا یک سیستم طراحی دقیق و سلسله مراتبی ایجاد کنند، در این مدل [یک جز می تواند ترکیبی از اتم ها و مولکول ها باشد، بنابراین باید زبان طراحی اتمی را به همان شیوه معناشناسی معرفی کنیم. دقیقا با همان شیوه ای که دستور زبان علائم نگارشی و کلمات را تعریف می کند. پایه و اساس ایجاد یک زبان طراحی بصری شامل موارد زیر است:

- تعریف واضح مفاهیم ("خطا" ، "هشدار" ، "موفقیت" و "اطلاعات" تقریباً کافی نیستند)

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

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

- یک مستند جامع و کامل در مورد سیستم ارتباط تصویری

کتابخانه الگو (pattern library) و دستورالعمل راهنمای شما نقش فرهنگ نامه زبان طراحی تان را بازی می کند. مستند سازی هسته معنایی ، ساختار ها و مفهوم پشت هر مولفه طراحی (مثل رنگ، خط، شکل و مانند اینها) بنیان مستحکمی برای تصمیماتی که در طراحی و استفاده از مؤلفه های طراحی تان گرفته می شود ، ایجاد می کند.

خود را بیازمایید

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

- این رنگ چه معنایی می دهد؟

- ابعاد چه مفهومی را می رسانند؟

- حد ضخامت حاشیه ها چقدر است؟

- لبه های نرم چه مفهومی دارند؟

- فونت ها چگونه اند؟

- حالت italic چه فایده ای دارد؟

یک راه ساده برای این کار تکمیل این جمله است:

______ که در ______ استفاده شده است در رساندن مفهوم _______ موثر است.

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

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

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

این متن ، ترجمه یادداشتی ست از نیت بالدوین که در دسامبر 2016 در medium منتشر شده است.