Telegram, WhatsApp+380637610482
Valeri Danjuk
Valeri DanjukkehittäjäTekoälytyökalujen kehittäminen yrityksille. Korkealaatuinen. Edullinen.Kirjoita Telegramissa
Foodnoms — esikatselu sivustosta tässä tyylissä

Foodnoms

Aurinkoinen hedelmämarkkinat valkoisella posliinilla - lämpimiä appelsiineja, raikkaita vihreitä ja runsaita pyöreitä muotoja

Foodnoms käyttää kevyttä markkinointikieltä ravitsemuksen seurantaan: puhdasta valkoista kangasta, ylisuuria puhelinmalleja visuaalisina ankkureina ja leikkisää värisanastoa, jossa värit edustavat ravintoaineita ja edistymistä. Kaksivärinen otsikkojärjestelmä (yksi väri avainsanalle, tumma grafiitti muille) mahdollistaa arvolupauksen nopean arvioinnin. Järjestelmä perustuu yhden käyttäjän näyttöön (Aquawax Pro), jossa on selkeästi pyöristetyt geometriset ominaisuudet, jotka pehmentävät datapainotteisten sovellusten näyttöjä. Useimmat pinnat ovat tasaisia ja varjottomia; yhtenäinen kulmien pyöristys antaa painikkeille, korteille ja tarroille ystävällisen ja pehmeän tuntuman, mikä tekee terveyden seurannasta helpommin lähestyttävää kuin kliinistä.

Sivulla on yksisarakkeinen, keskitetty, täysleveä asettelu (noin 1200 pikseliä) ja reilu pystysuuntainen rytmi. Ylätunniste on ohut yläpalkki, jossa logo on vasemmalla, navigointi keskellä ja täytetty oranssi toimintopainike oikealla. Pääosio on keskitetty pino: kaksivärinen otsikko, yksirivinen alaotsikko, App Store -kuvake ja sitten rivi 3–5 puhelinmallia leveyden poikki. Pääosan alapuolella on keskitetty "Suositeltuna" -lehdistölogo-osio 2x3-ruudukossa. Ominaisuusosiot noudattavat toistuvaa kaavaa: kaksisarakkeinen teksti + puhelinmalli, vuorottelevat sivut, ja korostusosioiden otsikot ovat oranssit/vihreät. Viimeinen elementti ennen alatunnistetta on täysleveä ladattava toimintakehotekortti. Osioiden väliset välit ovat reilut (96 pikseliä), mikä luo tilavan, galleriamaisen tunnelman. Navigointi on minimalistinen yläpalkki – ei sivupalkkia tai megavalikkoa.

Sovelluksen visuaalista kieltä hallitsevat korkealaatuiset iPhone-kehysten mockupit, jotka esittelevät sovelluksen käyttöliittymää – nämä ovat ensisijaisia elementtejä, eivät kuvapankkikuvia. Mockupit näytetään lähes täysin läpinäkyvästi, hieman päällekkäin ja tasaisesti pyörien, ja ne on sijoitettu suoraan valkoiselle taustalle. Mockupien sisällä visuaalisen komponentin tarjoaa sovelluksen oma käyttöliittymä: ravintotiedot, tuotekuvat, makrorenkaat ja värikkäät luokkatunnisteet. Ainoa valokuvasisältö on käyttäjien lähettämiä ruokakuvia, jotka näkyvät Scan Your Food -sovelluksen kameran näytöllä. Sovelluksessa ei ole lifestyle-kuvia, abstrakteja kuvituksia tai koristeellisia grafiikoita. Brändäys määritellään kokonaan mukautetulla fontilla, oranssi/vihreä/tumma värimaailmalla ja sovelluksen omalla käyttöliittymällä.

Paletti

Merkki

  • Ember Orange #ff5406 — Oranssia käytetään toissijaisena aksenttina koristeellisissa yksityiskohdissa ja korostamaan harvinaisia vihjeitä. Sitä ei tule käyttää ensisijaisena värinä toimintakehotuksissa.

Neutraali

  • Graphite #2f2f2f — Pääteksti, tummat painikkeet (App Store -kuvake) ja kuvakkeiden ääriviivat. Otsikoissa ja leipätekstissä vallitseva ei-valkoinen väri.
  • Verdant Green #00b33f — Vihreä väri toimii lisäaksenttina koristeellisille yksityiskohdille ja korostaa matalia taajuuksia.
  • Signal Red-Orange #ff3400 — Toissijainen lämmin aksentti, joka näkyy sovellusnäytön käyttöliittymäelementeissä ja niihin liittyvässä brändäyksessä. Yhtä sävyä lämpimämpi kuin Ember Orange, se korostaa valittuja tai aktiivisia sovellustiloja.
  • Sky Blue #00a9dd — Miellyttävä kontrasti sovelluksen sisäisille tietoluokille (hiilihydraatit/proteiinit/muut ravintoaineryhmät). Tasapainottaa puhelimen asettelujen lämmintä, hallitsevaa väripalettia.
  • Mist Blue #72a2c5 — Vaimennettu viileä korostus – Pehmentää taivaansinistä väriä sovelluksen sisäisiä lisätietootsikoita ja kaavioiden taustoja varten.
  • Sunset Orange #ff6d00 — Lämmin aksentti toissijaisissa otsikoissa ja korostetussa tekstissä markkinointisivuilla.

