Dette dokumentet diskuterer tips og retningslinjer du bør følge når du skal merkevarebygge Canvas UI for en institusjon via temaredigereren.
Dette dokumentet er ment for administratorer som trenger å merkevarebygge Canvas-grensesnittet sitt ved hjelp av temaredigereren, og det går gjennom de ulike filopplastingene som er tilgjengelige i temaredigereren ved hjelp av en institusjons logo. Disse retningslinjene vil presentere den optimale størrelsen for hvert bilde i temaredigereren – sammen med noen nyttige detaljer om bildeoppretting – slik at du kan få Canvas-installasjonen din til å se fantastisk ut på kort tid.
Hvis institusjonen din er så heldig å ha et markedsførings- eller merkevarebyggingsteam med en fast ansatt grafiker eller webdesigner, anbefaler vi på det sterkeste at du samarbeider med vedkommende om merkevarebygging på Canvas. Du vil få gode resultater og måtte gjøre mindre arbeid – hurra! En designprofesjonell vil også sørge for at du ikke bryter noen av retningslinjene for merkevaren.
Malfilene i dette dokumentet ble opprettet i PhotoshopHvis du ikke har tilgang til Photoshop, kan du bruke et hvilket som helst bildeprogram til å lage dine egne filer basert på de ideelle bildestørrelsene som er inkludert i hvert trinn.
Vektor vs. punktgrafikk
Før du kan laste opp institusjonens logo, må du skaffe deg en kopi i høy oppløsning som du kan bruke i temaredigereren. Ideelt sett bør du bruke envektorlogobilde i stedet for etbitmaplogobilde.
- Vektorbilder slutter vanligvis på.ai,.eps, eller.svgFordi de er basert på stier, ikke piksler, kan vektorbilder endres skarpt til enhver størrelse. Vektorbilder kan dras eller limes inn i bilderedigeringsprogramvare som Illustrator, Photoshop og Sketch. De kan deretter endres i størrelse uten tap av skarphet. For å opprettholde sideforholdet, åpne bildet i et relevant program og hold nede Shift-tasten. For bruk i Temaredigereren må vektorfiler lagres i.svgformat.
- Bitmapbilder slutter vanligvis på.jpg,.png, eller.gifDe består av et bestemt antall piksler. Hvis du endrer størrelsen på dem (spesielt når de forstørres), ender de ofte opp med å se uskarpe ut.
Hvis det ikke er mulig å få tak i en vektorversjon av institusjonens logo, kan du prøve å få den største bitmap-versjonen som mulig – alt over 1000 piksler i bredden burde fungere helt fint. Den mest optimale bitmap-filtypen er en PNG-fil (.png), ettersom de er designet for nettet og beholder den beste kvaliteten. De kan også endre størrelse godt og støtter gjennomsiktige bakgrunner.
Bildeopplastinger
Når du har fått bildet ditt, kan du laste opp filen til forskjellige områder i temaredigereren.
Nav-logo
| Logo øverst i den globale navigasjonsmenyen (støtter svg-, png- og jpg-filer) Anbefalt størrelse:200 x 200 piksler Anbefalt fileksporttype:PNG Hete tips:
- Når du oppretter filen, la det være litt margin (minst 10–20 piksler) rundt logobildet. Ellers vil det se klemt ut mot sidene av hovednavigasjonen.
Last ned eksempelfilen for Nav-logoen Last ned Nav-logo Photoshop-mal |
|---|
Vannmerke
| Lyst bakgrunnsbilde som vises bak sideinnholdet; visningsstørrelsen er subjektiv basert på opplastet filstørrelse Anbefalt størrelse:400 x 400 piksler Anbefalt fileksporttype:PNG Hete tips:
- Akkurat som et vannmerke på skrivepapir, er vannmerkebildet vårt ment å være etsubtilmerkevareelement (vi anbefaler at bildet ditt ikke står i for stor kontrast til Canvas' hvite bakgrunn) som ofte dekkes av andre Canvas-elementer.
- Vannmerket er helt valgfritt. Ikke føl at du må bruke det hvis du ikke har tilgang til et bilde som passer.
Last ned eksempelfilen for vannmerke Last ned vannmerkemal for Photoshop |
|---|
Favicon
Ikon for mobil startskjerm
Vinduer Fliser Firkantet
| Bilde for den firkantede versjonen av Windows-flisen Nødvendig størrelse:558 x 558 piksler Anbefalt fileksporttype:PNG Gode tips: - For å virkelig passe inn i Windows 8-utseendet og -følelsen, lag bildet ditt i helhvitt og velg en livlig bakgrunnsfarge fra merkevareretningslinjene dine.
- Windows krever nøyaktige dimensjoner for et bilde som brukes som en Windows-flis. Bildet du laster opp for en Windows-flis må oppfylle de nøyaktige dimensjonene som er spesifisert.
Last ned eksempelfilen for Windows Tile Square Last ned Windows Tile Square Photoshop-mal |
|---|
Windows-fliser bredt
| Bilde for den brede versjonen av Windows-flisen Nødvendig størrelse:558 x 270 piksler Anbefalt fileksporttype:PNG Gode tips: - For å virkelig passe inn i Windows 8-utseendet og -følelsen, lag bildet ditt i helhvitt og velg en livlig bakgrunnsfarge fra merkevareretningslinjene dine.
- Windows krever nøyaktige dimensjoner for et bilde som brukes som en Windows-flis. Bildet du laster opp for en Windows-flis må oppfylle de nøyaktige dimensjonene som er spesifisert.
Last ned eksempelfilen for Windows Tile Wide Last ned Photoshop-mal for bred Windows-fliser |
|---|
Logo i høyre sidefelt
Bakgrunnsbilde
| Bilde for innloggingsbakgrunnen Anbefalt størrelse:2800 x 2000 piksler Anbefalt fileksporttype:JPG (30–40 % kvalitet på verk) Hete tips:
- Fullskjermsbakgrunnsbildet er helt valgfritt. Du foretrekker kanskje en enkel bakgrunnsfarge uten bilde (og det vil garantert ta kortere tid å laste).
- Hvis bildet ditt er mindre enn anbefalt størrelse, vil Canvas skalere det opp; det kan bare se litt pikselert ut.
Last ned eksempelfil for bakgrunnsbilde Last ned mal for bakgrunnsbilde i Photoshop |
|---|
Innloggingslogo
| Logoen vises øverst på innloggingssiden Anbefalt størrelse:380 x 150 piksler Anbefalt fileksporttype:PNG (SVG kan også brukes av avanserte brukere) Hete tips: - Logoen på innloggingssiden din vil bli endret til 190 piksler i bredden, uavhengig av størrelsen.
- Den ideelle størrelsen anbefales fortsatt for å opprettholde god bildeoppløsning for Retina- og/eller store skjermer. En mindre størrelse kan virke uskarp.
Last ned eksempelfilen for påloggingslogoen Last ned Photoshop-mal for påloggingslogo |
|---|
Denne ressursen kan også nås fra følgende Canvas-guider: