Foodnoms
Mercato della frutta soleggiato su porcellana bianca: arance calde, verdure fresche e forme voluminose e arrotondate.
Foodnoms adotta un linguaggio di marketing leggero e spensierato per il monitoraggio nutrizionale: una tela bianca pulita, mockup di smartphone di grandi dimensioni come elementi visivi di riferimento e una palette di colori giocosa in cui i colori rappresentano nutrienti e progressi. Un'intestazione a due colori (un colore per la parola chiave, grafite scuro per il resto) consente una rapida valutazione della proposta di valore. Il sistema si basa su un unico display utente (Aquawax Pro) con caratteristiche geometriche distintamente arrotondate che ammorbidiscono le schermate dell'app, ricche di dati. La maggior parte delle superfici è piatta e priva di ombre; il raggio uniforme degli angoli conferisce a pulsanti, schede ed etichette un aspetto amichevole e morbido, rendendo il monitoraggio della salute più accessibile che clinico.
La pagina presenta un layout a colonna singola, centrato e a larghezza intera (~1200px) con un ampio ritmo verticale. L'intestazione è costituita da una sottile barra superiore con il logo a sinistra, la navigazione centrata e un pulsante di azione arancione pieno a destra. La sezione principale è composta da una pila centrata: un titolo bicolore, un sottotitolo su una sola riga, l'icona dell'App Store e poi una riga di 3-5 mockup di telefoni disposti a ventaglio lungo la larghezza. Sotto la sezione principale si trova una sezione centrata con il logo stampa "Consigliato" in una griglia 2x3. Le sezioni dedicate alle funzionalità seguono uno schema ripetitivo: testo su due colonne + mockup di telefono, lati alternati, con titoli di sezione in arancione/verde. L'ultimo elemento prima del piè di pagina è una scheda CTA scaricabile a larghezza intera. Gli spazi tra le sezioni sono ampi (96px), creando un'atmosfera spaziosa, simile a quella di una galleria. La navigazione è costituita da una barra superiore minimalista, senza barra laterale o mega menu.
Il linguaggio visivo dell'app è dominato da mockup di alta qualità di cornici per iPhone che mostrano l'interfaccia funzionante dell'app: questi sono gli elementi principali, non le immagini di repertorio. I mockup sono visualizzati con una trasparenza quasi totale, disposti a ventaglio con una leggera sovrapposizione e una rotazione fluida, e posizionati direttamente su uno sfondo bianco. All'interno dei mockup, la componente visiva è fornita dall'interfaccia stessa dell'app: informazioni nutrizionali, foto dei prodotti, anelli macro e tag di categoria colorati. L'unico contenuto fotografico è costituito da immagini di alimenti caricate dagli utenti e visibili sullo schermo della fotocamera dell'app Scan Your Food. Non ci sono foto di lifestyle, illustrazioni astratte o elementi grafici decorativi. Il branding è interamente definito dal font personalizzato, dalla combinazione di colori arancione/verde/scuro e dall'interfaccia stessa dell'app.
Tavolozza
Marca
- Ember Orange
#ff5406— L'arancione viene utilizzato come accento secondario per dettagli decorativi e per evidenziare elementi che si presentano raramente. Non dovrebbe essere utilizzato come colore principale per le chiamate all'azione.
Neutro
- Graphite
#2f2f2f— Testo principale, pulsanti scuri (icona dell'App Store) e contorni delle icone. Un colore predominante non bianco nei titoli e nel corpo del testo. - Verdant Green
#00b33f— Il colore verde funge da ulteriore accento per i dettagli decorativi e per enfatizzare le basse frequenze. - Signal Red-Orange
#ff3400— Un accento caldo secondario, visibile negli elementi dell'interfaccia utente delle schermate dell'app e nel relativo branding. Di una tonalità più calda rispetto all'arancione brace, enfatizza gli stati dell'app selezionati o attivi. - Sky Blue
#00a9dd— Un piacevole contrasto per le categorie di dati interne dell'app (carboidrati/proteine/altri gruppi di nutrienti). Bilancia la palette di colori caldi e dominanti nei layout del telefono. - Mist Blue
#72a2c5— Accento freddo attenuato - Ammorbidisce il colore azzurro cielo per le etichette dati aggiuntive e gli sfondi dei grafici all'interno dell'app. - Sunset Orange
#ff6d00— Un accento caldo per i titoli secondari e il testo evidenziato nelle pagine di marketing.
Tipografia
da 12 a 60px · 7 passaggi
- Aquawax Pro Medium — sostituzione: Inter · contorni 500 · Aquawax Pro Medium - Trovato nei dati estratti ma non descritto dall'IA.
- Aquawax Pro — sostituzione: Nunito Sans · contorni 700, 500, 600 · Il carattere principale del marchio, utilizzato in tutti i contesti, inclusi titoli e corpo del testo. Questo carattere personalizzato presenta altezze delle lettere generose, forme geometriche arrotondate e proporzioni confortevoli. Il grassetto (700) è utilizzato per titoli e sezioni, elementi tipografici fondamentali del sistema. Il semigrassetto (600) è utilizzato per sottotitoli ed etichette dei pulsanti con un'interlinea di 14-1,8 mm. Il medio (500) è utilizzato per il corpo del testo con un'interlinea di 17-1,8 mm, con una spaziatura tra le righe di 1,6-1,8 mm per una lettura confortevole.
- System sans-serif — sostituzione: Inter · contorni 400, 700 · Nell'interfaccia utente, per i testi e le icone di dimensioni molto ridotte, viene utilizzata un'opzione di fallback. Aquawax Pro non viene utilizzato per le dimensioni minime; in questi casi, il font di sistema gestisce il problema per ridurre il peso di rendering.
Intervalli e forma
| Scopo | Senso |
|---|---|
| Densità | spazioso |
| Passo base | 20px |
| Raggio del pulsante | 26px |
| Raggio della carta | 26px |
| Ombre | no - bordi invece di ombre |
| Tra le sezioni | 96px |
| Larghezza del pannello | 1200px |
L'IA creerà il tuo sito web nello stile Foodnoms e lo riempirà
- Pubblica prodotti e contenuti tramite il link: Instagram, TikTok, Facebook.
- Trasferisci i contenuti dal tuo vecchio sito: basta specificare l'indirizzo.
- Design moderno sul miglior motore: React ( Next.js) con rendering lato server e ottimizzazione SEO integrata.
- Ottimizzazione SEO completamente automatizzata per i risultati di ricerca e raccomandazioni basate su reti neurali.
Stili simili
- Slite — Un taccuino in pergamena calda con manico in terracotta: ogni superficie è di carta color crema, ogni dettaglio un delicato tocco di arancione.
- Adora — Il Museo dell'Impressionismo dietro un vetro smerigliato
- Bento — Un portapranzo bento su un linoleum illuminato dal sole. Una griglia di cartoncini arrotondati, simili ad adesivi, nei colori lime, lavanda, cobalto e bordeaux, ciascuno delineato da un inchiostro nero spesso, giace su un lino caldo e cremoso sotto un titolo geometrico e audace.
- Payments — Una vibrante tonalità agrumata su uno sfondo viola regale. Il profondo viola elettrico evoca il cielo notturno, mentre gli accenti giallo limone brillano come scorza di agrumi freschi su una superficie bianca immacolata.
- Textla — Almanacco botanico retrò e solare - Pagina color giallo crema stampata in verde scuro con illustrazioni di cactus rese con ombre nette e sfalsate.
- AI for Business — Sala espositiva in stile brutalista dai toni caldi del grigio.
- Superhuman — panel editoriale dell'ora d'oro
- Visitors — disegno tecnico bianco
- Vercel — Terminale stampato su carta bianca
- Jeton — Un editoriale sul fintech su marmo caldo
- Say Briefly — Blocco da disegno dell'agenzia creativa su carta color crema
- ClickUp — Una dashboard di grande impatto su sfondo di marmo bianco. La pagina è una brochure di prodotto per uno strumento di produttività, quindi il linguaggio visivo è mutuato dal prodotto stesso: elenchi densi, indicatori di stato, gruppi di avatar e affermazioni tipografiche in grassetto che sembrano le specifiche di un prodotto esposto.