Typografia

12:sta 60 pikseliin · 7 vaihetta

  • Aquawax Pro Medium — korvaava: Inter · ääriviivat 500 · Aquawax Pro Medium - Löytyy uutetusta datasta, mutta tekoäly ei kuvaile sitä.
  • Aquawax Pro — korvaava: Nunito Sans · ääriviivat 700, 500, 600 · Ensisijainen brändifontti, jota käytetään kaikissa yhteyksissä, mukaan lukien otsikot ja leipäteksti. Tässä räätälöidyssä fontissa on leveät kirjainkorkeudet, pyöristetyt geometriset muodot ja mukavat mittasuhteet. Lihavoitua fonttia (700) käytetään otsikoissa ja osioissa – järjestelmän typografisissa maamerkeissä. Puolilihavoitua fonttia (600) käytetään alaotsikoissa ja painikkeiden otsikoissa 14–1,8 mm:n leveydellä. Keskipaksua fonttia (500) käytetään leipätekstissä 17–1,8 mm:n leveydellä, ja riittävän 1,6–1,8 mm:n rivivälin ansiosta lukeminen on mukavaa.
  • System sans-serif — korvaava: Inter · ääriviivat 400, 700 · Käyttöliittymässä käytetään varavaihtoehtoa erittäin pienelle tekstille ja kuvaketeksteille. Aquawax Prota ei käytetä mikrokoossa; järjestelmän fontti käsittelee ne renderöinnin painon vähentämiseksi.

Intervallit ja muoto

TarkoitusMerkitys
Tiheystilava
Perusvaihe20px
Painikkeen säde26px
Kortin säde26px
Varjotei - reunoja varjojen sijaan
Osioiden välillä96px
Sivun leveys1200px

Tekoäly rakentaa verkkosivustosi Foodnoms -tyyliin ja täyttää sen

  • Täytä tuotteilla ja julkaisuilla linkin kautta - Instagram, TikTok, Facebook.
  • Siirrä sisältöä vanhalta sivustoltasi – määritä vain osoite.
  • Moderni design parhaalla hakukonemoottorilla: React ( Next.js) palvelinrenderöinnillä ja SEO-optimoinnilla suoraan paketista.
  • Täysin automatisoitu hakukoneoptimointi hakutuloksille ja neuroverkkosuosituksille.

Samankaltaisia tyylejä

  • Slite — Lämmin pergamenttimuistikirja, jossa on terrakottakahva – jokainen pinta on kermanväristä paperia, jokainen yksityiskohta hienovarainen oranssin sävy.
  • Adora — Impressionismin museo himmeän lasin takana
  • Bento — Bento-eväsrasia auringon valaisemalla linoleumilla. Lämpimän, kermanvärisen pellavakankaan päällä on ruudukko pyöreistä, tarramaisista korteista limen, laventelin, koboltin ja viininpunaisen sävyissä, jokainen ääriviiva paksulla mustalla musteella. Kortit on koristeltu rohkealla geometrisella otsikolla.
  • Payments — Eloisa sitrushedelmien sävy kuninkaallisen violetin taustalla. Syvän sähköinen violetti tuo mieleen yötaivaan, kun taas sitruunankeltaiset yksityiskohdat kimaltelevat kuin raikas sitrushedelmien kuori puhtaan valkoista pintaa vasten.
  • Textla — Aurinkoinen retrokasvitieteellinen almanakka - Kermankeltainen sivu, painettu tummanvihreällä värillä, kaktuskuvituksin terävinä, epäkeskisinä varjoina
  • AI for Business — Brutalistinen toimituksellinen showroom lämpimin harmaan sävyin
  • Superhuman — kultaisen tunnin toimituspaneeli
  • Visitors — valkoinen tekninen piirustus
  • Vercel — Pääte painettu valkoiselle paperille
  • Jeton — Pääkirjoitus fintechistä lämpimällä marmorilla
  • Say Briefly — Luovan toimiston luonnoskirja kermanväriselle paperille
  • ClickUp — Tehokas kojelauta valkoisella marmorilla. Sivu on tuottavuustyökalun tuote-esite, joten visuaalinen kieli on lainattu tuotteesta itsestään: tiheät luettelot, tilaindikaattorit, avatar-ryhmät ja lihavoidut typografiset lausunnot, jotka näyttävät näytöllä olevalta tuotespesifikaatiolta.