Тэлеграм, WhatsApp  +380637610482
Валерый Данюк
Валерый ДанюкраспрацоўшчыкРаспрацоўка ІІ-інструментаў для бізнесу. Якасна. Нядорага.Напісаць у Telegram
Foodnoms - папярэдні прагляд сайта ў гэтым стылі

Foodnoms

Сонечны фруктовы рынак на белым фарфоры - цёплыя аранжавыя, свежыя зялёныя і аб'ёмныя круглявыя формы.

Foodnoms ўяўляе сабой светлы маркетынгавы мову для адсочвання харчавання: чысты белы палатно, павялічаныя макеты тэлефонаў у якасці візуальнага якара і гуллівы каляровай слоўнік, дзе колеру кадуюць пажыўныя рэчывы і прагрэс. Двухкаляровая схема загалоўкаў (адзін колер для ключавога слова, цёмна-графітавы для астатняга) дазваляе хутка ацаніць каштоўнаснае прапанову. Сістэма абапіраецца на адзіны карыстацкі дысплей (Aquawax Pro) з выразна закругленымі геаметрычнымі рысамі, якія змякчаюць насычаныя дадзенымі экраны прыкладанняў. Большасць паверхняў плоскія і без ценяў; раўнамерны радыус скруглення кутоў надае кнопкам, карткам і пазнакам прыязнае, мяккае адчуванне, дзякуючы чаму адсочванне здароўя ўспрымаецца хутчэй як даступны, чым як клінічны занятак.

Старонка мае аднакалонкавы, цэнтраваны макет максімальнай шырыні (~1200px) з шчодрым вертыкальным рытмам. Загаловак уяўляе сабой тонкую верхнюю панэль з лагатыпам злева, навігацыяй па цэнтры і запоўненай аранжавай кнопкай дзеяння справа. Геройская частка ўяўляе сабой цэнтраваны стэк: двухколерны загаловак, аднарадковы падзагаловак, значок App Store, а затым шэраг з 3-5 макетаў тэлефонаў, размешчаных веерам па ўсёй шырыні. Пад героем знаходзіцца цэнтраваная секцыя з лагатыпам для прэсы "Як рэкамендавана" ў сетцы 2×3. Раздзелы з функцыямі ідуць па шаблоне, які паўтараецца: двухкалонкавы тэкст + макет тэлефона, якія чаргуюцца бакі, з акцэнтнымі загалоўкамі раздзелаў аранжавага/зялёнага колеру. Апошні элемент перад ніжнім калантытулам - гэта картка CTA для загрузкі ва ўсю шырыню. Прамежкі паміж раздзеламі вялікія (96px), ствараючы адчуванне прастору, як у галерэі. Навігацыя ўяўляе сабой мінімалістычную верхнюю панэль - без бакавой панэлі і мега-меню.

Візуальная мова прыкладання дамінуюць высакаякасныя макеты рамак iPhone, якія дэманструюць які працуе інтэрфейс прыкладання - гэта галоўныя элементы, а не стокавыя фатаграфіі. Макеты адлюстроўваюцца з амаль поўнай празрыстасцю, веерам з невялікім накладаннем і плыўным паваротам, размяшчаючыся непасрэдна на белым фоне. Унутры макетаў візуальны складнік забяспечвае ўласны інтэрфейс прыкладання: дадзеныя аб харчовай каштоўнасці, фатаграфіі прадуктаў, макракольцы і маляўнічыя тэгі катэгорый. Адзіны фатаграфічны кантэнт - гэта прадстаўленыя карыстальнікамі выявы прадуктаў харчавання, бачныя на экране камеры прыкладання «Скануйце сваю ежу». Ніякіх фатаграфій у стылі лайфстайл, ніякіх абстрактных ілюстрацый, ніякай дэкаратыўнай графікі. Фірмовы стыль цалкам вызначаецца распрацаваным шрыфтам, каляровай сістэмай аранжавы/зялёны/цёмны і ўласным інтэрфейсам дадатку.

Палітра

Брэнд

  • Ember Orange #ff5406 — Аранжавы колер выкарыстоўваецца ў якасці дапаможнага акцэнту для дэкаратыўных дэталяў і акцэнтаванні ўвагі на нячастых сігналах. Не варта вылучаць яго як асноўны колер закліку да дзеяння.

Нейтральныя

  • Graphite #2f2f2f — Асноўны тэкст, цёмныя кнопкі (значок App Store) і абводка абразкоў. Пераважны ня белы колер у загалоўках і асноўным тэксце.
  • Verdant Green #00b33f — Зялёны колер служыць дадатковым акцэнтам для дэкаратыўных дэталяў і падкрэсліванні нізкіх частот.
  • Signal Red-Orange #ff3400 — Другасны цёплы акцэнт, прыкметны ў элементах карыстацкага інтэрфейсу экрана прыкладання і ў спадарожных момантах, звязаных з брэндам. На адзін тон цяплей, чым Ember Orange, для акцэнтавання ўвагі на абраных ці актыўных станах прыкладання.
  • Sky Blue #00a9dd — Прыемны кантраст для ўнутраных катэгорый дадзеных прыкладання (вугляводы/вавёркі/іншыя групы пажыўных рэчываў). Ураўнаважвае цёплую, дамінуючую каляровую палітру ў макетах тэлефонаў.
  • Mist Blue #72a2c5 — Прыглушаны халодны акцэнт - змякчае сіні колер Sky для дадатковых метак дадзеных і фону дыяграм ўнутры прыкладання.
  • Sunset Orange #ff6d00 — Цёплы акцэнт для другарадных загалоўкаў і выдзеленага тэксту на старонках маркетынгавых матэрыялаў.

