آبجکت را از نقش آن در صفحه شروع کنید
در این بخش، معنا و فرم را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
طراحی وب در تصویر ثابت بسیار بخشنده است. همه منابع حاضرند، متنها کاملاند و هیچکس با انگشت خیس، اینترنت کند یا نور شدید صفحه را نمیبیند. محصول واقعی اینطور رفتار نمیکند. برای همین هر تصمیم بصری باید یک بار در زمان، یک بار در عرض و یک بار در زمینه استفاده واقعی بازبینی شود. در موضوع «آبجکت را از نقش آن در صفحه شروع کنید»، بهتر است از خود معنا و فرم شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
در پروژه واقعی، هیچ قانون بصری نباید از محتوا جدا بماند. تیتر کوتاه و تیتر دوخطی، تصویر عمودی و افقی، متن کم و متن تخصصی باید همان الگو را امتحان کنند. این برخورد با لبههاست که نشان میدهد طراحی انعطاف دارد یا فقط برای یک نمونه ساخته شده است. برای معنا و فرم، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود آبجکت را از نقش آن در صفحه شروع کنید نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. در پایان، کیفیت را با مقایسه قبل و بعد از یک تصمیم بسنجید، نه با تعداد جزئیات اضافهشده. اگر مسیر کوتاهتر، محتوا خواناتر و حالتهای واقعی قابل پیشبینیتر شدهاند، طراحی کار خودش را انجام داده. باقی چیزها باید در خدمت همین نتیجه بمانند.
این صحنه، رابطه اجزای اصلی در آرتدایرکشن سهبعدی را بهصورت یک ساختار واحد نشان میدهد.
یک خانواده به دوربین و نور مشترک نیاز دارد
در این بخش، انسجام بصری را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
بعضی انتخابها در ابتدا کوچکاند اما در صد صفحه تکثیر میشوند. یک اندازه تیتر، یک فاصله اشتباه یا یک الگوی کارت بیدلیل، بهتدریج به لحن کل سایت تبدیل میشود. حرفهایبودن یعنی همین تصمیمهای کوچک را پیش از تکثیر ببینیم و برایشان قاعدهای روشن بسازیم. در موضوع «یک خانواده به دوربین و نور مشترک نیاز دارد»، بهتر است از خود انسجام بصری شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
برای تصمیمگیری بهتر، سه قاب کنار هم بگذارید: محتوای واقعی فارسی، عرض کوچک موبایل و حالتی که داده یا تصویر هنوز بارگیری نشده است. اگر ساختار در هر سه قاب قابل فهم ماند، انتخاب احتمالاً از جنس سیستم است. اگر فقط در ماکت ایدهآل جواب داد، هنوز بیش از آنکه طراحی باشد یک تصویر خوب است. برای انسجام بصری، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود یک خانواده به دوربین و نور مشترک نیاز دارد نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. هیچ نسخهای برای همیشه نهایی نیست. محتوا رشد میکند، دستگاهها تغییر میکنند و کاربران رفتارهایی نشان میدهند که در اتاق طراحی پیشبینی نشده بود. یک سیستم سالم امکان اصلاح میدهد، بدون آنکه هر تغییر کوچک هویت و ساختار کل سایت را از نو بسازد.
- نقش انسجام بصری را پیش از شکل آن تعریف کنید
- نمونه را با محتوای واقعی فارسی بسنجید
- رفتار موبایل و حالتهای غیرایدهآل را جدا ببینید
پسزمینه شفاف، صحنه را به طراح میسپارد
در این بخش، cutout و ترکیب را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
بیایید این بخش را با یک صحنه آشنا شروع کنیم. صفحه روی مانیتور کامل به نظر میرسد، اما وقتی نگاه از بالا تا پایین حرکت میکند، معلوم نیست کدام تصمیم واقعاً مهمتر است. در چنین لحظهای مشکل کمبود زیبایی نیست؛ مشکل این است که طراحی هنوز ترتیب دیدن و فهمیدن را مشخص نکرده. راهحل از افزودن یک افکت تازه نمیآید، از روشنکردن مسئولیت هر لایه میآید. در موضوع «پسزمینه شفاف، صحنه را به طراح میسپارد»، بهتر است از خود cutout و ترکیب شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
در پروژه واقعی، هیچ قانون بصری نباید از محتوا جدا بماند. تیتر کوتاه و تیتر دوخطی، تصویر عمودی و افقی، متن کم و متن تخصصی باید همان الگو را امتحان کنند. این برخورد با لبههاست که نشان میدهد طراحی انعطاف دارد یا فقط برای یک نمونه ساخته شده است. برای cutout و ترکیب، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود پسزمینه شفاف، صحنه را به طراح میسپارد نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. خروجی خوب قرار نیست در هر صفحه خودش را معرفی کند. وقتی قواعد درستاند، کاربر فقط احساس میکند صفحه آرام، روشن و قابل اعتماد است. طراح اما باید بداند این آرامش نتیجه مجموعهای از انتخابهای آگاهانه است: چه چیزی دیده شود، چه چیزی عقب بماند و چه زمانی رابط پاسخ بدهد.
نمای دوم از فرم کلی فاصله میگیرد و روی اتصال تصمیمهای ریز به تجربه نهایی تمرکز میکند.
متریال باید با لحن برند هماهنگ باشد
در این بخش، سطح و رنگ را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
در جلسه نقد معمولاً کسی میگوید «یک چیزی اینجا کم است». این جمله اغلب به معنای نیاز به عنصر تازه نیست. شاید فاصله، وزن، نامگذاری یا ترتیب محتوا نتوانسته رابطه اجزا را توضیح دهد. پیش از افزودن هر چیز، بهتر است همان چیزهای موجود را از نظر نقش، ریتم و رفتار دوباره ببینیم. در موضوع «متریال باید با لحن برند هماهنگ باشد»، بهتر است از خود سطح و رنگ شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
برای تصمیمگیری بهتر، سه قاب کنار هم بگذارید: محتوای واقعی فارسی، عرض کوچک موبایل و حالتی که داده یا تصویر هنوز بارگیری نشده است. اگر ساختار در هر سه قاب قابل فهم ماند، انتخاب احتمالاً از جنس سیستم است. اگر فقط در ماکت ایدهآل جواب داد، هنوز بیش از آنکه طراحی باشد یک تصویر خوب است. برای سطح و رنگ، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود متریال باید با لحن برند هماهنگ باشد نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. در پایان، کیفیت را با مقایسه قبل و بعد از یک تصمیم بسنجید، نه با تعداد جزئیات اضافهشده. اگر مسیر کوتاهتر، محتوا خواناتر و حالتهای واقعی قابل پیشبینیتر شدهاند، طراحی کار خودش را انجام داده. باقی چیزها باید در خدمت همین نتیجه بمانند.
- نقش سطح و رنگ را پیش از شکل آن تعریف کنید
- نمونه را با محتوای واقعی فارسی بسنجید
- رفتار موبایل و حالتهای غیرایدهآل را جدا ببینید
کادر و object-fit را با خود فرم تنظیم کنید
در این بخش، نمایش کامل را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
طراحی وب در تصویر ثابت بسیار بخشنده است. همه منابع حاضرند، متنها کاملاند و هیچکس با انگشت خیس، اینترنت کند یا نور شدید صفحه را نمیبیند. محصول واقعی اینطور رفتار نمیکند. برای همین هر تصمیم بصری باید یک بار در زمان، یک بار در عرض و یک بار در زمینه استفاده واقعی بازبینی شود. در موضوع «کادر و object-fit را با خود فرم تنظیم کنید»، بهتر است از خود نمایش کامل شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
در پروژه واقعی، هیچ قانون بصری نباید از محتوا جدا بماند. تیتر کوتاه و تیتر دوخطی، تصویر عمودی و افقی، متن کم و متن تخصصی باید همان الگو را امتحان کنند. این برخورد با لبههاست که نشان میدهد طراحی انعطاف دارد یا فقط برای یک نمونه ساخته شده است. برای نمایش کامل، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود کادر و object-fit را با خود فرم تنظیم کنید نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. هیچ نسخهای برای همیشه نهایی نیست. محتوا رشد میکند، دستگاهها تغییر میکنند و کاربران رفتارهایی نشان میدهند که در اتاق طراحی پیشبینی نشده بود. یک سیستم سالم امکان اصلاح میدهد، بدون آنکه هر تغییر کوچک هویت و ساختار کل سایت را از نو بسازد.
عمق را با سه لایه کنترل کنید
در این بخش، foreground و background را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
بعضی انتخابها در ابتدا کوچکاند اما در صد صفحه تکثیر میشوند. یک اندازه تیتر، یک فاصله اشتباه یا یک الگوی کارت بیدلیل، بهتدریج به لحن کل سایت تبدیل میشود. حرفهایبودن یعنی همین تصمیمهای کوچک را پیش از تکثیر ببینیم و برایشان قاعدهای روشن بسازیم. در موضوع «عمق را با سه لایه کنترل کنید»، بهتر است از خود foreground و background شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
برای تصمیمگیری بهتر، سه قاب کنار هم بگذارید: محتوای واقعی فارسی، عرض کوچک موبایل و حالتی که داده یا تصویر هنوز بارگیری نشده است. اگر ساختار در هر سه قاب قابل فهم ماند، انتخاب احتمالاً از جنس سیستم است. اگر فقط در ماکت ایدهآل جواب داد، هنوز بیش از آنکه طراحی باشد یک تصویر خوب است. برای foreground و background، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود عمق را با سه لایه کنترل کنید نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. خروجی خوب قرار نیست در هر صفحه خودش را معرفی کند. وقتی قواعد درستاند، کاربر فقط احساس میکند صفحه آرام، روشن و قابل اعتماد است. طراح اما باید بداند این آرامش نتیجه مجموعهای از انتخابهای آگاهانه است: چه چیزی دیده شود، چه چیزی عقب بماند و چه زمانی رابط پاسخ بدهد.
- نقش foreground و background را پیش از شکل آن تعریف کنید
- نمونه را با محتوای واقعی فارسی بسنجید
- رفتار موبایل و حالتهای غیرایدهآل را جدا ببینید
نسخه موبایل به ترکیب متفاوت نیاز دارد
در این بخش، art direction mobile را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
بیایید این بخش را با یک صحنه آشنا شروع کنیم. صفحه روی مانیتور کامل به نظر میرسد، اما وقتی نگاه از بالا تا پایین حرکت میکند، معلوم نیست کدام تصمیم واقعاً مهمتر است. در چنین لحظهای مشکل کمبود زیبایی نیست؛ مشکل این است که طراحی هنوز ترتیب دیدن و فهمیدن را مشخص نکرده. راهحل از افزودن یک افکت تازه نمیآید، از روشنکردن مسئولیت هر لایه میآید. در موضوع «نسخه موبایل به ترکیب متفاوت نیاز دارد»، بهتر است از خود art direction mobile شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
در پروژه واقعی، هیچ قانون بصری نباید از محتوا جدا بماند. تیتر کوتاه و تیتر دوخطی، تصویر عمودی و افقی، متن کم و متن تخصصی باید همان الگو را امتحان کنند. این برخورد با لبههاست که نشان میدهد طراحی انعطاف دارد یا فقط برای یک نمونه ساخته شده است. برای art direction mobile، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود نسخه موبایل به ترکیب متفاوت نیاز دارد نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. در پایان، کیفیت را با مقایسه قبل و بعد از یک تصمیم بسنجید، نه با تعداد جزئیات اضافهشده. اگر مسیر کوتاهتر، محتوا خواناتر و حالتهای واقعی قابل پیشبینیتر شدهاند، طراحی کار خودش را انجام داده. باقی چیزها باید در خدمت همین نتیجه بمانند.
کیفیت را با بودجه فایل متعادل کنید
در این بخش، فرمت و عملکرد را نه بهعنوان یک تکنیک جدا، بلکه در نسبت با کل تجربه صفحه بررسی میکنیم.
در جلسه نقد معمولاً کسی میگوید «یک چیزی اینجا کم است». این جمله اغلب به معنای نیاز به عنصر تازه نیست. شاید فاصله، وزن، نامگذاری یا ترتیب محتوا نتوانسته رابطه اجزا را توضیح دهد. پیش از افزودن هر چیز، بهتر است همان چیزهای موجود را از نظر نقش، ریتم و رفتار دوباره ببینیم. در موضوع «کیفیت را با بودجه فایل متعادل کنید»، بهتر است از خود فرمت و عملکرد شروع کنیم. این زاویه تصمیم را از پسند شخصی جدا میکند و به نقشی که باید در تجربه صفحه داشته باشد برمیگرداند؛ جایی که میتوان درباره نتیجه حرف زد، نه فقط درباره زیبا یا نازیبا بودن.
برای تصمیمگیری بهتر، سه قاب کنار هم بگذارید: محتوای واقعی فارسی، عرض کوچک موبایل و حالتی که داده یا تصویر هنوز بارگیری نشده است. اگر ساختار در هر سه قاب قابل فهم ماند، انتخاب احتمالاً از جنس سیستم است. اگر فقط در ماکت ایدهآل جواب داد، هنوز بیش از آنکه طراحی باشد یک تصویر خوب است. برای فرمت و عملکرد، نمونه را با متن کوتاه و بلند، حالت عادی و خطا، و دو اندازه کاملاً متفاوت بررسی کنید. تفاوتها را یادداشت کنید و فقط قاعدهای را وارد سیستم کنید که دلیلش در خروجی قابل دیدن باشد.
در عمل، این بخش با یک بار نگاهکردن تمام نمیشود. طراح، نویسنده و توسعهدهنده هرکدام لبه متفاوتی را میبینند. کنار هم گذاشتن این نگاهها باعث میشود کیفیت را با بودجه فایل متعادل کنید نه یک تزئین جدا، بلکه بخشی از ساختار قابل نگهداری سایت باشد. هیچ نسخهای برای همیشه نهایی نیست. محتوا رشد میکند، دستگاهها تغییر میکنند و کاربران رفتارهایی نشان میدهند که در اتاق طراحی پیشبینی نشده بود. یک سیستم سالم امکان اصلاح میدهد، بدون آنکه هر تغییر کوچک هویت و ساختار کل سایت را از نو بسازد.
- نقش فرمت و عملکرد را پیش از شکل آن تعریف کنید
- نمونه را با محتوای واقعی فارسی بسنجید
- رفتار موبایل و حالتهای غیرایدهآل را جدا ببینید