Vormgeving bepaalt hoe je platform eruitziet: het logo, de kleuren, het lettertype en waar de navigatie staat. Een platform in je eigen huisstijl voelt als jouw product, niet als een tool die je huurt, en leden herkennen het in één oogopslag.
Open de vormgevingsinstellingen
Om hier wijzigingen op te slaan, heeft je rol naast toegang tot de instellingen ook Platformvormgeving beheren nodig. Eigenaar en Beheerder hebben ze allebei. Het tabblad Community is de uitzondering, zie hieronder.
De tabbladen
Vormgeving is verdeeld in Branding, Lay-out, Inloggen en registratie, Laadscherm, Community, Cursussen en Videospeler. De eerste twee bepalen het hele platform, de andere geven elk één onderdeel vorm.
Logo en favicon
Onder Branding nemen Logo en Favicon elk twee afbeeldingen: één voor de Lichte modus en één voor de Donkere modus. Klik op een tegel om een afbeelding uit je mediabibliotheek te kiezen.
- Het logo werkt het best als SVG of PNG in een verhouding van 5:1, het liefst 1000 × 200 px.
- De favicon werkt het best als SVG of PNG in een verhouding van 1:1, het liefst 512 × 512 px.
De favicon is het kleine pictogram in het browsertabblad en het beeldmerk op het laadscherm. Het logo voor de Lichte modus is ook het logo van je systeemmails, tot je daar een apart logo voor instelt.
Kleuren voor de lichte en donkere modus
Kleur bevat per modus vier kleuren: Primair, Tekst, Markering en Achtergrond. Elke kleur is een hexwaarde van zes tekens, zoals #0084FF.
Wijzig je de primaire kleur, dan stelt een hint Achtergrond afstemmen op je primaire kleur voor. Toepassen voegt 2% van je primaire kleur toe aan de paginaachtergrond, zodat die een lichte tint van je merk krijgt. Sluiten laat de achtergrond zoals hij is.
Waarom beide paletten tellen
Iedereen wisselt zelf tussen licht en donker, met Donkere modus in het accountmenu. Nieuwe accounts beginnen in de lichte modus. Je kunt de modus niet voor je leden kiezen, dus controleer of je logo, tekst en achtergrond in beide goed leesbaar zijn. Met de knop Lichte/donkere modus boven het voorbeeld wissel je zelf terwijl je werkt.
Lettertype en avatars
Typografie stelt één lettertypefamilie in voor het hele platform. Lettertypen zoeken filtert de lijst, en elk item toont een voorbeeldregel in dat lettertype. Standaard gebruikt het platform Roboto.
Avatars van leden kiest overal de vorm van profielfoto’s: Rond of Vierkant.
Lay-out
Lay-out bepaalt het kader rond elke pagina.
- Positie van de navigatie: Zijbalk (links) is het klassieke verticale menu, Bovenbalk zet het menu bovenaan met inhoud over de volle breedte, en Gecombineerd toont bovenaan een metabalk met het hoofdmenu als megamenu daaronder.
- Zijbalk verschijnt alleen bij Zijbalk (links) en biedt Licht, Donker, Glas en Accent.
- Header is Geanimeerd, een gekleurde band met langzaam bewegende vormen, of Stil, een effen balk op de paginaachtergrond.
- Kaartstijl bepaalt hoeveel kaarten loskomen van de achtergrond: Vlak, Standaard of Verhoogd.
- Hoeken rondt knoppen en vakken af in vijf stappen, van Geen tot Rond.
- Glastint en Glasvervaging regelen de matglazen vlakken, zoals headers, uitklappanelen en vervolgkeuzelijsten: hoe ondoorzichtig ze zijn en hoe sterk ze vervagen wat erachter ligt.
Een nieuw platform begint met Zijbalk (links), de zijbalk op Licht, de header op Geanimeerd, de kaarten op Vlak en de hoeken op Middel.
Voorbeeld, resetten en opslaan
Het Voorbeeld naast Branding en Lay-out toont een voorbeeldpagina met je huidige keuzes, nog voordat je opslaat. Wissel tussen Desktop en Mobiel, schakel Lichte/donkere modus om of open het op Volledig scherm.
Zodra een onderdeel afwijkt van de standaard, toont het Resetten. Bevestig je met Resetten in het venster Standaard herstellen, dan zet dat het onderdeel in het formulier terug op de standaardwaarden. Er wordt niets bewaard tot je opslaat.
Sla op met Opslaan in de balk onderaan. De nieuwe kleuren, het lettertype en de hoeken gelden meteen, zonder dat de pagina opnieuw laadt.
Inlogpagina en laadscherm
Inloggen en registratie geeft vorm aan de pagina’s die mensen zien voordat ze inloggen. Kies een lay-out, Kaart of Gesplitst scherm, een Kaartstijl en het Logotype: Logo, Favicon of Geen. Achtergrondafbeeldingen en teksten stel je per pagina in op hetzelfde tabblad.
Laadscherm stelt de animatie in die verschijnt terwijl je platform laadt. Onder Laadstijl kies je er een uit zes: Aurora, Puls, Tegels, Skelet, Ring en Sterrenbeeld. Aurora is de standaard, en Herhalen in het voorbeeld speelt je keuze opnieuw af.
Stel de favicon in voordat je een laadstijl kiest. Elke stijl bouwt de animatie eromheen op.
Community, cursussen en de videospeler
De laatste drie tabbladen geven elk één onderdeel vorm. Community en Cursussen stellen de Headerindeling van die pagina’s in, samen met Headerinstellingen voor het gekozen ontwerp. Het tabblad Community slaat alleen op zolang Community aanstaat onder Instellingen > Functies, en het vraagt Communityinstellingen beheren in plaats van Platformvormgeving beheren. Videospeler regelt de Indeling bedieningsbalk, Afgerond voor de hoeken, de Achtergrond bediening en de Spelerextra’s voor elke video op je platform.