Друкарня

ад 12 да 60px · 7 прыступак

  • Aquawax Pro Medium — замена: Inter · напісання 500 · Aquawax Pro Medium - выяўлены ў вынятых дадзеных, але не апісаны ІІ.
  • Aquawax Pro — замена: Nunito Sans · напісання 700, 500, 600 · Асноўны фірмовы шрыфт, які выкарыстоўваецца ва ўсіх кантэкстах: загалоўках і асноўным тэксце. Гэты спецыяльна распрацаваны шрыфт адрозніваецца шырокай вышынёй малых літар, круглявымі геаметрычнымі формамі і зручнымі прапорцыямі. Тоўсты (700) выкарыстоўваецца для загалоўкаў і раздзелаў - гэта друкарскія арыенціры сістэмы. Паўтлусты (600) выкарыстоўваецца для падзагалоўкаў і надпісаў кнопак памерам 14-1,8 мм. Сярэдні (500) выкарыстоўваецца для асноўнага тэксту памерам 17-1,8 мм з дастатковай міжрадковай разметкай 1,6-1,8 мм для камфортнага чытання.
  • System sans-serif — замена: Inter · напісання 400, 700 · Для вельмі дробных тэкставых і абразочных надпісаў у карыстацкім інтэрфейсе выкарыстоўваецца рэзервовы варыянт. Aquawax Pro не выкарыстоўваецца ў мікрапамерах; сістэмны шрыфт апрацоўвае іх, каб знізіць вагу адмалёўкі.

Інтэрвалы і форма

ПрызначэннеЗначэнне
Шчыльнасцьпрасторная
Базавы крок20px
Радыус кнопак26px
Радыус картак26px
Ценіне - межы замест ценяў
Паміж секцыямі96px
Шырыня старонкі1200px

ІІ збярэ ваш сайт у стылі Foodnoms і напоўніць яго

  • Напоўніць таварамі і пастамі па спасылцы — Instagram, TikTok, Facebook.
  • Перанясе кантэнт са старога сайта - дастаткова пазначыць адрас.
  • Сучасны дызайн на лепшым рухавічку: React ( Next.js) з серверным рэндэрынгам і SEO-аптымізацыяй са скрынкі.
  • Поўная аўтаматычная SEO-аптымізацыя пад пошукавую выдачу і рэкамендацыі нейрасетак.

Падобныя стылі

  • Slite — Нататнік з цёплага пергаменту з тэракотавай ручкай - кожная паверхня выканана з крэмавай паперы, кожны акцэнт - гэта ледзь прыкметны рыска аранжавага колеру
  • Adora — Музей імпрэсіянізму за матавым шклом
  • Bento — Ланчбокс бента на залітым сонцам лінолеўме. Сетка з круглявых, падобных на налепкі картак салатавага, лавандавага, кобальтавага і бардовага колераў, кожная з якіх абведзена густым чорным чарнілам, ляжыць на цёплым крэмавым ільняным палатне пад упэўненым геаметрычным загалоўкам.
  • Payments — Яркае цытрусавае адценне на фоне каралеўскага фіялетавага. Глыбокі электрычны фіялетавы колер нагадвае начное неба, а цытрынава-жоўтыя акцэнты зіхацяць, як свежая цытрусавая цэдра, на чыстай белай паверхні.
  • Textla — Сонечны рэтра-батанічны альманах - старонка крэмава-жоўтага колеру, надрукаваная цёмна-зялёным колерам, з ілюстрацыямі кактусаў, выкананымі з выкарыстаннем рэзкіх зрушаных ценяў
  • AI for Business — Бруталістская рэдакцыйная выставачная зала ў цёплых шэрых танах
  • Superhuman — рэдакцыйная панэль залатой гадзіны
  • Visitors — белы інжынерны чарцёж
  • Vercel — Надрукаваны на белай паперы тэрмінал
  • Jeton — Рэдакцыйны артыкул аб фінтэху на цёплым мармуры
  • Say Briefly — Скетчбук крэатыўнага агенцтва на крэмавай паперы
  • ClickUp — Эфектыўная панэль кіравання на белым мармуры. Старонка ўяўляе сабою брашуру прадукта — прылады падвышэння прадукцыйнасці, таму візуальная мова запазычаная з самога прадукта: шчыльныя спісы, індыкатары статуту, групы аватараў і адважныя друкарскія заявы, якія выглядаюць як тэхнічная спецыфікацыя прадукта ў выставачным маштабе