
Custo
یک گالری به رنگ برنزی با فونتی یکپارچه. یک نمایشگاه با تُنهای خاکستری-سبز ملایم، جایی که یک شیء تیره و فونت ۵۷ پیکسلی به خودی خود گویا هستند.
کاستو به عنوان گالری از محصولات صنعتی عمل میکند: یک بوم فلزی گرم به عنوان پسزمینهای برای محصول فیزیکی عمل میکند، در حالی که تایپوگرافی با فرمت بزرگ به عنوان تزئینات بصری اصلی عمل میکند. این سیستم کاملاً بیرنگ است - بدون رنگهای کروماتیک - که به حروف برجسته آنودایز شده تیره و گرانش هندسی یک فونت sans-serif اجازه میدهد تا کل شخصیت برند را منتقل کنند. هر صفحه، فضای سفید گسترده را با یک عبارت تایپوگرافی عظیم متعادل میکند، و علامت تجاری تقریباً به عنوان یک عنصر معماری تکرار میشود. سطوح صاف و مات هستند. عمق از طریق بازتابندگی خود محصول ایجاد میشود، نه از طریق سایهها یا گرادیانها.
طرحبندی صفحه، یک ساختار تک ستونی عمودی با حداکثر عرض محتوای حدود ۱۲۸۰ پیکسل است که در مرکز نمای دید قرار دارد. عنصر اصلی صفحه، تمام عرض صفحه را در بر میگیرد و با بوم مخروطی لبه به لبه Gunmetal #9ea29f رندر شده است، با عکسی از یک صندوق پستی که در مرکز سمت راست قرار دارد و یک لوگوی CUSTO® با اندازه ۵۷ پیکسل که در لبه پایین قرار گرفته است. در زیر عنصر اصلی، بخشها به طور متناوب قرار میگیرند: یک بلوک متنی دو ستونی (عنوان کوچک در سمت چپ، عنوان بزرگ در سمت راست)، و به دنبال آن یک شبکه افقی از سه کارت تصویر محصول، سپس ردیفهای دو ستونی از متن و تصاویر، که متن اصلی در دو طرف آن به طور متناوب قرار دارد. ناودانهای بین بخشها ۱۱۰ پیکسل هستند که فضای تنفس عمودی قابل توجهی ایجاد میکنند. ناوبری یک نوار بالایی شفاف است که با اسکرول کردن به رنگ سفید کاغذی محو میشود. آیکون CES یک عنصر ثابت و شناور در گوشه پایین سمت راست است. ریتم کلی مانند گالری است: عناصر کم در هر بخش، فونت بزرگ، فضاهای عریض و یک عکس محصول به عنوان نقطهگذاری بصری بین نوارهای متنی.
این تصاویر صرفاً عکاسی از محصول صندوق پستی کاستو هستند که در سه حالت گرفته شدهاند: پرترههای تمام قد در مقابل قاب فلزی، عکسهای سبک زندگی که تعامل انسان با دستگاه را نشان میدهند، و نماهای نزدیک از رابط اسکن و حلقه LED. همه عکسها با تُنهای ملایم و با کنتراست بالا اجرا شدهاند و روکش مشکی مات صندوق پستی به عنوان یک لنگر بصری عمل میکند. هیچ تصویرسازی، گرافیک انتزاعی یا عکس استوک وجود ندارد. عکسها روی کارتهایی با شعاع ۸ پیکسل قرار گرفتهاند یا به صورت تمام صفحه در پشت لوگوی ۵۷ پیکسل استفاده شدهاند. آیکون CES تنها تصویر چندرنگ در کل وبسایت است.
پالت
خنثی
- Canvas Gunmetal
#9ea29f— پسزمینه گرم خاکستری-سبز بخشهای اصلی و قالب، کاستو را از قالبهای استاندارد سفید SaaS متمایز میکند و بیشتر شبیه بتن معماری است تا یک سطح دیجیتال. - Obsidian
#000000— متن بدنه، حاشیههای نازک، خطوط آیکون - جوهر با بالاترین کنتراست در سیستم، که برای عنوانها و جداکنندههای ساختاری استفاده میشود. - Paper White
#ffffff— تصاویر پسزمینه اعضای بدن، متن وارونه روی بوم نقاشی با فلز مفرغ، متن روی پسزمینه تیره از عکاسی محصول. - Anodized Graphite
#4b514d— سطح تیره برای عکاسی از محصول، عناوین اضافی و متن سهبعدی، یادآور روکش صندوق پستی است، بنابراین رابط کاربری و محصول از یک جنس ساخته شدهاند. - Brushed Steel
#8e9194— متن بدنهی ساده، جداکنندههای فهرست و طرح کلی آیکونهای اضافی بین Paper White و Obsidian قرار گرفتهاند تا فرادادهها و لینکهای نامحسوس در آنها تعبیه شوند. - Linen Mist
#a7aaad— رنگ روشن حاشیه و جداکنندهها برای عنوانها و خطوط جداکننده، سایهای ظریف است که هرگز با خطوط ساختاری رنگ ابسیدین رقابت نمیکند.
تایپوگرافی
از ۱۵ تا ۵۷ پیکسل · ۵ مرحله
- PP Neue Montreal — جایگزینی: Inter · طرح کلی 400 (Medium) · یک سیستم تایپوگرافی تکخانواده برای همه چیز، از متن بدنه گرفته تا متن توضیحی، استفاده میشود - یکنواختی هندسی در وزن، مشخصه اصلی است و از استفاده از هرگونه فونت ثانویه یا فونتهای مخصوص نمایش جلوگیری میکند، بنابراین علامت کلمه «CUSTO®» که در ۵۷ پیکسل تنظیم شده است، به عنوان متعلق به همان خانواده تایپوگرافی برچسب فیلد ورودی فرم ۱۵ پیکسلی خوانده میشود.
فواصل و فرم
| هدف | معنی |
|---|---|
| تراکم | جادار |
| گام اساسی | 24px |
| شعاع دکمه | 31.35px (pill) for primary action; 8px for secondary |
| شعاع کارت | 8px |
| سایهها | بدون حاشیه به جای سایه |
| بین بخشها | 110px |
| عرض صفحه | 1280px |
هوش مصنوعی وبسایت شما را به سبک Custo میسازد و آن را پر میکند
- از طریق لینک - Instagram ، TikTok ، Facebook - محصولات و پستها را پر کنید.
- محتوا را از سایت قدیمی خود منتقل کنید—فقط آدرس را مشخص کنید.
- طراحی مدرن روی بهترین موتور: React ( Next.js) با رندر سرور و بهینهسازی سئو از پیش آماده.
- بهینهسازی سئو کاملاً خودکار برای نتایج جستجو و توصیههای شبکه عصبی.
سبکهای مشابه
- 099 SUPPLY — یک دیوار گالری پر از اشیاء سیاه و سفید
- Specht Studio — دیواری پر از کنجکاوی پنهان. روکش کرومی مخصوص استودیو، سطحی سفید و حروف مشکی است؛ جلوههای بصری آتشبازی کاملاً در کاشیکاری پروژه متمرکز شدهاند.
- Structured — گالری رنسانس روی کاغذ شبیه پلاستیسین
- Airbnb — یک دیوار گالری سفید و آرام با یک بوکمارک قرمز مرجانی
- VSCO — دیوار تکرنگ گالری، نمایشگاهی از عکسهای سیاه و سفید است که در آن، یک نورافکن گرم، صحنهی زیرین را روشن میکند.
- Apple (España) — گالری موزه، در نور ملایم روز، فضایی سفید، واحد، جذاب و بیوزن است که هر نمایشگاه با نورافکنی در برابر دیواری با رنگ ملایم روشن میشود.
- Peak Design — دیوار گالری، تا حدی روشن
- Apple (España) — ویترین گالری ابسیدین، یک سالن نمایشگاهی تاریک است که در آن یک شیء تیتانیومی واحد در برابر پسزمینهای کاملاً سیاه میدرخشد.
- Apple (España) — ویترین گالری سفید
- teenage engineering — کاتالوگ صنعتی در نورپردازی استودیویی - محصول تنها شیء مهم در صفحه است و هر چیز دیگری پیرامون آن بحث میشود.
- Apple (España) — پنجرهی گالری در مه صبحگاهی
- Apple (España) — گالری موزه سفید در ظهر