Nieuw in Bloom: Box shadow

30 mrt 2018

Tim Menting: Projectmanger & Klantsucces

Tim Menting

Projectmanger Bloom

Een van de grotere veranderingen binnen Bloom (V1.2.0) is dat je nu de mogelijkheid hebt om een Box Shadow toe te voegen. Door box shadows te gebruiken kun je een extra dimensie toevoegen aan je pagina’s.
De box shadows kun je heel gemakkelijk en visueel toevoegen aan elke sectie, rij en module.
Je hebt de keuze uit een aantal standaard varianten die je door middel van 1 klik kunt toevoegen aan je sectie, rij of module.
Maar mocht je zelf al je creativiteit willen laten gaan, dan kun je de standaard opties volledig aanpassen naar eigen ontwerp.

Bekijk onderstaande video voor meer informatie:

Wat is een box shadow?

Een box shadow is een schaduwrand om een stuk content. Hiermee kun je bepaalde stukken extra de pagina uit laten springen. Om deze rij zit een schaduwrand, dit kan nu binnen Bloom dus overal aan toegevoegd worden.
Deze schaduwrand kan variëren in kleur, positie, dikte en sterkte. Er zijn ontzettend veel mogelijkheden en je kunt met een schaduwrand prachtige pagina’s maken.

Gemakkelijk in gebruik

schadowranden maken binnen bloom

Hoe maak je gebruik van box shadows?

Zoals ik al vertelde kun je de nieuwe box shadow functie heel erg gemakkelijk gebruiken. In Bloom kun je in elke sectie, rij en module kiezen uit 7 verschillende standaard varianten. Elk van deze variatie kun je naar eigen smaak aanpassen.

De box shadow kun je altijd op dezelfde plek toevoegen en aanpassen. Je vindt alle opties in de instellingen van de sectie, rij of module. Kies dus eerst waaraan je de schaduwrand wilt toevoegen en klik op het tandwiel icoon. Ga vervolgens naar het tabblad “Ontwerp” en scroll naar beneden tot je “Box Shadow” ziet staan.
Zodra je deze open klikt verschijnen de 7 standaard opties. Onder deze opties heb je de mogelijkheid om de schaduwrand volledig aan te passen.
De volgende zaken kun je allemaal aanpassen:

  • horizontale positie
  • verticale positie
  • wazigheid
  • spreidsterkte
  • kleur
  • binnen of buiten schaduw

Voorbeelden van mogelijkheden

Wat voor moois kun je nu creëren?

Al met al kun je dus behoorlijk wat aanpassen aan de standaard schaduw opties binnen Bloom.
Maar je kunt zonder dat je de standaard opties aanpast kun je al prachtige pagina’s maken waar stukken er echt uit springen!

Zie hieronder een aantal voorbeelden:

In het voorbeeld hierboven zie je een aantal van de verschillende box shadows die je kunt gebruiken.
In de bovenste grijze sectie zit een schaduw om de gehele sectie. Dit soort ervoor dat de titel van de pagina echt los staat van de content die eronder staat. Ook springt deze er echt uit en door het effect lijkt het alsof ‘bovenop’ de pagina ligt.

Ook in deze sectie zit een schaduw. In dit voorbeeld zit de schaduw echter aan de binnenkant, wat ervoor zorgt dat de sectie onder de rest lijkt te liggen. Ook is er om de oproep tot actie een schaduw toegevoegd. Hierdoor valt deze wel heel erg op, maar hoef je niet gebruik te maken van verschillende achtergrondkleuren. Daardoor blijft de pagina rustig, maar zorg je er wel voor dat het juiste opvalt!

Elke module kun je natuurlijk een schaduw geven, zoals in het voorbeeld hierboven mooi terugkomt. De schaduw kun je ook een andere kleur geven. Door hier mee te spelen kun je de meest belangrijke dingen meer laten opvallen dan de rest.

In Bloom V1.2.0 zijn onder andere de volgende functies toegevoegd:

Animaties
Box shadow
Mega tekst update
Tekst schaduw
Uitgebreidere rand design mogelijkheden
Filters
Sectie verdelers

Klik op een link om naar het artikel te gaan.

Wil jij ook een website waarbij je zelf, heel gemakkelijk, visueel je website kunt opmaken?

En dat zonder moeilijk met code te hoeven doen? Ga dan snel aan de slag!