Beschrijving: Deze tool stelt je in staat om de visuele identiteit en grafische stijl (kleuren, lettertypen, lay-out) van je gehele Framework360-systeem te definiëren, waardoor consistentie tussen de website en communicatie wordt gegarandeerd.
Waar is het voor? (Praktische voorbeelden)
Gebruik het om:
- Te zorgen dat alle grafische elementen (knoppen, titels, links) voldoen aan de kleuren en het bedrijfsmerk.
- De typografie (lettertypen en afmetingen) in te stellen om de leesbaarheid van de site en communicatie te verbeteren.
- Snel het uiterlijk van het systeem te bepalen via automatische stijlgeneratie op basis van Kunstmatige Intelligentie.
Belangrijkste functies
1. Stijlgeneratie via AI
Je kunt automatisch een set basis kleuren en stijlen genereren door op de knop "Genera stile tramite AI" te klikken. Het systeem begeleidt je door een snel creatieproces en laat een voorbeeld zien voordat je het ontwerp toepast.
2. Algemene instellingen
- Contenitore: Bepaalt de maximale breedte van de inhoud (in pixels) voor verschillende schermformaten (Extra Large, Large, Medium, Small).
- Colori: Hiermee stel je het standaard kleurenpalet van het systeem in (bijv. Primario, Secondario, Successo, Errore) via een kleurkiezer. Deze kleuren zijn beschikbaar voor gebruik in het hele systeem.
3. Typografie en stijlen
- Titoli (H1-H6): Hiermee kun je een specifiek lettertype, kleur, regelhoogte en grootte (in pixels) instellen voor elk kopniveau van H1 tot H6.
- Corpo Pagina: Stelt het hoofdlettertype, grootte en regelhoogte in voor standaardtekst, evenals tekstkleur en achtergrondkleur van de pagina.
- Logo: Hiermee stel je een standaard breedte in (in pixels) voor het bedrijfslogo.
- Link: Definieert de kleur van hyperlinks en de kleur die ze aannemen wanneer de gebruiker er met de muis overheen gaat ("hover"-status).
4. Achtergrondbeheer
Als je ervoor kiest om een achtergrondafbeelding voor de pagina-inhoud te gebruiken, kun je geavanceerde opties configureren:
- Immagine di sfondo: Uploaden van een afbeeldingsbestand.
- Dimensione: Weergavemodus van de afbeelding (bijv.
cover,contain,auto). - Ripeti: Of de afbeelding herhaald moet worden (verticaal, horizontaal of om ruimte te vullen).
- Posizione: Waar de afbeelding binnen de pagina verankerd moet worden (bijv. midden, linksboven).
- Attaccamento: Of de afbeelding met de pagina moet scrollen (
scroll) of vast moet blijven staan (fixed).
5. Aangepaste lettertypen
Je kunt eigen bedrijfslettertypen uploaden (.ttf of .otf). Na upload zijn deze lettertypen direct beschikbaar in de lettertypeselector voor titels en paginatekst.
6. Knopstijlen
Deze geavanceerde sectie maakt het mogelijk om het uiterlijk van alle vooraf gedefinieerde knoppen in het systeem aan te passen (gebaseerd op kleuren uit de sectie "Colori"). Je kunt een visuele editor gebruiken om gedetailleerd stijlkenmerken zoals randen, schaduwen, achtergrond- en tekstkleuren per type knop te definiëren.
Hoe configureer je dit
Alle instellingen zijn georganiseerd in secties binnen het bewerkingsformulier. Na wijzigingen klik je op de standaard opslaan-knop van het systeem.
| Sectie | Configuratieoptie | Beschrijving |
|---|---|---|
| Generali | Larghezza Contenitore | Stelt maximale inhoudsbreedte in voor apparaten (Extra Large, Large, Medium, Small). |
| Generali | Colori (Primario, Successo, etc.) | Definitie van het hoofdkleurenpalet van het systeem. |
| Titoli (H1-H6) | Font, Colore, Dimensione | Keuze van lettertype en visuele eigenschappen voor alle titels. |
| Corpo Pagina | Font, Dimensione, Colore | Instellingen voor hoofdtekst op pagina. |
| Corpo Pagina | Sfondo e Immagine | Definitie van achtergrondkleur en upload/beheer van achtergrondafbeelding. |
| Logo | Larghezza predefinita | Standaard logo-afmeting in pixels. |
| Link | Colore e Colore Hover | Definitie van linkkleur normaal en bij hover-status. |
| Caratteri Personalizzati | Caricamento Font | Uploaden van .ttf/.otf bestanden voor gebruik in systeem. |
| Pulsanti | Stile per tipo | Geavanceerde personalisatie van knopstijl per type knop (bijv. Pulsante Primario, Pulsante di Avviso). |
Automatische integraties
Consistentie in Transactionele E-mails
De stijl- en kleurinstellingen die in deze module zijn gedefinieerd worden automatisch toegepast bij het formatteren van e-mails die door het systeem worden verzonden (zoals meldingen of communicatiesjablonen). Dit zorgt ervoor dat e-mails dezelfde grafische uitstraling hebben als jouw website.
