Nike
یک گالری تک رنگ از دستاوردهای ورزشی - دیوارهای سفید، محصول به عنوان یک اثر هنری، کروم در پسزمینه حل شده است
Nike.com به عنوان یک گالری تک رنگ و محصول محور عمل میکند: رابط کاربری عملاً نامرئی است و به عکسهای محصول اجازه میدهد تا هر صفحه را اشغال کنند. کل رابط کاربری از سیاه، سفید و سه سایه خاکستری ساخته شده است - بدون رنگهای تأکیدی، بدون گرادیانهای تزئینی، بدون کروم گرم و خاص. سبک خاص نایک در لوگوی گالری و عکسها وجود دارد، اما هرگز در خود رابط کاربری دیده نمیشود. تایپوگرافی فشرده و کاربردی است و بر خانواده فونت Helvetica Now با طراحی سفارشی در اندازه ۱۲-۲۰ پیکسل، با یک لوگوی بزرگ Nike Futura ND با اندازه ۷۶ پیکسل برای عنوانها تکیه دارد. اجزا مینیمالیستی هستند: دکمههای قرصی شکل با شعاع ۳۰ پیکسل، کارتهای محصول مسطح، حاشیههای نازک و تقریباً بدون اختلاف ارتفاع. صفحه بین سطوح سفید خالص محصول و بخشهای سرمقاله تیره و چشمگیر در نوسان است و به جای تزئینات، از طریق کنتراست ریتم ایجاد میکند.
این صفحه از یک ریتم ویرایشی قوی پیروی میکند: یک هدر تیره، تمام عرض و چشمگیر که شامل یک محصول واحد و یک عنوان بزرگ است، و پس از آن یک شبکه دستهبندی ۲x۲ تمام عرض، یک شبکه اسکرول افقی از کارتهای محصول در ۳ ستون، و در نهایت یک پاورقی متراکم و چند ستونی قرار دارد. تمام بلوکهای محتوا تمام عرض نمای دید را اشغال میکنند و حداکثر عرض کانتینر ندارند. محدودیت حداکثر عرض فقط برای شبکه لینکهای ناوبری و پاورقی اعمال میشود. انتقال بین بخشها واضح است: هدر سیاه → شبکه دستهبندی سفید → شبکه محصول سفید → پاورقی سفید، با حاشیههای باریک خاکستری که تنها شکاف بصری هستند. ناوبری یک نوار مینیمالیستی دو لایه (لینکهای کمکی در بالا، دستههای اصلی در مرکز) بدون پین کردن، بدون پر کردن پسزمینه و بدون سایه است. تراکم محتوا در شبکههای محصول فشرده (فاصله کم کارتها) و در هدر (نمای تمام عرض) جادار است.
عکاسی عنصر بصری غالب است و کل هویت برند را تعریف میکند. این سیستم از عکسهای باکیفیت و تمامقاب محصول استفاده میکند: کفشهای ورزشی که به صورت جداگانه در مقابل یک پسزمینه تیره یا گرادیانی عکاسی شدهاند، برای پر کردن قاب برش داده شدهاند، بدون زمینه سبک زندگی. تصاویر سبک زندگی در دستهها ظاهر میشوند و پاها و ساقهای ورزشکاران را در حال حرکت نشان میدهند. از یک طرح رنگی اشباعشده با کنتراست بالا استفاده میشود - کفشهای قرمز در مقابل یک پسزمینه سیاه، تزئینات نئونی روی کفیهای سفید و نورپردازی گرم و سرد برای دراماتیک کردن مواد. از هیچ تصویرسازی، گرافیک انتزاعی یا رندرهای سهبعدی استفاده نمیشود. تصاویر همیشه لبههای تمیزی دارند (بدون گوشههای گرد در محفظههای عکس)، همیشه کل فضای داخل بلوکهای خود را اشغال میکنند و همیشه با حداقل پوشش متن همراه هستند. آیکونوگرافی کاملاً کاربردی است: آیکونهای طرح کلی برای جستجو، لیست علاقهمندیها، سبد خرید و حساب کاربری در رنگهای Obsidian یا Steel.
پالت
خنثی
- Obsidian
#111111— رنگ تیره مکمل متن و آیکونهای خنثی است و کنتراست قوی ایجاد میکند. از استفاده از آن به عنوان رنگ اصلی برای دکمههای فراخوان (CTA) خودداری کنید. - Paper White
#ffffff— پسزمینه صفحه، سطح کارت، متن دکمه روی پسزمینه تیره، طرح کلی آیکون—بوم پیشفرض برای شبکههای محصول و بخشهای دستهبندی. - Concrete Gray
#e5e5e5— حاشیهها، جداکنندهها، خطوط نازک جداکننده بخشهای شبکه، خطوط بیرونی ظریف فیلدهای ورودی. - Soft Mist
#f5f5f5— رنگ پسزمینه ملایم برای سطوح ثانویه، پر کردن فیلد جستجو در ناوبری، پسزمینه برچسب. - Steel
#707072— متن ثانویه، متن کمکی بیصدا، طرح کلی آیکونها کوچکشده، برچسبهای breadcrumb، جداکنندههای لینک پاورقی. - Faint Gray
#9e9ea0— خطوط بیرونی آیکونها، عناصر رابط کاربری جزئی و حاشیههایی با حداقل هایلایت غیرفعال هستند.
تایپوگرافی
از ۱۲ تا ۷۶ پیکسل · ۶ مرحله
- Helvetica Now Text Medium — جایگزینی: Inter · طرح کلی 500 · فونت Helvetica Now Text Medium - در دادههای استخراجشده یافت میشود اما توسط هوش مصنوعی توصیف نشده است.
- Helvetica Now Text — جایگزینی: Inter or Helvetica Neue · طرح کلی 400, 500 · متن اصلی رابط کاربری - لینکهای ناوبری، برچسبهای دکمهها، عناوین کارتها، نام محصولات، لیستهای پاورقی، تمام متن بدنه.
- Helvetica Now Display Medium — جایگزینی: Inter Medium or Helvetica Neue Medium · طرح کلی 500 · عنوانهای بخش، برچسبهای دستهبندی کارت، عنوانهای با اندازه متوسط - فونت متوسط (20-24 پیکسل) از ویژگیهای بارز عنوانهای نایک است که عناصر طراحی بزرگی نیستند: هرگز بولد نمیشوند، همیشه مختصر و مفید هستند.
فواصل و فرم
| هدف | معنی |
|---|---|
| تراکم | متراکم |
| گام اساسی | 8px |
| شعاع دکمه | 30px |
| شعاع کارت | 0px |
| سایهها | بدون حاشیه به جای سایه |
| بین بخشها | 48px |
| عرض صفحه | 1440px |
هوش مصنوعی وبسایت شما را به سبک Nike میسازد و آن را پر میکند
- از طریق لینک - Instagram ، TikTok ، Facebook - محصولات و پستها را پر کنید.
- محتوا را از سایت قدیمی خود منتقل کنید—فقط آدرس را مشخص کنید.
- طراحی مدرن روی بهترین موتور: React ( Next.js) با رندر سرور و بهینهسازی سئو از پیش آماده.
- بهینهسازی سئو کاملاً خودکار برای نتایج جستجو و توصیههای شبکه عصبی.
سبکهای مشابه
- Airbnb — یک دیوار گالری سفید و آرام با یک بوکمارک قرمز مرجانی
- Apple (España) — ویترین گالری سفید
- Silencio — یک اتاق سفید با آثار شناور. یک نمایشگاه گالری ساخته شده از کاغذ گرم، که در آن هر عنصر جای خود را در برابر پسزمینهای از حجم منفی اشغال میکند و سکوت یک تصمیم طراحی عمدی است.
- Oakâme — کارگاهی آفتابگیر در پروانس، تراشیده شده از سنگ گرم
- Arc — گالری سفید صنعتی بر فراز آبهای نیمهشب
- Rivian — یک مونولیت الکتریکی روی دیوار بتنی گالری. ریویان هر وسیله نقلیه را به عنوان مجسمهای در برابر فضای سفید وسیعی ارائه میدهد، با تایپوگرافی آنقدر بزرگ که به یک عنصر معماری تبدیل میشود، و یک زرد گرم واحد که فضای تک رنگ را میشکند، مانند نور خورشید بر روی یک سطح مات.
- Analogue — ویترین گالری مشکی - کالاها در فضای خالی معلق هستند
- ddna — ویترین موزهای گرم روی پارچه کتان نچسب
- Zellerfeld — کارگاه مجسمهسازی روی مرمر سفید - سطوح یکپارچه پایه، جرقهای از کبالت، زمزمهای از حروف کوچک از کف تا سقف
- UY Studio — گالری سنگی صومعه، فضایی آرام با دیوارهای بتنی است که در آن بطریهای عطر روی پایههای سفید قرار گرفتهاند و توسط یک لامپ ۴۰۰ واتی و چهار لامپ خاکستری گرم روشن میشوند.
- Basic.Space — گالری کیوریتوریال روی سنگ مرمر سفید
- COS — یک گالری شیک با دیوارهای سفید