مجله خبری هاست ایران » طراحی و توسعه » ۱۰ نکته برای طراحی زبان بصری یا زبان تصویری
  • mag-telegram.jpg
  • landing96-300-420.jpg
طراحی و توسعه طراحی وب گرافیک

۱۰ نکته برای طراحی زبان بصری یا زبان تصویری

۱۰ نکته برای طراحی زبان بصری یا زبان تصویری

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

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

زبان تصویری درست، یکی از انواع روش‌های ارتباطی است!

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

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

۱۰ نکته که بهتر است در طراحی زبان تصویری برند خود از آن‌ها استفاده کنید:

۱- پالت رنگ طراحی کنید

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


مقاله مرتبط: ١٢ وب سایت کاربردی برای انتخاب رنگ بندی مناسب


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

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

انتخاب پالت رنگی

به رنگ‌های برند فست‌فود زنجیره‌ای McDonald’s توجه کنید: زرد و قرمز. این رنگ‌ها شادی (زرد) و گرسنگی (قرمز) را بیان می‌کنند. تابه‌حال چند بار این برند را بدون طاق‌های طلایی معروفش یا رنگ قرمز روی بسته‌بندی دیده‌اید؟!

۲-سلسله‌مراتب تایپوگرافی طراحی کنید

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

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

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

رنگ های استفاده شده در airbnb

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

۳- گرید ایجاد کنید

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

قالب چینش یا همان گرید شما به این سؤال پاسخ خواهد داد.

FreeCodeCamp این ساختار را به‌خوبی توضیح می‌دهد:

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

به زبان ساده: سادگی یا پیچیدگی گرید، چه چیزی را در مورد شما بیان می‌کند؟

۴– مجموعه‌ای از مؤلفه‌ها ایجاد کنید

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

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


مقاله مرتبط: راهنمای سبک (style guide) برای طراحی سایت


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

ساخت مجموعه مؤلفه‌های معمولی در ابتدا کار خسته‌کننده‌ای به نظر می‌آید؛ اما در آینده، ساخت صفحه‌های تازه وب‌سایت را بسیار آسان خواهد کرد.

۵-به سبک تصویری خاصی اهمیت دهید

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

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

استفاده از رنگ ها در طراحی سایت

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

۶– قوانینی برای انیمیشن ایجاد کند

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

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

انیمیشن زیر از mojito shot from Dribbble حرکت چرخشی دارد. به انیمیشن‌های دیگر فکر کنید که در زبان تصویری مشابه چگونه به نظر خواهند آمد. آن‌ها هم ممکن است به‌صورت چرخشی و با سرعت مشابه حرکت کنند.

استفاده از انیمیشن در طراحی سایت

۷– کلمه‌ها و تصاویر را باهم هماهنگ کنید

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

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

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

تاثیر رنگ ها در طراحی

۸– با خودتان روراست باشید

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

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

شخصیت های کارتونی در طراحی

۹– ثابت بمانید

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

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

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

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

استفاده از رنگ ها در طراحی زبان بصری

۱۰– راهنمای سبک بسازید و بر استفاده از آن تأکید کنید

یک زبان تصویری ایجاد کرده و آن را به قانون تبدیل کنید.

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

ساخت زبان تصویری برند

کلام آخر

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

 

ابزار بهینه سازی وب هاست ایران

افزودن دیدگاه

کلیک برای ثبت دیدگاه