
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 — Эфектыўная панэль кіравання на белым мармуры. Старонка ўяўляе сабою брашуру прадукта — прылады падвышэння прадукцыйнасці, таму візуальная мова запазычаная з самога прадукта: шчыльныя спісы, індыкатары статуту, групы аватараў і адважныя друкарскія заявы, якія выглядаюць як тэхнічная спецыфікацыя прадукта ў выставачным маштабе