Så här ställer du in stilen för din app

App style

”App style” styr hela appens design på ett ställe: färger, typsnitt, knappar, formulärfält med mera.

Klicka på ”App style” i menyn ”My App”.

Inställningarna har två delar: grunderna och sedan fler alternativ. Allt här gäller varje sektion och ersätter designen du ställt in sektion för sektion.

Färger

Börja med färgerna.

Ett färgtema är en uppsättning färger som passar bra ihop. Välj ett i biblioteket… så visar förhandsvisningen appen med det.

”Magic palette” föreslår ett nytt tema… vid varje klick.

Justera sedan varje färg i detalj: headern, huvudfärgerna, bakgrunderna, menyn och knapparna.

Klicka på en färg, ange en kod eller välj en och klicka sedan på Choose.

Headern får den nya färgen.

Med Apply används färgerna i hela appen, med Cancel behåller du dina nuvarande. Här behåller vi dem.

Typsnitt

Sedan typsnitten.

Ett typsnittstema kombinerar tre typsnitt som passar bra ihop. Du kan välja ett i den här listan.

Reglaget styr storleken på alla texter samtidigt och behåller deras hierarki.

Alla textnivåer växer tillsammans.

Din app använder åtta textnivåer, från huvudrubriken till normal text. Öppna en nivå för att byta dess typsnitt… och välj ett typsnitt. Alla Google Fonts finns tillgängliga, och plusknappen lägger till ett eget om licensen tillåter det.

Huvudrubriken får det nya typsnittet.

För varje nivå kan du också ställa in vikt, radavstånd och teckenavstånd.

Även här använder du typsnitten med Apply eller behåller dina med Cancel.

Knappar och formulärfält

Nu till knapparna.

Din app använder tre knappnivåer, som GoodBarber väljer för varje åtgärd: nivå ett är fylld, nivå två har en kontur och nivå tre är en enkel textlänk. Färgerna kommer från ditt färgtema.

Välj form: fyrkantig, avrundad eller rund… så får alla knappar i din app den.

”Form fields” fungerar på samma sätt: välj deras form, storlek och var titeln står, ovanför fältet eller inuti det.

Miniatyrer och celler

”Thumbnails and cells” bestämmer formen på bilderna och korten i dina listor: fyrkantig, avrundad eller rund.

Här blir hörnen raka.

I webbappen på dator kan du också lägga på en effekt när musen förs över en bild.

Avstånd

Med Spacing ställer du in marginalerna runt ditt innehåll, i pixlar.

Med bredare marginaler får innehållet mer utrymme runt sig.

Animationer och vibrationer

I native-apparna för iOS och Android kan du välja hur en sida öppnas från en lista, lägga till en lätt vibration vid tryck och låta element dyka upp vid scrollning.

Ikoner

I Icons väljer du appens standardikoner. Klicka till exempel på bokmärkesikonen… och välj en annan i biblioteket.

Den nya ikonen visas på varje artikel.

Bakgrund och avgränsare

Till sist appens bakgrund: en färg eller en bild, och färgen på avgränsarna.

Bakgrunden ändras på alla sidor.

Publicering

Publicera uppdateringen av din app från menyn Publish, så att dina användare ser ändringarna.