Apple (España)
کلیسایی از فضای سفید با تیترهایی که به سختی شنیده میشوند. سالنی وسیع و روشن که در آن فونتهای عظیم با تراکم ۷۰۰ در هوا معلق هستند و تنها با رنگهای پاستلی و یک نخ آبی واحد به هم متصل شدهاند.
زبان صفحه محصول اپل، نمونهای از سخاوت تایپوگرافی است: تیترهای بزرگ SF Pro Display که در پسزمینهای سفید مایل به کرم شناور هستند و با فضای سفید وسیعی احاطه شدهاند که باعث میشود هر کلمه سنجیده به نظر برسد. پالت رنگی تقریباً تکرنگ است - متن با #1d1d1f، بوم نقاشی که بین #ffffff و #f5f5f7 در نوسان است - با یک لهجه آبی واحد (#0071e3) که منحصراً برای لحظات تعاملی در نظر گرفته شده است. رنگ در خود تصاویر محصول (رنگهای پاستلی) وجود دارد، هرگز به عنوان عناصر رابط کاربری تزئینی دیده نمیشود. اجزا بدون قاب هستند: کارتهای گرد با شعاع ۲۸ پیکسل، دکمههای قرصی شکل که تقریباً لبههای صفحه را لمس میکنند، بدون هیچ محفظه یا سایه قابل مشاهدهای. ریتم با نوارهای متناوب سفید و خاکستری ایجاد میشود، نه جداکننده یا حاشیه.
بخشها تمام عرض صفحه را اشغال میکنند و با فاصلهگذاری زیاد (تقریباً ۴۰ تا ۱۰۰ ضلع) از یک لبه تا لبه دیگر امتداد مییابند. حداکثر عرض محتوا عملاً در هر نوار در مرکز قرار دارد. عنصر اصلی یک پشته متمرکز است: یک برچسب ابرو شکل، یک تیتر بزرگ شده، یک دکمه فراخوان، یک ردیف قیمت و سپس یک تصویر محصول که پایین صفحه نمایش را پر میکند. بخشها از یک الگوی تکرارشونده پیروی میکنند: یک تیتر تراز چپ در داخل نوار، و به دنبال آن یک طرح دو ستونی با توضیحات محصول (متن در سمت چپ/تصویر در سمت راست یا به صورت متناوب)، یک شبکه سه ستونی از کارتها یا یک ویترین بصری متمرکز. ریتم محتوا کاملاً توسط پسزمینههای سفید و سه رنگ متناوب با فواصل عمودی ۱۰۰ تا ۱۰۰ سانتیمتر کنترل میشود - بدون جداکننده، بدون کارتهایی که عناصر را حمل میکنند. ناوبری جهانی یک نوار ثابت و واحد است. بخشهای مشخصات محصول از نوارهای تمام عرض با فاصلهگذاری زیاد استفاده میکنند، که در آن متن در ستونهای باریک (~۵۶۰ پیکسل) در مقابل یک ناحیه بصری وسیعتر در مرکز قرار میگیرد.
زبان بصری اپل در درجه اول عکاسی از محصول است: نماهای نزدیک از سختافزار در پسزمینهای کاملاً سفید یا رنگی، بدون زمینه سبک زندگی یا صحنههای صحنهسازی شده. تصویر اصلی دستهایی را نشان میدهد که یک مکبوک نئو سبز پاستلی را در دست دارند - عنصر انسانی در درجه دوم اهمیت قرار دارد و به جای احساسات، مقیاس و بافت را نشان میدهد. در بخشهای مربوط به انواع محصول، دو دستگاه در کنار هم در پسزمینهای با رنگهای هماهنگ (صورتی، سبز، نقرهای، آبی آسمانی) ارائه میشوند که هر کدام یک زمینه رنگی مسطح با محصول در مرکز دارند. نماهای جزئیات از نماهای بسیار نزدیک (لولا لپتاپ، ماژول دوربین) در پسزمینهای خنثی استفاده میکنند. هیچ تصویرسازی، گرافیک انتزاعی یا تصویر تزئینی وجود ندارد - خود محصول عنصر بصری است. آیکونوگرافی همه جا دیده میشود - آیکونهای خطی تک رنگ به سبک نمادهای SF، با ضخامت ۱.۵ تا ۲ پیکسل، گرفته شده از مجموعه آیکونهای سیستم اپل. عکاسی همیشه به شیوهای پرنور انجام میشود: نورپردازی یکنواخت و بدون سایه که محصول را به یک شکل گرافیکی تبدیل میکند تا یک شیء سهبعدی.
پالت
برند
- Electric Blue
#0071e3— دکمههای عملیاتی توپر، تنها رنگهای برجسته در رابط کاربری هستند که به ندرت برای فراخوانهای عملی استفاده میشوند. - Link Blue
#0066cc— لینکهای متنی درونخطی، لینکهای دارای فلش و شورون. - Citrus Gradient
#3b3b23— یک پوشش جایگزین که به ویژگی شاخص این محصول تبدیل شده است، پایه تیرهای است که در هایلایتهای زرد-سبز محو میشود.
خنثی
- Primary Ink
#1d1d1f— تیترها، متن بدنه و برچسبهای دکمه، رنگ غالب پیشزمینه در تمام سطوح هستند؛ پسزمینه تصویر اصلی محصول به آرامی از یک رنگ ثابت #1d1d1f در بالا به یک آبی کروماتیک تغییر میکند. - Mid Gray
#707070— متن ثانویه، وضعیت ناوبری غیرفعال، برچسبهای رابط کاربری بیصدا - Deep Gray
#474747— متن ناوبری و آیکونها با فونت متوسط هستند. - Hairline
#d6d6d6— مرزهای باریک بین بخشها و عناصر رابط کاربری. - Canvas
#f5f5f7— پسزمینههای بخش متناوب - یک نوار خاکستری که نواحی سفید را از هم جدا میکند. - Paper
#ffffff— سطح کارت، پسزمینه صفحه اصلی، متن دکمه روی پسزمینه تیره.
تایپوگرافی
از ۱۲ تا ۹۶ پیکسل · ۱۰ مرحله
- SF Pro Display — جایگزینی: Inter · طرح کلی 600, 700 · عنوانها و زیرعنوانهای اصلی برای نمایش - وزن ۷۰۰ در ۸۰ تا ۹۶ پیکسل با فاصله منفی ۱.۴۴ پیکسل بین حروف، امضای اپل یعنی «عنوان بزرگ شناور در رنگ سفید» را ایجاد میکند. جایگزینها: اینتر، رابط کاربری سیستم
- SF Pro Display — جایگزینی: Inter · طرح کلی 600 · سرتیترهای بخشها، عناوین کارتها، زیرتیترها - فونت ۶۰۰ با فاصله حروف کمی مثبت، برخلاف سرتیترهای کوتاه بالا، در اندازههای متوسط حس گرم و دوستانهای ایجاد میکند.
- SF Pro Text — جایگزینی: Inter · طرح کلی 400, 500, 600 · برای متن بدنه، ناوبری، پاراگرافهای پشتیبان و زیرنویسهای کوچک، فونتی با شاخص ۴۰۰ در ۱۷ پیکسل، فونت اصلی است. فاصله منفی بین حروف، امکان مختصرتر بودن متن اصلی را در صفحاتی با اطلاعات زیاد فراهم میکند.
فواصل و فرم
| هدف | معنی |
|---|---|
| تراکم | متراکم |
| گام اساسی | 8-10px |
| شعاع دکمه | 980px |
| شعاع کارت | 28px |
| سایهها | بدون حاشیه به جای سایه |
| بین بخشها | 100-120px |
| عرض صفحه | 1200px |
هوش مصنوعی وبسایت شما را به سبک Apple (España) میسازد و آن را پر میکند
- از طریق لینک - Instagram ، TikTok ، Facebook - محصولات و پستها را پر کنید.
- محتوا را از سایت قدیمی خود منتقل کنید—فقط آدرس را مشخص کنید.
- طراحی مدرن روی بهترین موتور: React ( Next.js) با رندر سرور و بهینهسازی سئو از پیش آماده.
- بهینهسازی سئو کاملاً خودکار برای نتایج جستجو و توصیههای شبکه عصبی.
سبکهای مشابه
- Airbnb — یک دیوار گالری سفید و آرام با یک بوکمارک قرمز مرجانی
- Peak Design — دیوار گالری، تا حدی روشن
- Ramp — بخش مالی تحریریه، صفحات سیاه و سفید با یک ماژیک نئونی. سطح تقریباً تک رنگ نشریه، جایی که یک خط سبز لیمویی روشن، هر تعاملی را به یک سیگنال پولی تبدیل میکند.
- 099 SUPPLY — یک دیوار گالری پر از اشیاء سیاه و سفید
- Orderful — عرشه کنترل لجستیک صنعتی - یک چک لیست چاپ شده برای مسئول توزیع لجستیک، که با جوهر مشکی و قرمز جراحی نوشته شده است، هر صفحه به اندازه کافی نامحسوس است تا یک اپراتور بتواند نکته مهمی را بیان کند.
- Apple (España) — ویترین گالری سفید
- teenage engineering — کاتالوگ صنعتی در نورپردازی استودیویی - محصول تنها شیء مهم در صفحه است و هر چیز دیگری پیرامون آن بحث میشود.
- Apple (España) — پنجرهی گالری در مه صبحگاهی
- Lightship — یک دیورامای سینمایی از جادهی باز. دیوارهای گالری به رنگ کرم گرم مزین به عکسهای بزرگ منظره که در فواصل نزدیک نصب شدهاند، حروف سیاه نازکی که به سختی روی قابها دیده میشوند، و یک تکرنگ نارنجی روشن که مانند آتشی در چمنزار، تکرنگی را میشکند.
- Custo — یک گالری به رنگ برنزی با فونتی یکپارچه. یک نمایشگاه با تُنهای خاکستری-سبز ملایم، جایی که یک شیء تیره و فونت ۵۷ پیکسلی به خودی خود گویا هستند.
- Silencio — یک اتاق سفید با آثار شناور. یک نمایشگاه گالری ساخته شده از کاغذ گرم، که در آن هر عنصر جای خود را در برابر پسزمینهای از حجم منفی اشغال میکند و سکوت یک تصمیم طراحی عمدی است.
- ORYZO AI — یک انشا تصویری درباره یک تاریکخانه. یک شیء تنها که در تاریکی گرم معلق است، و فونت کرم تنها تزیین آن است.