Телеграм, WhatsApp жана башкалар+380637610482
Валерий Данюк
Валерий Данюкиштеп чыгуучуБизнес үчүн жасалма интеллект куралдарын иштеп чыгуу. Жогорку сапат. Арзан баада.Telegramга жазуу
Glossier — ушул стилдеги сайттын алдын ала көрүнүшү

Glossier

Күн нурундагы фотосессия - ак кагаз, кара сыя, бир ачык сары түс

Жылтырак түс санарип сулуулук журналы сыяктуу иштейт: ак жана кара түстөрдүн дээрлик монохромдуу полотносу, бренддин логотиби жана жалгыз чакырык катары кызмат кылган бир гана ачык сары акцент менен кооздолгон. Система редакциялык жактан чектелген — чоң Apercu аталыштары, кеңири текст мейкиндиги, эмоционалдык салмактын негизги бөлүгүн көтөргөн толук барактагы жашоо образынын сүрөттөрү — жана аткарууда утилитардык: жалпак продукт карточкалары, ичке чек аралар жана кооздуктун таптакыр жоктугу. Сары түс экинчи даражадагы бренд түсү эмес; ал БУЛ БРЕНДИН ӨЗҮ, сейрек колдонулат, ошондуктан ар бир көрүнүш камеранын жаркылдаганындай сезилет. Калганынын баары фонго жоголуп кетиши керек: нейтралдуу түстөр — бул жылуу боз түстөр, алардын астыңкы өңү жумшак, чек аралары жумшак, ал эми шрифти коюу жана кыскартылган. Натыйжада, ишенимдүү, жөнөкөй жана компромисссиз заманбап сезилген витрина пайда болот.

Баракчада толук экрандуу бөлүмдөрдүн вертикалдуу түрдө жайгаштырылган сериясы бар, алардын ар бири өзүнчө редакциялык жайылма катары иштелип чыккан. Негизги бөлүм - бул калкып жүрүүчү ак катмары (жогорку сол жакта) жана барактын бүт ылдый жагын ээлеген чоң сары логотипи бар толук туурасындагы сүрөт. Негизги бөлүмдүн астында бөлүмдөр толук экрандагы сүрөттөр менен жеке карталардын торчолорунун ортосунда кезектешип жайгашкан. Категорияларды (териге кам көрүү/макияж) сүрөттөрдүн бирдей катышы (50/50) менен эки тилкеге бөлүү көрүнүктүү чек арасыз жүрөт - аларды сүрөттөрдү бириктирген сызык гана бөлүп турат. Продукция каталогунда #f7f7f7 полотносунда төрт тилкелүү төрт бурчтуу карталардын торчосу колдонулат. Навигация - бул үстүндө кошумча жарнама тилкеси бар минималисттик үстүнкү тилке. Бөлүмдөрдүн ортосундагы боштуктар бир топ чоң (64 пиксель), бирок бөлүмдөрдүн ортосундагы өткөөлдөр жылмакай - бөлгүчтөрсүз же фондун түстөрү алмашып турбайт, жылуу колонтитулдан башкасы. Жалпы ритм: сүрөт, текст, сүрөт, торчо, сүрөт - мода журналын барактап жаткандай.

Фотография – визуалдык тилдин басымдуу бөлүгү. Көрүү аймагынын баары жашоо образынын сүрөттөрү жана портреттер менен толтурулган — жылуу алтын саат жарыктары, теринин жумшак жакындатылган сүрөттөрү, күндүн жаркыроосунун фонунда продуктунун бөтөлкөлөрүн кармаган колдор. Сүрөттөрдөгү түстөр палитрасы жылуу жана каныкпаган: шабдалы асманы, терракота терисинин өңдөрү, терең океан көк түстөрү. Сүрөттөр ар дайым барактын бүтүндөй бетин ээлейт, тегеректелген бурчтары, рамкалары же катмарлары жок, ак тексттик карточкалардан же сары логотиптен тышкары. Каталогдук карточкалардагы продуктунун сүрөттөрү таза ак түстөгү бир калыптагы фондо, жалпак, бирдей жарык менен тартылган. Сүрөттүн текстке катышы болжол менен 70/30 — сүрөттөр эмоцияны, текстти, функцияны чагылдырат. Иллюстрациялар жок, абстракттуу графика жок, 3D рендеринг жок.

Түстөр палитрасы

Бренд

  • Glossier Yellow #fff116 — Сары түс декоративдик деталдарды жана сейрек колдонулган издөө сурамдарын белгилөө үчүн кошумча акцент катары колдонулат. Ал аракетке чакыруу үчүн негизги түс катары колдонулбашы керек.

Нейтралдуу

  • Ink #000000 — Негизги текст, навигация шилтемелери, негизги текст, төмөнкү колонтитул тексти, сөлөкөттөрдүн контурлары, ичке чек аралар; басымдуу типографиялык жана структуралык түс.
  • Paper #ffffff — Продукциянын картасынын беттери, толтуруу аянттары, көтөрүлгөн панелдер; үймөктөгү эң жаркыраган бет деңгээли.
  • Fog #f7f7f7 — Барактын холст, бөлүмдүн фондору, барактагы сүрөттөрдүн ортосундагы өткөөлдөр; бүтүндөй веб-сайт жайгашкан негизги бет.
  • Blush #faf2f4 — Төмөнкү колонтитулдун фоны, жумшак жылуу бөлүк бөлгүчтөрү; бир аз кызгылт-ак түс барактардын ылдый жагына жылуулук кошот.
  • Mist #f0f0f0 — Көзгө көрүнбөгөн фон түзүү жана бөлүктөрдү бөлүү үчүн жеңил колдоочу бет. Аны аракетке чакыруу үчүн негизги түс катары колдонбоңуз.
  • Ash #e8e8e8 — Киргизүү талаасынын чек аралары, сөлөкөттөрдүн фондору, ичке бөлгүч сызыктар; карталар жана форма элементтери үчүн структуралык чек аранын түсү.

