Apple (España)
Бараг сонсогдохооргүй гарчигтай цагаан орон зай бүхий сүм. Агаарт өлгөөтэй, зөвхөн пастел өнгө, ганц цэнхэр утсаар бэхлэгдсэн 700 нягтралтай асар том фонтууд бүхий асар том, гэгээлэг танхим.
Apple-ийн бүтээгдэхүүний хуудасны хэл нь хэвлэмэл өгөөмөр байдлын судалгаа юм: цагаан дэвсгэр дээр асар том SF Pro дэлгэцийн гарчигнууд эргэлдэж, үг бүрийг зориудаар мэдрүүлдэг асар том цагаан зайгаар хүрээлэгдсэн байдаг. Палитр нь бараг монохроматик - #1d1d1f текст, #ffffff болон #f5f5f7 хооронд ээлжлэн зотон даавуу - зөвхөн интерактив мөчүүдэд зориулагдсан ганц цэнхэр өргөлттэй (#0071e3) юм. Өнгө нь бүтээгдэхүүний зургуудад байдаг (пастел өнгө), хэзээ ч гоёл чимэглэлийн UI элемент биш. Бүрэлдэхүүн хэсгүүд нь хүрээгүй: 28 пикселийн радиустай бөөрөнхий картууд, хуудасны ирмэг дээр бараг хүрдэг эм хэлбэртэй товчлуурууд, харагдахуйц сав эсвэл сүүдэргүй. Хэмнэлийг хуваагч эсвэл хүрээ биш, харин цагаан ба саарал судал ээлжлэн үүсгэдэг.
Хэсгүүд нь хуудасны бүтэн өргөнийг эзэлдэг бөгөөд захаас ирмэг хүртэл өргөн зөөлөвчтэй (ойролцоогоор 40-100 тал) байна. Хамгийн их контентын өргөнийг зурвас бүрийн дотор үр дүнтэй төвлөрүүлдэг. Гол элемент нь төвлөрсөн стек юм: хөмсөг хэлбэртэй шошго, томруулсан гарчиг, үйлдэлд уриалсан ганц товчлуур, үнийн мөр, дараа нь харах цонхны доод хэсгийг дүүргэсэн бүтээгдэхүүний зураг. Хэсгүүд нь давтагдах хэв маягийг дагадаг: зурвас дотор зүүн тийш зэрэгцүүлсэн гарчиг, дараа нь бүтээгдэхүүний тайлбартай хоёр баганатай байрлал (зүүн талд текст/баруун талд зураг эсвэл ээлжлэн), гурван баганатай картын сүлжээ эсвэл төвлөрсөн харааны үзүүлэн. Агуулгын хэмнэлийг 100-100 см-ийн босоо зайтай цагаан ба гурван өнгийн дэвсгэрийг ээлжлэн хянадаг - хуваагчгүй, элемент агуулсан картгүй. Дэлхийн навигаци нь ганц, тогтмол баар юм. Бүтээгдэхүүний тодорхойлолтын хэсгүүд нь өргөн зөөлөвчтэй бүрэн өргөн зурвасуудыг ашигладаг бөгөөд текст нь илүү өргөн харааны талбайн эсрэг нарийн багана (~560px)-д төвлөрдөг.
Apple-ийн харааны хэл нь голчлон бүтээгдэхүүний гэрэл зураг юм: амьдралын хэв маягийн нөхцөл байдал эсвэл тайзны үзэгдэлгүйгээр цэвэр цагаан эсвэл өнгөт дэвсгэр дээр техник хангамжийн ойрын зургууд. Үндсэн зураг дээр пастел ногоон MacBook Neo барьсан гарууд харагдаж байна - хүний элемент нь хоёрдогч бөгөөд сэтгэл хөдлөлөөс илүү масштаб, бүтэцийг харуулж байна. Бүтээгдэхүүний хувилбарын хэсгүүдэд хоёр төхөөрөмжийг ижил өнгийн чимэглэлийн дэвсгэр дээр (ягаан, ногоон, мөнгөлөг, тэнгэрийн цэнхэр) зэрэгцүүлэн харуулсан бөгөөд тус бүр нь бүтээгдэхүүнийг төвд нь байрлуулсан хавтгай өнгийн талбарыг байрлуулсан. Нарийвчилсан зургуудад төвийг сахисан дэвсгэр дээр хэт ойрын зургуудыг (зөөврийн компьютерын нугас, камерын модуль) ашигласан. Зураг чимэглэл, хийсвэр график, гоёл чимэглэлийн зураг байхгүй - бүтээгдэхүүн өөрөө харааны элемент юм. Иконографи хаа сайгүй байдаг - Apple-ийн системийн дүрсний багцаас авсан 1.5-2 пикселийн зузаантай SF Symbols хэв маягийн монохром шугаман дүрсүүд. Гэрэл зургийг үргэлж өндөр түвшинд хийдэг: бүтээгдэхүүнийг гурван хэмжээст объект биш харин график хэлбэр болгон бууруулдаг жигд, сүүдэргүй гэрэлтүүлэг.
Палетт
Брэнд
- Electric Blue
#0071e3— Дүүргэсэн үйлдлийн товчлуурууд нь хэрэглэгчийн интерфэйс дэх цорын ганц өнгөний өргөлт бөгөөд үйлдэл хийх дуудлагыг ховор ашигладаг. - Link Blue
#0066cc— Мөрийн доторх текст холбоосууд, сум болон шевронтой холбоосууд. - Citrus Gradient
#3b3b23— Бүтээгдэхүүний гол онцлог болсон өөр нэг өнгөлгөө бол шар-ногоон өнгийн гэрэлтэлт болж бүдгэрсэн бараан суурь юм.
Төвийг сахисан
- Primary Ink
#1d1d1f— Гарчиг, үндсэн текст болон товчлуурын шошго нь бүх гадаргуу дээр зонхилох урд талын өнгө аястай байдаг; бүтээгдэхүүний үндсэн зургийн дэвсгэр зураг нь дээд талын #1d1d1f гэсэн хатуу фонтоос хроматик цэнхэр өнгө рүү жигд шилждэг. - Mid Gray
#707070— Хоёрдогч текст, идэвхгүй навигацийн төлөв, дуугүй UI шошго - Deep Gray
#474747— Навигацийн текст болон дүрс тэмдэг нь дунд зэргийн фонтоор хийгдсэн. - Hairline
#d6d6d6— Хэсгүүд болон UI элементүүдийн хоорондох нимгэн хил хязгаар. - Canvas
#f5f5f7— Хувьсах хэсгийн дэвсгэрүүд - цагаан хэсгүүдийг тусгаарласан саарал судал. - Paper
#ffffff— Картын гадаргуу, үндсэн хуудасны дэвсгэр, бараан дэвсгэр дээр товчлуурын текст.
Типографи
12-оос 96 пиксел хүртэл · 10 алхам
- SF Pro Display — солих: Inter · тоймууд 600, 700 · Дэлгэцийн гол болон дэд гарчигнууд — 700 жинтэй, 80–96 пикселийн нягтралтай, -1.44 пикселийн хасах үсгийн зайтай тул Apple-ийн "цагаан өнгөөр хөвж буй асар том гарчиг" гэсэн тэмдэгтэй. Орлуулагч: Интер, системийн интерфэйс
- SF Pro Display — солих: Inter · тоймууд 600 · Хэсгийн гарчиг, картын гарчиг, дэд гарчиг - дээрх богино гарчгуудаас ялгаатай нь дунд зэргийн хэмжээтэй 600 фонт нь бага зэрэг эерэг үсгийн зайтай тул дулаан, ээлтэй мэдрэмж төрүүлдэг.
- SF Pro Text — солих: Inter · тоймууд 400, 500, 600 · Үндсэн текст, навигаци, туслах догол мөр, жижиг тайлбарын хувьд 17 пикселийн 400 индекстэй фонт нь үндсэн фонт юм. Сөрөг үсгийн зай нь мэдээлэл ихтэй хуудсан дээр үндсэн текстийг илүү товч байлгах боломжийг олгодог.
Интервал ба хэлбэр
| Зорилго | Утга |
|---|---|
| Нягтрал | нягт |
| Үндсэн алхам | 8-10px |
| Товчлуурын радиус | 980px |
| Картын радиус | 28px |
| Сүүдэр | сүүдрийн оронд хил хязгаар байхгүй |
| Хэсгүүдийн хооронд | 100-120px |
| Хуудасны өргөн | 1200px |
Хиймэл оюун ухаан таны вэбсайтыг Apple (España) хэв маягаар бүтээж, дүүргэх болно
- Instagram, TikTok, Facebook холбоосоор дамжуулан бүтээгдэхүүн болон нийтлэлүүдээр дүүргээрэй.
- Хуучин сайтаасаа контентыг шилжүүлэх - зүгээр л хаягийг нь зааж өгнө үү.
- Шилдэг хөдөлгүүр дээрх орчин үеийн дизайн: Серверийн рендеринг болон SEO оновчлолыг хайрцагнаас нь гарган React ( Next.js).
- Хайлтын үр дүн болон мэдрэлийн сүлжээний зөвлөмжид зориулсан бүрэн автомат SEO оновчлол.
Төстэй хэв маяг
- Airbnb — Ганц шүрэн улаан хавчуургатай чимээгүй цагаан галерейн хана
- Peak Design — Галерейн хана, хэсэгчлэн гэрэлтүүлэгтэй
- Ramp — Редакцийн санхүүгийн хэлтэс, ганц неон маркертай хар цагаан хуудсууд. Хэвлэлийн бараг монохром гадаргуу нь ганц тод ногоон зураас нь бүх харилцан үйлчлэлийг мөнгөний дохио болгон хувиргадаг.
- 099 SUPPLY — Хар цагаан эд зүйлсээр дүүрсэн галерейн хана
- Orderful — Аж үйлдвэрийн ложистикийн хяналтын тавцан - Хар бэх, мэс заслын улаан өнгөөр хэвлэсэн ложистикийн диспетчерийн шалгах хуудас, хуудас бүр нь нэг оператор чухал зүйлийг чангаар хэлэх боломжтой байхаар нууцлагдсан байна.
- Apple (España) — цагаан галерей дэлгэцийн хайрцаг
- teenage engineering — Студи гэрэлтүүлэг дэх аж үйлдвэрийн каталог - бүтээгдэхүүн нь хуудсан дээрх цорын ганц чухал объект бөгөөд бусад бүх зүйлийг түүний эргэн тойронд хэлэлцдэг
- Apple (España) — Өглөөний манан дунд галерейн цонх
- Lightship — Нээлттэй замын киноны диорама. Ойрын зайд байрлуулсан том ландшафтын зургуудаар чимэглэсэн дулаан цөцгий өнгийн галерейн хана, жааз дээр бараг харагдахгүй нимгэн хар үсэг, нугад асаж буй түүдэг гал мэт монохромыг эвдэж буй ганц тод улбар шар өнгийн аялга.
- Custo — Ган төмөр өнгөтэй, цул фонттой галерей. Бүдэг саарал ногоон өнгөтэй, ганц бараан объект болон 57 пикселийн фонт өөрөөрөө ярьдаг үзэсгэлэнгийн танхим.
- Silencio — Хөвөгч эд өлгийн зүйлстэй цагаан өрөө. Сөрөг эзэлхүүний дэвсгэр дээр элемент бүр өөрийн гэсэн байр суурийг эзэлдэг дулаан цаасаар хийсэн галерейн үзмэр, нам гүм байдал нь санаатай дизайны шийдвэр юм.
- ORYZO AI — Харанхуй өрөөний тухай фото эссэ. Дулаан харанхуйд хөвж буй ганц бие зүйл, цөцгий өнгийн фонт нь цорын ганц чимэглэл юм.