Texture | بافت بصری
بافت بصری در طراحی رابط و برند یعنی کیفیت سطح: حس دانه، متریال، نویز، یا الگوی ریز که به چشم می‌گوید این سطح صاف دیجیتال ناب نیست، بلکه کاغذ، پارچه، فلز، شیشه مات، یا صفحهٔ دانهدار است—حتی وقتی انگشت فقط شیشهٔ لمسی را لمس می‌کند. بافت با رنگ‌گذاری تینت فرق دارد؛ تینت روشن‌تر کردن فام است، بافت ساختار سطح و ریزجزئیات است. همچنین با تایپوگرافی و سیستم تایپ یکی نیست، هرچند حروف می‌توانند بافت خودشان را داشته باشند. در محصول دیجیتال، بافت ابزار خلق عمق، گرما، تمایز برند، و گاهی سلسله‌مراتب است؛ اگر بی‌هدف و شلوغ شود، خوانایی و حس ارزان بودن می‌آورد. این مدخل دربارهٔ بافت به‌عنوان سطح بصری در UI و هویت است، نه جستار بلند پارچه‌شناسی.
سطح ادراک‌شده روی صفحهٔ تخت
صفحه‌نمایش عمق فیزیکی ندارد، اما مغز از نشانه‌های بصری متریال می‌سازد: گرادیان ملایم نور، نویز فیلم، دانهٔ کاغذ، الگوی نقطه‌ای، یا برجستگی بسیار ظریف. کارت محصول با سایه alone گاهی شناور و مصنوعی به نظر می‌رسد؛ افزودن بافت خیلی خفیف به پس‌زمینه یا سطح می‌تواند آن را «نشسته روی میز» کند. در برندهای دستی یا پایدار، بافت کاغذ و الیاف حس ساخت انسان می‌دهد. در برند فناوری سخت، بافت فلز برس‌خورده یا شیشه مات حس دقت صنعتی می‌فرستد. انتخاب بافت باید با شخصیت محصول یکی باشد نه مد لحظه‌ای شبکه‌های اجتماعی.
در اپ مالی محافظه‌کار، بافت سنگین ممکن است بی‌ثباتی القا کند؛ سطح آرام با بافت بسیار کم اعتماد می‌سازد. در اپ خلاقیت یا بازی، بافت غنی‌تر بخشی از جهان‌بینی است.
بافت در برابر تینت، سایه و الگوی تزئینی
تینت تغییر روشنایی/خلوط رنگ به سمت روشن است—مثلاً آبی خیلی کمرنگ زیر آلرت اطلاعاتی. بافت ممکن است همان تینت را داشته باشد یا نداشته باشد؛ حرفش ساختار سطح است. سایهٔ ارتفاع لایه را جدا می‌کند؛ بافت خود سطح را توصیف می‌کند. الگوی بزرگ تکرارشونده—مثل شکل‌های هندسی درپس‌زمینهٔ هیرو—گاهی بافت خوانده می‌شود اما اگر مقیاس درشت باشد بیشتر موتیف است تا بافت ریز. در نقد طراحی دقیق بگویید: مشکل تینت کم‌کنتراست است یا دانهٔ بافت روی متن خوانایی را کشته است؟ قاطی کردن این واژه‌ها باعث دستکاری اشتباه توکن رنگ به‌جای لایهٔ بافت می‌شود.
اشباع و فام هم جدایند: می‌توان بافت خاکستری کم‌اشباع داشت یا بافت رنگی. بافت جایگزین کنتراست متن نیست.
سلسله‌مراتب و تأکید بدون جیغ رنگ
بافت می‌تواند ناحیه را جدا کند وقتی نمی‌خواهید رنگ اشباع‌بالا اضافه کنید: سایدبار با دانهٔ خیلی ملایم، محتوای اصلی صاف‌تر. سطح اقدام اصلی معمولاً صاف‌تر و تمیزتر می‌ماند تا بافت پس‌زمینه توجه را ندزدد. اگر همه‌جا بافت یکسان و قوی باشد، سلسله‌مراتب از بین می‌رود—مثل اتاقی که همه دیوارها کاغذدیواری شلوغ دارند. الگوی سالم: بافت در سطوح بزرگ و پس‌زمینه، سکوت نسبی روی متن و کنترل‌های حیاتی.
در داشبورد داده، بافت زیر نمودار خطر تداخل با خطوط شبکه و سری‌ها را دارد؛ بهتر است محدود به پوستهٔ صفحه بماند نه داخل خود visualization.
انواع رایج در UI و برند
نویز و گرین: لایهٔ شفاف بسیار کم برای شکستن یکنواختی گرادیان تخت و حس آنالوگ. کاغذ و فیبر: مناسب محتوای تحریریه، دفترچه، برندهای دستی. پارچه و کتان: نرمش در برند سبک زندگی—با احتیاط در کنتراست. شیشه مات و بلور: در سبک glassmorphism؛ زیاده روی سریع تاریخ‌مصرف می‌شود و روی متن ضعف می‌سازد. متریال سخت: خطوط میکرو، برس فلزی، کربن—بیشتر در خودرو، صدا، یا ابزار حرفه‌ای. الگوی نقطه‌ای یا هاشور ریز: گاهی برای وضعیت خالی یا اسکلتون، گاهی برای جدا کردن ناحیه. هر نوع باید در سیستم طراحی نام و محدودیت استفاده داشته باشد.
بافت می‌تواند تصویری باشد یا با SVG/CSS ساخته شود. تصویر سنگین بدون بهینه‌سازی عملکرد را می‌زند؛ نویز CSS یا SVG کاشی‌شونده اغلب سبک‌تر است.
خوانایی، دسترس‌پذیری و حرکت
متن روی بافت شلوغ شکست کلاسیک است. حداقل کنتراست WCAG را با بافت پشت سر حساب کنید نه فقط با رنگ پایه؛ دانه کنتراست محلی را کم می‌کند. کاربران با حساسیت بصری یا میگرن ممکن است از نویز زیاد آزرده شوند. برای حالت کاهش حرکت یا نمایش ساده‌تر، نسخهٔ بدون بافت یا بافت حداقلی بگذارید. هرگز معنی وضعیت—خطا، موفقیت—را فقط با تغییر بافت نرسانید؛ رنگ، متن و آیکون لازم‌اند. در نمودارها، بافت می‌تواند به‌عنوان الگو برای تمایز سری‌ها در کنار رنگ به دسترس‌پذیری کمک کند—به شرط راهنما و افسانهٔ واضح.
زوم مرورگر و صفحه‌های کم‌کیفیت، بافت ریز را به آلودگی تبدیل می‌کنند. در اندازهٔ موبایل، بافت درشت‌تر یا حذف آن را بیازمایید.
توکن و سیستم طراحی
مثل رنگ، بافت را توکن کنید: نام معنایی مثل surface.subtleNoise یا brand.paper، نه فایل تصادفی در هر صفحه. مشخص کنید روی چه سطوحی مجاز است، حداکثر شدت، و رفتار در تم تاریک. تم تاریک نویز را متفاوت نشان می‌دهد؛ کپی کور از تم روشن اغلب کثیف می‌شود. در Figma، استایل یا کامپوننت پس‌زمینهٔ بافت‌دار با نسخهٔ بدون بافت برای حالت فشرده نگه دارید. در کد، لایهٔ جدا با pointer-events خاموش و کنتراست تست‌شده جلوی نفوذ بافت به کنترل‌ها را می‌گیرد.
مستند کوتاه «بافت برای پوسته، نه برای متن» عملی‌تر از ممنوعیت مبهم شلوغی است.
مارکتینگ، هیرو و محصول واقعی
لندینگ ممکن است بافت غنی برای اتمسفر بخواهد؛ داخل اپ همان بافت اگر روی هر کارت تکرار شود خستگی می‌آورد. گسست ادراکی خطرناک است: تبلیغ لمس پارچه، محصول UI پلاستیکی تخت. هماهنگی سطح بین نقاط تماس برند را یکپارچه می‌کند بدون اینکه کاربرد را قربانی کند. عکس محصول با بافت واقعی—چوب، پارچه، فلز—گاهی قوی‌تر از بافت CSS جعلی است؛ انتخاب رسانه بخشی از تصمیم طراحی است.
آنتی‌پترن و تمرین چشمی
آنتی‌پترن‌ها: بافت قوی روی بدنهٔ متن، چند بافت متضاد در یکviewport، استفاده از بافت برای پوشاندن ضعف سلسله‌مراتب، و فایل‌های فشردنشده. تمرین: یک صفحه را با و بدون بافت مقایسه کنید؛ اگر بدون بافت ساختار بمیرد، مشکل بافت نیست مشکل چیدمان است. تمرین دوم: شدت نویز را نصف کنید و ببینید برند هنوز خودش است یا فقط کثیف‌تر شده بود. تمرین سوم: همان بافت را روی تم تاریک بگذارید و کنتراست متن را دوباره اندازه بگیرید.
جمع‌بندی: بافت بصری کیفیت سطح و متریال ادراک‌شده در UI و برند است، متمایز از تینت و از سایهٔ ارتفاع. وقتی کنترل‌شده و توکن‌شده به کار رود، عمق و شخصیت می‌سازد؛ وقتی همه‌جا فریاد بزند، خوانایی و اعتماد را می‌گیرد. برای تیم محصول، سؤال مفید این است: این بافت سطح را توصیف می‌کند یا ضعف ساختار را مخفی؟ جواب صادقانه، طراحی را از تزئین نجات می‌دهد.
در سیستم چندبرندی یا white-label، اجازهٔ بافت سفارشی مشتری را محدود کنید وگرنه هر مستأجر یک نویز نئونی روی متن می‌گذارد. سقف شدت و فهرست بافت‌های تأییدشده، مثل سقف اشباع در پالت رنگ، از آشوب جلوگیری می‌کند. در نهایت بافت خوب اغلب ناپیدا کار می‌کند: حس می‌شود که محصول «جنس دارد»، بدون اینکه کاربر بتواند لایه را نام ببرد.
برای آموزش تیم، سه کارت یکسان با سطح صاف، نویز خفیف، و کاغذ دانهدار کنار هم بگذارید و بپرسید کدام credibleتر برای برند شماست. همان تمرین را روی دکمه و روی پس‌زمینه تکرار کنید؛ جواب‌ها معمولاً فرق می‌کنند و نشان می‌دهند بافت ابزار زمینه‌است نه ابزار تأکید اقدام.
سوالات متداول
کیفیت سطح و متریال ادراک‌شده—دانه، نویز، کاغذ، فلز و مانند آن—که به صفحه عمق و شخصیت می‌دهد بدون اینکه لزوماً فام عوض شود.
تینت روشن‌تر کردن رنگ است؛ بافت ساختار و ریزجزئیات سطح است. می‌توانند با هم بیایند اما یک مفهوم نیستند.
عمدتاً در پس‌زمینه و پوسته برای اتمسفر برند؛ روی متن و کنترل‌های حیاتی کم یا هیچ تا خوانایی حفظ شود.
می‌تواند؛ بافت شلوغ کنتراست را کم و چشم را خسته می‌کند. کنتراست را روی بافت واقعی بسنجید و نسخهٔ ساده‌تر بگذارید.
با توکن نام‌دار، شدت مشخص، قواعد سطح مجاز، و رفتار جدا برای تم تاریک—نه فایل پراکنده در هر صفحه.