اصول طراحی چاپ که هر طراح باید بداند
طراحان چاپ دههها پیش سلسله مراتب، شبکه، ریتم و محدودیت را حل کردند. در اینجا راهنمای جامعی از آنچه طراحان دیجیتال باید در سال 2026 به کار گیرند، آمده است.
طراحان چاپ تقریباً هر چیزی را که شما روی صفحه نمایش با آن دست و پنجه نرم میکنید، کشف کردهاند. آنها این را قبل از تولد شما، با بودجههای کمتر، با ابزارهای بدتر و با نظم بیرحمانهی ضربالاجلهایی که ساعت سه صبح از دستگاه چاپ خارج میشدند، کشف کردند.
هر موج طراحی دیجیتال، کار آنها را به آرامی و به طرز بدی دوباره کشف میکند. ما هر پنج سال یک سیستم شبکه جدید اختراع میکنیم. ما سلسله مراتب را به عنوان "وزن بصری" تغییر نام میدهیم و وانمود میکنیم که تازه است. ما در مورد فضای سفید بحث میکنیم، انگار که یک ایدهی استارتاپی است.
این حوزه قبلاً بیشتر این مشکل را حل کرده است. کار در یک نسخه صحافی شده از مجلهی Wired از سال ۱۹۹۵ یا یک مجلهی جیبی Penguin از سال ۱۹۴۷ قرار دارد و منتظر است تا شما واقعاً آن را ببینید. چاپ یک موزه نیست. این یک کتابخانهی فعال است که به شما اجازه داده میشود وارد آن شوید، هر آنچه را که نیاز دارید بردارید و از آن خارج شوید.
چرا چاپ این مشکل را اول حل کرد و ما مدام فراموش میکنیم
چاپ محدودیتهایی داشت، اما دیجیتال هنوز وانمود میکند که از آن معاف است. یک صفحه یک بوم ثابت است. چاپ و ارسال یک مجله هزینهی واقعی دارد.
هر تصمیمی هزینهای داشت و آن هزینه، محدودیت ویراستاری را ایجاب میکرد. طراحان چاپ نیز مجبور بودند برای جلب توجه خواننده در برابر انتشار بعدی بجنگند، نه در برابر تیکتاک. رقابت صادقانه بود. ابزارها به نوع، تصویر، رنگ، کاغذ و شبکه محدود بودند.
با این پنج چیز، ماسیمو ویگنلی هویت یونیمارک را برای خطوط هوایی آمریکا ساخت. پائولا شر نمادینترین پوسترهای پنتاگرام را ساخت. ویم کروول زبان بصری موزه استدلیک را ساخت. پنج ابزار، دههها سابقه.
طراحان دیجیتال هزار ابزار دارند و اکثر ما هنوز نمیتوانیم صفحه فرودی بسازیم که به خوانندهاش احترام بگذارد. محدودیت، ابزارها نیستند. محدودیت این است که هیچکس ما را مجبور به مطالعه پیشینه نکرده است.
هفت اصل چاپ کشف شد
اگر جنبه عاشقانه را کنار بگذارید، هفت اصل خواهید داشت که چاپ به خوبی انجام میدهد و دیجیتال همچنان در آنها گیر میکند.
- سلسله مراتب. یک چیز، لید است. هر چیز دیگری در خدمت لید است.
۲. گرید.** یک گرید قراردادی با خواننده است، نه قفسی برای طراح.
۳. ریتم.** صفحه به صفحه باید مانند یک قطعه موسیقی باشد، نه یک دستگاه اسلات.
۴. مقیاس.** چیزهای بزرگ بزرگ هستند چون لیاقتش را دارند، چیزهای کوچک کوچک هستند چون لیاقتش را هم دارند.
۵. کنتراست.** وزن، رنگ، تراکم و مقیاس تایپ. کنتراست نحوه حرکت چشم است.
۶. محدودیت.** بیشتر تصمیمات، تصمیماتی برای حذف هستند، نه اضافه کردن.
۷. احترام به خواننده. زمان، توجه و هوش خواننده، بودجهای است که خرج میکنید.
این هفت مورد در زیر هر شیء چاپی عالی قرار دارند. آنها در یک جلد شومیز پنگوئن دوران چیچولد و در جلد بلومبرگ بیزینسویک با ریچارد تورلی ظاهر میشوند. آنها به همان شکل در نقشه مترو وینلی و مقدمه مجله نیویورک تایمز ظاهر میشوند. نامها تغییر میکنند، اصول تغییر نمیکنند.
سلسله مراتب و شبکه: یک لید انتخاب کنید، آن را به یک قرارداد متصل کنید
هر شماره از بلومبرگ بیزینس ویک را از دوران ریچارد تورلی، تقریباً از ۲۰۱۰ تا ۲۰۱۴، باز کنید. هر صفحه یک لید دارد. لید بسیار بزرگ است، متن پشتیبان کوچک است، تصویر یا فریاد میزند یا زمزمه میکند، و هیچ سردرگمی در مورد اینکه از کجا شروع کنیم وجود ندارد.
آن را با یک صفحه بازاریابی SaaS معمولی در سال ۲۰۲۶ مقایسه کنید. تیتر اصلی، ابرو، زیرعنوان، سه بولت ویژه، توصیف و لکه گرادیان، همه میخواهند لید باشند. هیچکدام نیستند. خواننده از خواندن بازمیگردد.
اصلاح چاپ بیرحمانه است. به صفحه نمایش خود نگاه کنید، بپرسید کدام عنصر لید است و سپس هر عنصر دیگر را به طور قابل توجهی کوچکتر، سبکتر یا ساکتتر کنید. اگر دو عنصر در حال رقابت هستند، سلسله مراتب ندارید. شما سر و صدایی دارید که لباس سلسله مراتب را پوشیده است.
لید باید در جایی فرود بیاید. آن جایی شبکه است. یان چیچولد در اواخر دهه ۱۹۴۰ با استفاده از یک شبکهبندی چنان منظم، خط تولید کتابهای جیبی پنگوئن را بازسازی کرد که هنوز هم حس مدرن بودن را القا میکنند.
ویم کروول همین کار را برای طراحی شهری هلند انجام داد. ماسیمو ویگنلی سیستم Unigrid را روی هر بروشور خدمات پارک ملی در ایالات متحده قرار داد و آن بروشورها هنوز هم چاپ میشوند، هنوز هم خوانا و زیبا هستند، پنجاه سال بعد.
یک شبکهبندی آن دوازده ستونی نیست که چارچوب جلویی شما با آن ارائه میشود. یک شبکهبندی تضمین میکند که تیترها از یک مکان شروع شوند، زیرنویسها در یک ستون مشخص قرار گیرند، ناودانها حرکت نکنند، و چشم بتواند به صفحه اعتماد کند. خواننده شبکهبندی را نمیبیند. خواننده آن را حس میکند.
بیشتر محصولات دیجیتال شبکهبندی ندارند. آنها طرحبندیای دارند که از آخرین بررسی طراحی جان سالم به در برده است. این دو با هم یکسان نیستند.
ریتم و مقیاس: صفحه دوم را طراحی کنید، اندازه را به دست آورید
یک طراح چاپ به صورت گسترده فکر میکند، نه به صورت صفحات. یک مدیر هنری مجله، نحوهی شروع، نفس کشیدن، شتاب گرفتن و فرود یک مطلب ویژه را برنامهریزی میکند، همانطور که یک تدوینگر فیلم، صحنهای را کات میکند. مجلهی Wired در دوران کارسون و پلانکت به این امر مشهور بود. هر مطلب ویژه یک آهنگ بود، نه یک نت واحد.
طراحی دیجیتال به طور گسترده در تکصفحهها فکر میکند. قهرمان داستان صد ساعت توجه دریافت میکند، اسکرول دوم پانزده دقیقه و اسکرول سوم هیچ توجهی دریافت نمیکند. سپس ما تعجب میکنیم که چرا صفحات بازاریابی ما از پایین به پایین جمع میشوند.
حرکت را بدزدید. کل صفحه را به صورت توالی از ضربآهنگها طراحی کنید. اگر نمیتوانید ریتم را با صدای بلند توصیف کنید، صفحه ریتم ندارد.
مقیاس، پسرعموی بلند ریتم است. پوسترهای تئاتر عمومی پائولا شر، آموزشی در مقیاس هستند. حروف، پوستر را پر میکنند، در لبهها بریده میشوند و یک وزنهی واحد تمام کار را انجام میدهد.
اندازه، پیام است. شما حروف را میخوانید زیرا حروف، فضای داستان هستند.
طراحی دیجیتال تمایل دارد از حروف بزرگ به عنوان یک حس و حال به جای یک بیانیه استفاده کند. تیترهای چهل و هشت پیکسلی که میگویند «به پلتفرمی که به تیم شما قدرت میدهد خوش آمدید» به این دلیل بزرگ نیستند که خودشان آن را به دست آوردهاند. آنها بزرگ هستند زیرا سیستم طراحی یک توکن display-xl ارسال کرده و کسی از آن استفاده کرده است.
قانون چاپ ساده است. اگر یک متن بزرگ باشد، کلمات داخل آن باید ارزش آن اندازه را داشته باشند. یا کلمات شایسته اندازه هستند یا اندازه کاهش مییابد. گزینه سومی وجود ندارد.
پنج خطای دیجیتال، اصول چاپ، اصلاح
بدترین طراحی دیجیتال، یکی از پنج اشتباه تکراری است. هر کدام یک اصل چاپ دارند که آن را در تماس اصلاح میکند.
| اصل چاپ | خطای رایج دیجیتال | اصلاح | |---|---|---| | سلسله مراتب | همه چیز به یک اندازه است، هیچ چیز منجر نمیشود | یک سرنخ واحد را انتخاب کنید، بقیه را به طور قابل مشاهده کوچک کنید | | شبکه | طرح تزئینی، بدون ساختار زیرین | یک شبکه واقعی تنظیم کنید، هر عنصر را با آن تراز کنید، بدون استثنا | | خویشتنداری | فونتهای زیاد، کروم زیاد | فونتهای بزرگ در دو، حذف حاشیهها، سایهها، گرادیانهایی که کار نمیکنند | | مقیاس | تایپ بزرگ با کلمات ضعیف | کلمات را شایسته اندازه کنید، یا تایپ را کوچک کنید | | کنتراست | رابط کاربری خاکستری روی خاکستری تخت بدون لنگر | کنتراست وزن واقعی، لنگر رنگ واقعی، تغییر چگالی واقعی را اضافه کنید |
یک بار جدول را بخوانید و سپس محصول خودتان را بخوانید. حداقل سه مورد از این اشتباهات را در صفحهای که این ماه ارسال کردهاید، خواهید یافت. اشکالی ندارد، تقریباً همه آنها را دارند. نکته این است که آنها را نام ببرید تا بتوانید آنها را از بین ببرید.
خویشتنداری و احترام: دو اصلی که یادگیری آنها دردناک است
کار زندگی وینلی، جنگ با دکوراسیون بود. او پس از یک نقطه خاص، در کل از پنج فونت برای بقیه دوران حرفهای خود استفاده کرد. او معتقد بود که بیشتر مشکلات طراحی ناشی از اضافه کردن چیزی است که باید حذف میشد. او تقریباً در مورد هر یک از آنها درست میگفت.
خویشتنداری سختترین اصل برای درونی کردن است زیرا کار قابل مشاهده در طراحی چیزی است که شما اضافه میکنید. هیچکس گرادیانی که حذف کردید، آیکونی که کات کردید، فونت سومی که از بارگذاری آن خودداری کردید را تحسین نمیکند. خواننده، در سکوت، با تمام کردن صفحه، تحسین میکند.
یک قانون خصوصی مفید. قبل از اینکه صفحهای را ارسال کنید، سه عنصر را حذف کنید و ببینید آیا طرح هنوز کار میکند یا خیر. اگر کار میکند، عناصر را حذف شده نگه دارید.
احترام به خواننده، اصل محدودیت است. چاپخانه با خواننده مانند یک بزرگسال رفتار میکند. پنگوئن فرض کرده است که شما میتوانید یک رمان چهارصد صفحهای را که در گاراموند یازده نقطهای نوشته شده است، بدون هیچ نشانگر اسکرول، بدون نوار پیشرفت، بدون زمان تخمینی خواندن، بخوانید.
دیجیتال پانزده سال را بیسروصدا صرف توهین به خوانندگان خود کرده است. تراشههای زمان خواندن، نوارهای پیشرفت، بخشهای "TLDR" در داخل مقالاتی که خودشان خلاصه هستند. فرض این است که خواننده نمیتواند متن را بدون همراهی تحمل کند.
این فرض را دور بیندازید. خواننده شما یک بزرگسال است. آنها با خواندن به شما پاداش میدهند.
چگونه یک سرمقاله عالی را بخوانیم
یک شماره قدیمی از مجله نیویورک تایمز را بردارید، یا یک بلومبرگ بیزینسویک از سالهای تورلی را بردارید، یا هر گزارش سالانه پنتاگرام را بردارید. برای یک سرمقاله آماده شوید. حالا واقعاً نگاه کنید.
به تیتر توجه کنید. دقیقاً یکی وجود دارد. یا تیتر، تصویر یا یک نقل قول است.
به محل قرارگیری تیتر توجه کنید، تقریباً همیشه در تقاطع شبکهای، هرگز به خاطر مرکز قرار گرفتن در مرکز قرار نگرفته است. به نوع پشتیبانی توجه کنید، کوچکتر، اغلب سبکتر، هرگز با تیتر در تضاد نیست.
به فضای سفید توجه کنید، بیشتر از آنچه انتظار دارید، شکل داده شده، نه تصادفی. به زیرنویسها توجه کنید، ریز، متصل به یک ستون ثابت. به صفحات کوچک توجه کنید، که در یک مکان شناخته شده قرار دارند و حرکت نمیکنند.
این یک شبکهبندی کار میکند. این سلسله مراتب کار میکند. این ریتم کار میکند.
هر یک از این تصمیمات عمداً توسط یک شخص، در خدمت خواننده گرفته شده است.
درسهای تایپوگرافی که به طور واضح ترجمه میشوند
تایپوگرافی چاپی از سه جهت خاص، دههها از تایپوگرافی صفحه نمایش جلوتر است.
اول، نسبت مقیاس. طراحان چاپ یک مقیاس تایپوگرافی انتخاب میکنند و به آن پایبند میمانند. سوم بزرگ، چهارم کامل، نسبت طلایی، هر چه که باشد.
طراح صفحه نمایش انتخاب میکند "خب، سیستم طراحی هشت اندازه دارد و من از بیشتر آنها استفاده خواهم کرد." این یک مقیاس نیست. این یک بوفه است.
دوم، طول خط و فاصله بین خطوط. مرجع چاپ حدود شصت و شش کاراکتر در هر خط را برای نوع بدنه در نظر گرفت، با فاصله بین خطوط تقریباً صد و چهل درصد از اندازه فونت. طراحی وب به طور معمول پاراگرافهایی را ارسال میکند که صد و بیست کاراکتر عرض دارند و فاصله بین خطوط آنها کم است زیرا توکن سیستم طراحی این را گفته است.
سوم، جفت کردن حروف. قانون چاپ دو خانواده است، حداکثر، و آنها باید کارهای مختلفی انجام دهند. نمایش و متن، یا سریف و بدون خط.
قانون دیجیتال به نوعی تبدیل شد به "از اینتر استفاده کن و سپس چهار فونت دیگر اضافه کن زیرا تیم بازاریابی آنها را دوست دارد." اگر تعداد فونتهایتان را به دو محدود کنید، سلسله مراتب شما یک شبه واضحتر میشود.
درسهای طراحی جلد و فضای سفید
فضای سفید، نکتهی منفی طراحی نیست. خودِ طراحی است. مدرسهی سوئیسی این را در دههی ۱۹۵۰ آموزش داد و از آن زمان تاکنون دو بار آن را از دست دادهایم.
به یک پوستر مولر-بروکمن نگاه کنید. فضای سفید کار ساختاری انجام میدهد. نوشته را قاب میکند، چشم را هدایت میکند، به عناصر پر سر و صدا جایی برای فرود میدهد.
فضای سفید فقدان محتوا نیست. این بخشی از صفحه است که محتوا را قابل خواندن میکند. محصولات دیجیتال از فضای سفید وحشت دارند زیرا پیکسلهای خالی مانند املاک و مستغلات هدر رفته به نظر میرسند. اما اینطور نیست.
آنها فضای تنفسی هستند که به خواننده اجازه میدهند بماند. یک صفحه فرود با دو برابر فضای سفید، نرخ تبدیل بهتری نسبت به همان صفحه با دو برابر متن دارد. آن را روی محصول خودتان آزمایش کنید. توجه کنید چه اتفاقی میافتد.
یک جلد مجله دو ثانیه فرصت دارد تا کار خود را روی دکه روزنامه فروشی انجام دهد. باید برند را نشان دهد، داستان اصلی را بفروشد و در اندازهی تصویر کوچک زیبا به نظر برسد. طراحان تحریریه صد سال است که این مشکل را حل میکنند.
قهرمان صفحه اصلی شما، صفحه شروع شما، آیکون برنامه شما، تصویر اشتراکگذاری اجتماعی شما. همه اینها جلد هستند. همان قانون دو ثانیه.
کتابچه راهنما را بدزدید. یک ایده غالب، یک لنگر تایپوگرافی، یک تصویر که چشمک نمیزند. اگر قهرمان شما برای توضیح خود به سه خط متن نیاز داشته باشد، قهرمان نیست.
آنچه از چاپ به دیجیتال ترجمه نمیشود
چاپ همه چیز را حل نکرد. در مورد آنچه که مرجع نمیتواند به شما بدهد صادق باشید.
چاپ تعامل را حل نکرد. یک صفحه به یک ضربه پاسخ نمیدهد. مرجع چیزی در مورد وضعیت، بازخورد، مدیریت خطا یا لحظهای که کاربر کاری را که پیشبینی نکردهاید انجام میدهد به شما نمیآموزد.
چاپ حرکت را حل نکرد. طراحان تحریریه در سکون فکر میکنند. حرکت هنری است که شما از انیمیشن، فیلم و بازیها یاد میگیرید، نه از صفحه مجله.
چاپ طرحبندی واکنشگرا را حل نکرد. شبکه چاپی به شما نظم و انضباط میآموزد، اما شبکه واکنشگرا مشکلی است که علاوه بر آن حل میکنید.
اصل پابرجا میماند، پیادهسازی نه. اصول را در نظر بگیرید، فرضیات را رها کنید. اینگونه است که شما به درستی میدزدید.
ساخت یک سیستم طراحی تحت تأثیر چاپ
شما میتوانید همه اینها را در یک سیستم طراحی قرار دهید بدون اینکه کسی شما را عزیز خطاب کند. ترفند این است که اصول را به عنوان محدودیت رمزگذاری کنید، نه به عنوان تزئینات.
تعداد فونتهای خود را در دو محدود کنید. اندازه فونت خود را در شش، در مقیاس واقعی محدود کنید. نشانههای رنگی خود را در یک مجموعه کاری، با یک لهجه واحد که صدای بلند آن را به دست میآورد، محدود کنید.
نشانههای فاصله خود را به ریتمی محدود کنید که در نقاط شکست حفظ شود. نشانههای سایه و حاشیه خود را در کوچکترین مجموعه ای که کار را انجام میدهد، محدود کنید.
سپس قوانین استفاده را بنویسید. لید در هر نما بزرگترین عنصر است. شبکه مقدس است و ترازبندی غیرقابل مذاکره است. فضای سفید یک نشانه است، نه یک چیز اضافی.
تزئینات فقط زمانی اضافه میشود که کار ساختاری انجام دهد. این قوانین در مستندات سیستم طراحی، درست کنار اجزا قرار میگیرند و در نقد طراحی، به همان روشی که کد در درخواستهای pull بررسی میشود، بررسی میشوند.
یک سیستم طراحی بدون اصول، یک بسته برچسب است. یک سیستم طراحی با اصول چاپی که در آن گنجانده شده باشد، یک نشریه است.
باوهاوس این را در دهه ۱۹۲۰ فهمید. چیچولد آن را در سال ۱۹۲۸ در کتاب «تایپوگرافی جدید» تدوین کرد. مدرسه سوئیسی آن را در دهه پنجاه عملیاتی کرد.
پنتاگرام شصت سال است که آن را به صورت تجاری عرضه میکند. اصول پایدار هستند، رسانه چیزی است که دائماً در حال تغییر است.
یک کارگاه کوتاه که میتوانید روی محصول خودتان اجرا کنید
یک صفحه از محصول فعلی خود را انتخاب کنید. قهرمان صفحه اصلی، داشبورد، صفحه تنظیمات، هر چیز دیگری. با یک شیء چاپی که به آن احترام میگذارید، یک صفحه مجله، یک صفحه گزارش سالانه، یک صفحه بازکننده شومیز، هر چیزی از پنتاگرام یا ویگنلی یا شر بنشینید. آنها را کنار هم قرار دهید.
پنج سوال بپرسید. لید هر کدام چیست؟ چشم اول، دوم، سوم به کجا میرود؟ چند فونت و اندازه استفاده میشود و چقدر فضای سفید در مقابل تصادفی شکل گرفته است؟
سپس برشها را انجام دهید. سه عنصر را حذف کنید، ابرو را کوچک کنید، فونتها را روی دو قرار دهید. لید را به یک تقاطع شبکه واقعی منتقل کنید. فضای سفید را اضافه کنید تا صفحه نفس بکشد.
نسخه جدید را از همان پنج سوال عبور دهید. بهبود آشکار خواهد بود.
این کار را هفتهای یک بار به مدت یک ماه انجام دهید. چشم شما دوباره کالیبره میشود. صفحه نمایش شما ساکتتر و قویتر میشود. تیم شما شروع به توجه خواهد کرد.
این کاری است که یک آموزش چاپی انجام میدهد و شما میتوانید یک بعدازظهر به خودتان بدهید.
مرجع یک کتابخانه فعال است، با آن اینگونه رفتار کنید
نامهای موجود در این مقاله تاریخ نیستند. ویگنلی، چیچولد، کروول، شر، مولر-بروکمن، کارسون، تورلی، پنتاگرام، پنگوئن، بلومبرگ بیزینسویک، مجله نیویورک تایمز. آنها یک کتابخانه فعال هستند که میتوانید از این هفته از آنها استفاده کنید.
کتابهای آنها هنوز چاپ میشوند. صفحات آنها هنوز آنلاین هستند. اصول آنها هنوز پابرجاست.
یک مونوگراف بخرید. در یک مجله چاپی مشترک شوید. یک طرح سالانه را روی میزی که واقعاً روی آن کار میکنید، نگه دارید. وقتی گیر کردید، آنها را باز کنید.
این مرجع هر بار از برد پینترست شما بهتر عمل میکند. این حوزه قبلاً بیشتر چیزهایی را که با آنها دست و پنجه نرم میکنید، حل کرده است. کار آنجا نشسته و منتظر است تا شما نگاه کنید. نگاه کنید.
If your product screens feel noisy and flat, hire Brainy to rebuild them with editorial discipline.
Get Started
