Hoppa till innehåll

Verktyg för förhandsvisning av Garmin-urtavla

Designa och förhandsvisa en rund urtavla med tid, datum, steg och puls. Välj mörka färgscheman, kontrollera WCAG-kontrasten för läsbarhet och ladda ner designen som en PNG-fil.

Förhandsvisning av Garmin-urtavla

Designa en rund urtavla i affärsstil och se den uppdateras när du ändrar den. Välj ett mörkt färgschema, ställ in exempelvärden, kontrollera kontrasten och ladda ner resultatet som en PNG-fil.

MON 2110:098,432STEG62PULS
Färgförval
Elementfärger
Exempelvärden

Kontrast mot bakgrunden

Tid
18.9:1
Datum
7.3:1
Steg
9.8:1
Puls
6.9:1

Ett förhållande på 3:1 är minimikravet för stor text och 4.5:1 för mindre text, enligt WCAG 2.1. Ju högre värde, desto lättare att läsa i solljus.

Laddningsberäknare...
📚

Dokumentation

Det här verktyget visar en förhandsvisning av en rund urtavla i webbläsaren. Det ritar en layout i affärsstil med tid, datum, stegräkning och puls, och låter varje element få en ny färg. Förhandsvisningen uppdateras när färgerna ändras, och den färdiga designen kan laddas ner som en PNG-bild.

Det är bara en designförhandsvisning. Verktyget kopplar inte till en klocka och skapar ingen installerbar urtavla.

Vad förhandsvisningen visar

Urtavlan använder den layout som de flesta runda urtavlor har:

  • datumet högst upp
  • tiden stort i mitten
  • stegräkningen och pulsen sida vid sida under
  • en infattning med timstreck runt kanten

Exempelvärdena kan ändras så att designen bedöms med realistiska siffror. Ett fyrsiffrigt stegtal tar mer plats än ett tvåsiffrigt, och en 12-timmarsklocka lägger till en markering för förmiddag eller eftermiddag.

Varför mörka färgscheman

De flesta runda Garmin-klockor har en memory-in-pixel-skärm eller en OLED-skärm. På en OLED-skärm drar en mörk bakgrund mindre ström, eftersom svarta pixlar helt enkelt stängs av. Mörka urtavlor är också lättare att läsa i starkt solljus, där en ljus bakgrund reflekterar och bländar.

Förvalen här är alla mörka av den anledningen. En ljus bakgrund kan ändå väljas, och verktyget påpekar då att det avviker från vanlig praxis.

Kontrast och läsbarhet

En klocka läses av i förbifarten, ofta i dåligt ljus eller i rörelse, så kontrasten spelar större roll än på en telefon. Verktyget mäter kontrastförhållandet mellan varje element och bakgrunden med formeln från WCAG 2.1.

Förhållandet jämför den relativa luminansen hos två färger:

contrast = (L1 + 0.05) ÷ (L2 + 0.05)

L1 är den ljusare luminansen och L2 den mörkare. Resultatet går från 1:1, vilket betyder identiska färger, till 21:1 för svart på vitt.

Två gränsvärden är bra att känna till:

  • 3:1 är miniminivån för stor text
  • 4.5:1 är miniminivån för normalstor text

Tiden visas stort, så 3:1 räcker i teorin för den, men ett högre värde är bättre utomhus. De mindre etiketterna vinner på 4.5:1 eller mer.

Exempel

Ta en bakgrund i #0b1020, en mycket mörk marinblå, med vit text i #ffffff. Kontrasten är ungefär 18:1, vilket är bekvämt i allt ljus.

Ändra stegfärgen till #2a3a5e, en blå ton nära bakgrunden, och förhållandet sjunker till ungefär 1.6:1. Siffran blir då nästan osynlig på armlängds avstånd, och verktyget flaggar för det.

Ladda ner designen

Nedladdningsknappen gör om den levande förhandsvisningen till en PNG-bild på 320 gånger 320 pixlar. Bilden skapas i webbläsaren, ingenting laddas upp. Filen kan användas som en skiss, delas för att få respons, eller sparas som referens medan den riktiga urtavlan byggs i Garmins Connect IQ-verktyg.

Vanliga frågor

Skapar det här en urtavla jag kan installera?

Nej. Verktyget tar fram en bild av en design. Att bygga en installerbar urtavla kräver Garmins Connect IQ SDK eller Garmin Watch Face Builder.

Varför är förhandsvisningen fyrkantig när klockan är rund?

Bilden är en fyrkantig kanvas med en rund urtavla ritad inuti, vilket är det vanliga sättet att skapa grafik för urtavlor. Hörnen syns helt enkelt inte på klockan.

Vilken storlek ska en riktig urtavla ha?

Det beror på modellen. Vanliga runda Garmin-skärmar är 240 gånger 240, 260 gånger 260 och 416 gånger 416 pixlar. Förhandsvisningen använder 320 gånger 320 som ett mellanläge.

Varför ser min färg annorlunda ut på klockan?

Klockskärmar skiljer sig i ljusstyrka och färgåtergivning, och memory-in-pixel-skärmar visar en begränsad palett. Använd förhandsvisningen som en guide och kontrollera sedan den riktiga skärmen.

Vad betyder kontrastsiffrorna?

De är förhållanden från tillgänglighetsstandarden WCAG 2.1, samma mått som används för webbplatser. Högre siffror är lättare att läsa.