Типография

12ден 32 пикселге чейин · 5 кадам

  • Apercu — алмаштыруу: Inter · контурлар 400, 500, 700 · Негизги шрифт колдонуучу интерфейсинде колдонулат — негизги текст 16px/400, навигация жана коштомо жазуулар 12–14px/500, кошумча аталыштар 20px/500 жана редакциялык аталыштар 32px/700. Apercu компаниясынын геометриялык, гумандуу дизайны брендге кыскартылган, заманбап стилди берет; нөлгө жакын тамга аралыгы (0.002–0.003em) шрифтти абадай же достук эмес, компакттуу жана журнал сыяктуу кылат. 700 салмагы редакциялык макалалардагы дисплей элементтери үчүн сакталган, UI элементтери үчүн эмес.
  • Apercu Mono — алмаштыруу: JetBrains Mono or IBM Plex Mono · контурлар 400 · Буйрутманын метадайындары, көзөмөлдөө номерлери жана коддун жанындагы энбелгилер үчүн микроутилитардык типография; бир аралыктагы версия пропорционалдуу дене түрүнө каршы техникалык текстураны түзөт.
  • GTStandard-M — алмаштыруу: Inter · контурлар 400 · GTStandard-M - Алынган маалыматтардан табылган, бирок жасалма интеллект тарабынан сүрөттөлгөн эмес.

Интервалдар жана форма

МаксатыМааниси
Тыгыздыкорточо
Негизги кадам8px
Баскычтын радиусу0px
Картанын радиусу0px
Көлөкөлөркөлөкөлөрдүн ордуна чек аралар жок
Бөлүмдөрдүн ортосунда64px
Барактын туурасы1440px

Жасалма интеллект сиздин веб-сайтыңызды Glossier стилинде куруп, аны толтурат

  • Instagram, TikTok, Facebook шилтемелери аркылуу өнүмдөр жана посттор менен толтуруңуз.
  • Эски сайтыңыздан мазмунду өткөрүп бериңиз — жөн гана даректи көрсөтүңүз.
  • Эң мыкты кыймылдаткычтагы заманбап дизайн: серверди рендеринг жана SEO оптималдаштыруу менен React ( Next.js).
  • Издөө натыйжалары жана нейрон тармактарынын сунуштары үчүн толугу менен автоматташтырылган SEO оптималдаштыруу.

Окшош стилдер

  • Lightship — Ачык жолдун кинематографиялык диорамасы. Жакын аралыкта илинген чоң пейзаждык сүрөттөр менен кооздолгон жылуу каймак түстүү галереянын дубалдары, алкакта араң көрүнгөн ичке кара шрифт жана шалбаадагы оттой монохромду бузуп турган бир гана ачык кызгылт сары түс.
  • Faire ES — жылуу каймактын дүң каталогу
  • Adanola — Ак кагазга басылган редакциялык лоок-бук. Типография жана фотография таза ак беттерде дем алган мода сүрөткө тартуу, шрифт үчүн кара сыя жана бренддин жалпы стилин чагылдырган назик кол тамгалуу sans-serif шрифти (Favorit).
  • Oura Ring — Жумшак күндүзгү жарыкта жайлуу сулу боткосун жасоочу цех
  • Stykka — Ак жарыктагы скандинавиялык устакана – тынч, колго жасалган көргөзмө залы, анда жалгыз үн фотография гана
  • DJI — бир электрдик көк түстөгү жарык берүүчү аэрокосмостук кара холст
  • Altitude Beverages — Бир түстүү журналдардын бети. Сүрөттөрдөн башкасынын баары түссүз мода журналдарынын бетин элестетиңиз — текст жана ак боштук бүт окуяны баяндап берет.
  • AATHER — Ачык алакан, жалгыз жалын - жымжырттыкта жайгашкан тынч люкс
  • Cowboy — Кардай аппак фарфор жасалгасындагы бельгиялык велосипед галереясы. Кытырак беттер, редакциялык материалдарда колдонулган чоң шрифттер жана жасалгалоонун жоктугу велосипедге жана анын ичиндеги нерселерге көңүл бурган көргөзмө залы.
  • Refero — Ак мраморго басылган редакциялык макет - бул типограф тарабынан түзүлгөн продукт барагы, анда serif аталышы бренддин визиттик картасы болуп саналат, ал эми калганынын баары байкалбайт
  • Face Formula — Скандинавиялык редакциялык портрет. Тынч, журнал стилиндеги сүрөт, анда моделдин көз карашы жана кыскартылган сериф шрифти менен жазылган аталыш салкын, тумандуу фондо өзү үчүн сүйлөп турат.
  • Shupatto — Ак мрамордон жасалган музейдин көргөзмө текчеси