‏آیکون‌های ترکیبی و تلهٔ گرامر مبهم

هلنا ژانگ تو این مقاله سراغ آیکون‌های ترکیبی (compound icons) می‌ره: وقتی دو نماد رو کنار هم می‌ذاریم تا معنی دقیق‌تری بسازیم. مثال ساده‌ش یه نماد پایه (گوشی تلفن) به‌علاوهٔ یه تغییردهنده یا modifier (علامت مثبت) هست که با هم می‌گن «افزودن شماره تلفن».

به گفتهٔ نویسنده، قدرت این آیکون‌ها تو مشخص‌تر کردن معنیه: چی رو اضافه می‌کنیم؟ یه تلفن، یه پوشه، یه کاربر، یه موقعیت مکانی. این وقتی به کار می‌آد که آیکون بدون برچسب متنی زندگی می‌کنه، یا وقتی می‌خوایم آیتم‌ها رو از هم تفکیک کنیم — مثلاً تو یه لیست از پوشه‌ها با یه نگاه بفهمیم کدوم خصوصیه و کدوم اشتراکی.

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

نکتهٔ فنی مهم اینه که تو هر کدوم از این جانمایی‌ها، دو جزء باید مجزا خونده بشن. نویسنده سه راه برای ایجاد این جدایی پیشنهاد می‌ده: گذاشتن یه فاصله یا شکاف تا آیکون پایه پشت مودیفایر فرو بره، دادن یه fill به مودیفایر تا بیاد جلو، یا رنگی کردن دو بخش. تو موارد نادر هم می‌شه فرم‌ها رو ادغام کرد تا یه المان دو معنی بده؛ مثل آیکون user-switch که دایرهٔ بیرونی‌ش هم نقش فلش‌های چرخشی رو داره و هم ظرفی برای کاربره.

بخش دوم مقاله دربارهٔ دردسرهاست. اول از همه، آیکون ترکیبی جزئیات بیشتری رو تو همون فضای محدود جا می‌ده؛ یه اندازهٔ رایج دیجیتال مثل ۲۴ در ۲۴ پیکسل ظرفیت محدودی داره. برای جا دادن مودیفایر، گاهی مجبوری آیکون پایه رو بشکنی و همین خوانایی رو از بین می‌بره، مخصوصاً هرچی آیکون کوچیک‌تر بشه.

مشکل دوم که به نظر نویسنده دردسرسازتره، ابهام زبانیه: آیکون ترکیبی از تو می‌خواد دو نماد و رابطهٔ بینشون رو تفسیر کنی، یعنی یه جور گرامر وارد ماجرا می‌شه — گرامری مبهم که سرش توافقی وجود نداره. مثال خودش اینه که یه آیکون مشخص یعنی «تغییر رمز عبور» یا «قفل چرخش دستگاه»؟ اصلاً کدوم المان مودیفایره و کدوم داره تغییر داده می‌شه؟

مشکل سوم نبود تمایزه: آیکون‌های ترکیبی که آیکون پایهٔ مشترک دارن خیلی شبیه هم می‌شن. نویسنده به تاریخچهٔ تماس واتساپ روی iOS اشاره می‌کنه که تشخیص فلش کوچیک «تماس ورودی» از «تماس خروجی» سخته. پیشنهادش اینه که چون کاربر از قبل می‌دونه تو صفحهٔ تماس‌های اخیره، اصلاً گوشی رو حذف کنیم و فلش‌ها رو بزرگ‌تر بکشیم تا تمرکز روی «ورودی» و «خروجی» بره، نه روی «تماس» — کاری که نسخهٔ اندروید واتساپ انجام می‌ده و با رنگ‌بندی، تماس‌های کامل و بی‌پاسخ رو هم از هم جدا می‌کنه.

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

نکات کلیدی:

• آیکون ترکیبی از یه نماد پایه و یه مودیفایر کوچیک ساخته می‌شه تا معنی مشخص‌تر بشه
• جای مودیفایر می‌تونه داخل، گوشه یا روی آیکون پایه باشه؛ خط اریب یعنی غیرفعال یا ممنوع
• دو جزء باید مجزا خونده بشن: با شکاف، با fill، یا با رنگ‌بندی
• تو اندازه‌های کوچیک مثل ۲۴ پیکسل، شکستن آیکون پایه خوانایی رو خراب می‌کنه
• گرامر آیکون‌های ترکیبی مبهمه؛ معلوم نیست کدوم جزء داره کدوم رو تغییر می‌ده
• گاهی حذف آیکون پایه و بزرگ کردن مودیفایر (مثل نسخهٔ اندروید واتساپ) جواب بهتری می‌ده