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

اینطور گفته اند که ناسا در سال ۱۹۷۵ یک سند برای استانداردهای بصری اش منتشر کرد. احتمالا اگر در تاریخ به قبل‌تر هم بگردیم نمونه هایی از این استاندارد سازی خواهیم یافت. به هر حال این کار ناسا را ببینید. کار بسیار باکیفیت و قابل تحسینی است. اما داستان از جایی شروع شد که با بزرگ شدن شرکت ها نیاز به سیستمی برای دیزاین داشتند که بتواند همزمان با آنها بزرگ شود. قابل اسکیل (بزرگ شدن نمایی- رشد) باشد. راهنماهای هویت بصری قابل اسکیل نبودند. باید بازنگری و بازطراحی شوند. رابطه کامپوننتی بین اجزای آن وجود ندارد. اما دیزاین سیستم ها متناسب با رشد شرکت، رشد خواهند کرد. پویا و زنده هستند. نسبت به تغییرات کل دیزاین سیستم هوشیار است و خود را منطبق خواهد کرد.نمونه ای از این زنده بودن دیزاین سیستم را در Lonely Planet’s میتوان دید. جایی که تیم طراحان آن آگاه هستند که باید نسبت به تغییرات و تاثیرات آن بر طراحی و دیزاین سیستم هوشیار بود.

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

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

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

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

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

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

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

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

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

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

1. متریال دیزاین (Google)

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

2. Carbon Design System (IBM)

• دیزاین سیستمی برای طراحی نرم‌افزارهای سازمانی.
• تمرکز بر مقیاس‌پذیری و تطبیق‌پذیری.

3. Apple Human Interface Guidelines (HIG)

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

4. Atlassian Design System

• دیزاین سیستمی برای نرم‌افزارهای همکاری تیمی مانند Jira و Confluence.
• راهنمایی برای دسترسی‌پذیری و طراحی برای گروه‌های مختلف کاربر.

5. Spotify Design Guidelines

• استانداردهایی برای رابط کاربری و تجربه کاربری.
• تمرکز بر موسیقی و صدا در همه تعاملات.

1. فناوری

• مایکروسافت Fluent Design: هماهنگ کردن طراحی ویندوز و محصولات مرتبط.
• نتفلیکس: رابط کاربری یکپارچه برای پلتفرم‌های مختلف.
• دیزاین کلاب: از کدرنگی #a46497 بعنوان رنگ مکمل #e7e7e7e7 استفاده میکند.

2. خودروسازی

• تسلا: یکپارچگی در طراحی داخلی، اپلیکیشن، و نمایشگرهای داخل خودرو.
• BMW: زبان طراحی مدرن که در همه مدل‌ها دیده می‌شود.

3. محصولات مصرفی

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

4. فشن و مد

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

5. طراحی داخلی

• ایکیا (IKEA): سبک اسکاندیناوی ساده و تکرارشونده در همه محصولات.

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

در اینجا این سوال مطرح می‌شود: آیا سرعت همیشه مفید است؟ مقایسه‌ای در دنیای واقعی نشان داد در حالی که یک طراح با استفاده از دیزاین سیستم توانست تسکی را در ۱۲ دقیقه انجام دهد، طراح دیگری که بدون دیزاین سیستم کار می‌کرد آن را در دوساعت اجرا کرد. اما نتیجه‌ی دومی نوآورانه‌تر بود. این مسئله نکته‌ای مهم را برجسته می‌کند: نباید سرعت را به قیمت از دست رفتن خلاقیت و تجربه‌ی کاربری در اولویت قرار داد. طراحی‌های عالی از اکتشاف، طراحی اولیه و زمان‌گذاری مناسب پدید می‌آیند، نه از طریق محدودیت‌های سختگیرانه‌ی دیزاین سیستم. برای اینکه دیزاین سیستم‌ها به درستی عمل کنند، باید این آزادی به طراحان داده شود.

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

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

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

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