Een verzorgd ontwerp ziet er professioneler uit en klanten vertrouwen het meer. Deze gids laat zien hoe je in de Design Studio elementen op één lijn zet, gelijkmatig verdeelt, een rij of kolom netjes ordent en een enkel element spiegelt. Hij is bedoeld voor iedereen die een producttemplate bouwt of bewerkt en schone, doordachte plaatsing wil in plaats van op het oog te werken.
Elementen uitlijnen
Uitlijnen zet twee of meer elementen op één gedeelde rand of middenlijn. Kies uit zes opties: links uitlijnen, horizontaal centreren, rechts uitlijnen, boven uitlijnen, verticaal centreren of onder uitlijnen.
Je vindt de uitlijnbediening op drie plekken: het paneel Eigenschappen in de zijbalk, de keuzelijst Uitlijnen in de zwevende werkbalk boven het canvas en het rechtsklikmenu op het canvas. Ze doen allemaal hetzelfde, dus gebruik wat het dichtstbij is.
Selecteer twee of meer elementen
Klik op het eerste element. Klik daarna met Shift ingedrukt op elk ander element dat je erbij wilt. Je kunt ook een selectiekader over het canvas slepen om er meerdere tegelijk te pakken. Voor uitlijnen moeten minstens twee elementen zijn geselecteerd.
Open de uitlijnbediening
Zodra twee of meer elementen zijn geselecteerd, verschijnt de uitlijnbediening in het paneel Eigenschappen. Je vindt hem ook achter de keuzelijst Uitlijnen in de zwevende werkbalk en onder het rechtsklikmenu op het canvas.
Kies een rand of middenlijn
Kies links, rechts, boven of onder uitlijnen om de elementen aan die gedeelde rand vast te zetten. Kies horizontaal of verticaal centreren om ze op een gedeelde middenlijn te zetten. De elementen springen tegelijk op hun plek.
Verdelen en netjes ordenen
Verdelen spreidt elementen uit zodat de ruimte ertussen gelijk is. Dat is handig als je meerdere elementen ruwweg hebt geplaatst en nu schone, gelijke tussenruimte wilt.
Er zijn twee manieren om te verdelen:
- De tussenruimtes gelijk maken. Hiervoor zijn drie of meer elementen nodig. De buitenste twee blijven staan en alles ertussen wordt zo verdeeld dat elke tussenruimte gelijk is. In het rechtsklikmenu heten deze Horizontaal verdelen en Verticaal verdelen.
- Een exacte tussenruimte instellen. Klik op het pijltje naast een verdeelknop om de popover voor eigen tussenruimte te openen. Typ een afstand in pixels en de elementen komen op precies die afstand van elkaar te staan. Dit werkt met twee of meer elementen, dus je kunt het ook gebruiken als gelijk maken niet beschikbaar is.
Gelijkmatig verdelen
Selecteer drie of meer elementen en kies daarna horizontaal of verticaal verdelen. De tussenruimtes worden gelijk.
Of stel een eigen tussenruimte in
Klik op het pijltje naast een verdeelknop. Voer de exacte tussenruimte in pixels in die je wilt, en de elementen worden daarop afgestemd.
Orden een rij of kolom netjes
Selecteer de elementen en kies Netjes ordenen. Composerie leest je selectie als een rij of een kolom, maakt de tussenruimtes langs die hoofdas gelijk en centreert de elementen op de andere as. Zo ruim je een lijn van elementen met één klik op.
Om je hele selectie op het canvas te herplaatsen in het midden, gebruik je Centreren op pagina in het rechtsklikmenu. Dat centreert de selectie op het tekenvlak zonder de ruimte binnen de selectie te wijzigen.
Hulplijnen en spiegelen
Terwijl je een element over het canvas sleept, toont Composerie hulplijnen om je te helpen het te plaatsen. Je hoeft nergens op te klikken. De hulplijnen verschijnen vanzelf terwijl je beweegt.
Je ziet drie soorten hulplijnen:
- Violette randlijnen verschijnen wanneer een rand of midden op één lijn komt met een ander element. Laat los terwijl de lijn zichtbaar is, en het element springt op één lijn.
- Gestippelde tussenruimtelijnen met een pixelbadge tonen de afstand tussen elementen, zodat je tussenruimtes op het oog kunt aanpassen.
- Basislijnen helpen je tekst langs zijn typografische basislijn uit te lijnen.
Om een enkel element te spiegelen, klik je er op het canvas met de rechtermuisknop op en kies je Horizontaal spiegelen of Verticaal spiegelen. Dit spiegelt het element ter plekke. Spiegelen is beschikbaar voor één element dat geen tekst is, zoals een afbeelding of een vorm. Het verschijnt niet voor tekst of als er meer dan één element is geselecteerd.
Veelgestelde vragen
Waarom verschijnt de uitlijnbediening niet?
Voor uitlijnen zijn twee of meer elementen nodig. Selecteer een tweede element met Shift-klik, en de bediening verschijnt.
Waarom is verdelen grijs?
Het verdelen dat de tussenruimtes gelijk maakt, vraagt om drie of meer elementen. Gebruik bij twee geselecteerde elementen het pijltje om een exacte tussenruimte in te stellen.
Waar is de optie om te spiegelen gebleven?
Spiegelen verschijnt alleen voor één element dat geen tekst is. Het is verborgen voor tekst en voor selecties van meerdere elementen.
Veranderen uitlijnen en verdelen het ontwerp van een klant?
Nee. Deze hulpmiddelen ordenen elementen in je template. Ze vergrendelen niets voor shoppers. Wat klanten kunnen bewerken, stel je apart in.
Volgende stap
Staan je elementen waar je ze wilt hebben, ordenen en herschikken ze dan met het paneel Lagen.