
Nike
Спортын амжилтын монохром галерей - цагаан хана, урлагийн бүтээл мэт бүтээгдэхүүн, хром нь арын дэвсгэр дээр ууссан
Nike.com нь монохром, бүтээгдэхүүнд нэн тэргүүнд тавигддаг галерей шиг ажилладаг: хэрэглэгчийн интерфэйс нь бараг үл үзэгдэх тул бүтээгдэхүүний зургууд дэлгэц бүрийг эзлэх боломжийг олгодог. Интерфэйсийг бүхэлд нь хар, цагаан, гурван саарал өнгийн сүүдэрээс бүрдүүлсэн - өргөлтийн өнгө, гоёл чимэглэлийн градиент, дулаан, өвөрмөц хром байхгүй. Nike-ийн өвөрмөц хэв маяг нь галерей лого болон зургуудад оршдог боловч хэрэглэгчийн интерфэйсэд хэзээ ч байдаггүй. Типографи нь авсаархан бөгөөд хэрэглээний шинж чанартай бөгөөд 12-20 пикселийн хэмжээтэй захиалгаар хийсэн Helvetica Now фонтын гэр бүлд тулгуурладаг бөгөөд гарчгийн хувьд 76 пикселийн хэмжээтэй ганц том Nike Futura ND логотой. Бүрэлдэхүүн хэсгүүд нь минималист: 30 пикселийн радиустай эм хэлбэртэй товчлуурууд, хавтгай бүтээгдэхүүний картууд, нимгэн хүрээ, бараг тэг өндрийн ялгаагүй. Хуудас нь цэвэр цагаан бүтээгдэхүүний гадаргуу болон гайхалтай, бараан редакцийн хэсгүүдийн хооронд ээлжлэн байрладаг бөгөөд чимэглэлийн оронд тодосгогчоор хэмнэлийг бий болгодог.
Хуудас нь хүчтэй редакцийн хэмнэлийг дагадаг: нэг бүтээгдэхүүн болон том гарчгийг агуулсан гайхалтай, бүтэн өргөнтэй, бараан толгой хэсэг, дараа нь бүтэн өргөнтэй, 2x2 ангиллын тор, 3 багана дахь бүтээгдэхүүний картуудын хэвтээ гүйлгэх тор, эцэст нь нягт, олон баганатай хөл хэсэг. Бүх контент блокууд нь хамгийн их контейнерийн өргөнгүйгээр бүрэн харах цонхны өргөнийг эзэлдэг; хамгийн их өргөний хязгаарлалт нь зөвхөн навигаци болон хөлийн холбоосын торонд хамаарна. Хэсгүүдийн хоорондох шилжилтүүд нь тод байна: хар толгой → цагаан ангиллын тор → цагаан бүтээгдэхүүний тор → цагаан хөл хэсэг, нарийн саарал хүрээ нь цорын ганц харааны оёдол болж үйлчилдэг. Навигаци нь минималист, хоёр шатлалт баар (дээд хэсэгт туслах холбоосууд, үндсэн ангиллууд төвд байрладаг) бөгөөд бэхэлгээ, дэвсгэр дүүргэлт, сүүдэргүй. Агуулгын нягтрал нь бүтээгдэхүүний торонд авсаархан (картын зай багатай), толгой хэсэгт өргөн (бүтэн өргөнтэй харах цонх) байна.
Гэрэл зураг нь давамгайлсан харааны элемент бөгөөд брэндийн бүхэл бүтэн өвөрмөц байдлыг тодорхойлдог. Систем нь өндөр чанартай, бүрэн хүрээтэй бүтээгдэхүүний зургийг ашигладаг: спортын гутлыг бараан эсвэл градиент дэвсгэр дээр тус тусад нь авсан, жаазыг дүүргэхийн тулд тайрсан, амьдралын хэв маягийн нөхцөлгүйгээр. Амьдралын хэв маягийн зургууд ангилал дотор гарч, хөдөлгөөнтэй тамирчдын хөл, хөлийг харуулдаг. Өндөр тодосгогчтой, ханасан өнгөний схемийг ашигладаг - хар дэвсгэр дээр улаан гутал, цагаан улан дээр неон өнгийн чимэглэл, материалыг драматик болгохын тулд дулаан, хүйтэн гэрэлтүүлэг. Зураг чимэглэл, хийсвэр график эсвэл 3D дүрслэл ашиглаагүй. Зураг нь үргэлж цэвэр ирмэгтэй байдаг (зургийн саванд дугуйрсан булан байхгүй), блокуудынхаа доторх бүх зайг үргэлж эзэлдэг бөгөөд үргэлж хамгийн бага текст давхаргатай байдаг. Дүрс зураг нь зөвхөн ажиллагаатай: хайлт, хүслийн жагсаалт, сагс, дансны тойм дүрсүүд нь обсидиан эсвэл ган өнгөөр байдаг.
Палетт
Төвийг сахисан
- Obsidian
#111111— Бараан өнгө нь төвийг сахисан текст болон дүрсүүдийг нөхөж, хүчтэй тодосгогч байдлыг бий болгодог. Үйлдэлд уриалахын тулд үүнийг үндсэн өнгө болгон ашиглахаас зайлсхий. - Paper White
#ffffff— Хуудасны дэвсгэр, картын гадаргуу, бараан дэвсгэр дээрх товчлуурын текст, дүрсний тойм—бүтээгдэхүүний тор болон ангиллын хэсгүүдийн анхдагч зураг. - Concrete Gray
#e5e5e5— Хүрээ, хуваагч, торны хэсгүүдийг тусгаарладаг нимгэн шугам, оролтын талбаруудын нарийн тоймууд. - Soft Mist
#f5f5f5— Хоёрдогч гадаргуугийн нарийн дэвсгэр өнгө, хайлтын талбарыг дүүргэх навигаци, шошготой дэвсгэр. - Steel
#707072— Хоёрдогч текст, дуугүй туслах текст, дүрсний багасгасан тойм, үйрмэг шошго, хөл холбоос тусгаарлагч. - Faint Gray
#9e9ea0— Дүрсний тойм, UI-ийн жижиг элементүүд болон хамгийн бага тодруулгатай хүрээг идэвхгүй болгосон.
Типографи
12-оос 76 пиксел хүртэл · 6 алхам
- 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 пиксел) нь Nike-ийн гарчгийн онцлог шинж чанар бөгөөд том дизайны элементүүд биш: хэзээ ч тод биш, үргэлж товч байдаг.
Интервал ба хэлбэр
| Зорилго | Утга |
|---|---|
| Нягтрал | нягт |
| Үндсэн алхам | 8px |
| Товчлуурын радиус | 30px |
| Картын радиус | 0px |
| Сүүдэр | сүүдрийн оронд хил хязгаар байхгүй |
| Хэсгүүдийн хооронд | 48px |
| Хуудасны өргөн | 1440px |
Хиймэл оюун ухаан таны вэбсайтыг Nike хэв маягаар бүтээж, дүүргэх болно
- Instagram, TikTok, Facebook холбоосоор дамжуулан бүтээгдэхүүн болон нийтлэлүүдээр дүүргээрэй.
- Хуучин сайтаасаа контентыг шилжүүлэх - зүгээр л хаягийг нь зааж өгнө үү.
- Шилдэг хөдөлгүүр дээрх орчин үеийн дизайн: Серверийн рендеринг болон SEO оновчлолыг хайрцагнаас нь гарган React ( Next.js).
- Хайлтын үр дүн болон мэдрэлийн сүлжээний зөвлөмжид зориулсан бүрэн автомат SEO оновчлол.
Төстэй хэв маяг
- Airbnb — Ганц шүрэн улаан хавчуургатай чимээгүй цагаан галерейн хана
- Apple (España) — цагаан галерей дэлгэцийн хайрцаг
- Silencio — Хөвөгч эд өлгийн зүйлстэй цагаан өрөө. Сөрөг эзэлхүүний дэвсгэр дээр элемент бүр өөрийн гэсэн байр суурийг эзэлдэг дулаан цаасаар хийсэн галерейн үзмэр, нам гүм байдал нь санаатай дизайны шийдвэр юм.
- Oakâme — Дулаан чулуугаар сийлсэн наранд гэрэлтсэн Провансаль урлан
- Arc — Шөнө дундын усан дээрх аж үйлдвэрийн цагаан галерей
- Rivian — Галерейн бетонон ханан дээрх цахилгаан цул чулуу. Ривиан нь тээврийн хэрэгсэл бүрийг асар том цагаан орон зайн эсрэг баримал мэтээр дүрсэлдэг бөгөөд хэвлэмэл зураг нь архитектурын элемент болж хувирдаг бөгөөд царцсан гадаргуу дээрх нарны гэрэл шиг монохроматик уур амьсгалыг эвддэг ганц дулаан шар өнгө юм.
- Analogue — Хар галерейн дэлгэцийн хайрцаг – бараа хоосон орон зайд хөвж байна
- ddna — боловсруулаагүй маалинган даавуун дээр дулаан музейн үзмэрийн тавиур
- Zellerfeld — Цагаан гантиг чулуун дээрх уран барималчийн урлан - суурийн цул гадаргуу, кобальтын ганц оч, шалнаас тааз хүртэлх жижиг үсгийн шивнээ
- UY Studio — Хийдийн чулуун галерей нь бетонон ханатай нам гүм орон зай бөгөөд үнэртэй усны савнууд цагаан суурь дээр байрладаг бөгөөд 400 ваттын нэг чийдэн, дөрвөн дулаан саарал чийдэнгээр гэрэлтдэг.
- Basic.Space — цагаан гантиг дээрх кураторын галерей
- COS — цагаан ханатай загварлаг галерей