Välkommen till Piratpartiets grafiska manual. Detta är ej stenhårda regler utan är tänkt som ett stöd för när man gör saker med Piratpartiet som avsändare.

= Officiell logotyp =
=====Stående logga=====
{| class="wikitable" style="background: #e0dede;"
| [[File:Standard stående medsvarttext.svg|350px|frameless]]
| [[File:Standard_stående_medvittext.svg|350px|frameless]]
| [[File:Serpentin_stående_medsvarttext.svg|350px|frameless]]
|}

=====Liggande logga=====
{| class="wikitable" style="background: #e0dede;"
| [[File:Standard_liggande_medsvarttext.svg|350px|frameless]]
| [[File:Standard_liggande_medvittext.svg|350px|frameless|style="background-color: #512483;"]]
| [[File:Serpentin_liggande_medsvarttext.svg|350px|frameless]]
|}

= Logotypens uppbyggnad =
Logotypen får även användas utan text till, samt i olika PP-färger.

=====Stående logga=====
[[File:Uppbyggnad1.jpg|500px|frameless]]

=====Liggande logga=====
[[File:Uppbyggnad2.jpg|500px|frameless]]

= Logotypens användning =
=====Regioner/föreningar=====
{| class="wikitable" style="background: #e0dede; width: 900px;"
|[[File:Regioner.jpg|500px|frameless]]
|Piratpartiet behöver inte vara utskrivet vid logotypen om sammanhanget gör det tydligt att det är Piratpartiet. Exempel: en Facebooksida där sidans namn redan anger ”Piratpartiet Västra Götaland”, el.dyl.
|}

=====Webbadress, osv.=====
{| class="wikitable" style="background: #e0dede; width: 900px;"
|[[File:Webbadresser.jpg|500px|frameless]]
|Ska helst alltid vara i det stående formatet och alltid Lato Bold i gemener.
|}

= Färger =
Färgerna får även användas i procentad form.
{| class="wikitable"
!colspan="13"|Färgkoder
|-
|
|Webb
|Tryck (CMYK)
|-
|
|-
|Lila – primärfärg
|#512483
|85-100-0-0
| style="width: 30%; background-color: #512483;"|
|-
|
|-
|Orange – sekundärfärg
|#f28903
|50-10-100-0
| style="width: 30%; background-color: #f28903;"|
|-
|
|-
|Gul
|#eabd00
|0-20-100-10
| style="width: 30%; background-color: #eabd00;"|
|-
|
|-
|Grön
|#95b420
|0-55-100-0
| style="width: 30%; background-color: #95b420;"|
|-
|
|-
|Rosa
|#d82e8a
|10-90-0-0
| style="width: 30%; background-color: #d82e8a;"|
|-
|
|-
|Röd
|#cf242c
|15-95-85-0
| style="width: 30%; background-color: #cf242c;"|
|-
|
|-
|Blå
|#00a6d0
|90-0-15-0
| style="width: 30%; background-color: #00a6d0;"|
|-
|
|-
|Mörkblå
|#005c9f
|100-60-10-0
| style="width: 30%; background-color: #005c9f;"|
|-
|
|-
|Turkos
|#00a09b
|79-12-44-0
| style="width: 30%; background-color: #00a09b;"|
|-
|}

= Kombination logotyp och färger =
{| class="wikitable" style="background: #e0dede;"
| [[File:Lila_segel.svg|150px|frameless]]
| [[File:Orange_segel.svg|150px|frameless]]
| [[File:Gult_segel.svg|150px|frameless]]
| [[File:Grönt_segel.svg|150px|frameless]]
| [[File:Rosa_segel.svg|150px|frameless]]
|-
| [[File:Rött_segel.svg|150px|frameless]]
| [[File:Ljusblått_segel.svg|150px|frameless]]
| [[File:Mörkblått_segel.svg|150px|frameless]]
| [[File:Turkost_segel.svg|150px|frameless]]
| [[File:Vitt_segel.svg|150px|frameless]]
|}

= Typsnitt =
[[File:Lato.jpg|thumb|right|Lato]]
Vi använder primärt fonten LATO i fyra skärningar (inom parentes Google Fonts): Light/Light Italic (300), Regular/Italic (400), Bold/Bold Italic (700) och Black/Black Italic (900). Gärna i kombination med varandra (se avsnitt Formgivning). Det finns fler skärningar av fonten – exempelvis LATO HAIRLINE. Den kan användas för trycksaker, men fungerar inte bra för skärmbilder online osv.
* Ladda ner till dator från [http://www.latofonts.com www.latofonts.com]
* [http://www.google.com/fonts/specimen/Lato Google fonts], för webb.

= Formgivning =

{| class="wikitable" style="background: #e0dede; width: 900px;"
|-
| [[File:Liggande.jpg|300px|frameless]]
|
* Dela in sidan i en grid: 14 rutor på bredden och 20 på höjden.
* Den liggande loggan placeras alltid i vänsterkant, vid lite mer konventionella layouter, ska den ta 1 ruta på höjden.
* Den stående loggan kan placeras i alla hörn, vid lite mer konventionella layouter ska den ta 2 rutor på höjden.
| [[File:Stående.jpg|300px|frameless]]
|-
| [[File:Form1.jpg|300px|frameless|]]
|
* På affischer, flyers osv, kan den stående loggan placeras fritt inom marginalerna.
* Båda loggovarianterna kan ändras till den storlek som passar till bild och layout.
* 1 rutas marginal runt om.
* Ska materialet skrivas ut på skrivare, lägg en halv rutas vit kant runt om.
* Tänk på att bild och text ska kunna kombineras. Bilder med många detaljer = kort text. Längre texter kräver fria ytor på fotografiet. Du kan hitta fria bilder på [http://stocksnap.io stocksnap.io] bland annat.
| [[File:Form2.jpg|300px|frameless|]]
|-
|}

= Ikoner och illustrationer =
[[File:Raket.jpg|60px|frameless|right]]
Ibland kan man behöva använda sig av ikoner eller illustrationer. För det ändamålet rekommenderas [http://fortawesome.github.io/Font-Awesome Font Awsome]. Används med fördel tillsammans med vårt typsnitt och våra färger.

= Remix av logotyp =
Remixa (gärna) logotypen och gör roliga saker med den. Använd dock typsnitt och färger som angivet i manualen när det handlar om officiella budskap från partiet eller föreningen. Originalutseendet på loggan får även användas och kombineras fritt.

=====Exempel på partianknuten avsändare – mix av gammalt och nytt=====
[[File:Remix1.jpg|500px|frameless]]

=====Exempel på helt fri remix=====
[[File:Remix2.jpg|500px|frameless]]

===== Den gamla loggan - liggande =====

Den här loggan får användas för remix och utveckling.

{| class="wikitable"
!Bild
!Syfte
!|Filer
|-
|| [[File:logga_text.enfärg_svart.preview.PNG|enfärg_svart.preview.PNG]] ||Enfärg för vit/ljus bakgrund ||[[Media:logga_text.enfärg_svart.svg|SVG]] [[Media:logga_text.enfärg_svart.pdf|PDF]] [[Media:logga_text.enfärg_svart.png|PNG]] [[Media:logga_text.enfärg_svart.jpg|JPEG]]
|-
|| [[File:logga_text.tvåfärg_svart.preview.png|tvåfärg_svart.preview.png]] ||Tvåfärg för ljus bakgrund ||[[Media:logga_text.tvåfärg_svart.svg|SVG]] [[Media:logga_text.tvåfärg_svart.pdf|PDF]] [[Media:logga_text.tvåfärg_svart.png|PNG]] [[Media:logga_text.tvåfärg_svart.jpg|JPEG]]
|}

===== Den gamla loggan stående =====

{| class="wikitable"
!Bild
!Syfte
!|Filer
|-
|| [[File:under_enfärg_svart.preview.png|enfärg_svart.preview.png]] ||Enfärg för vit/ljus bakgrund ||[[Media:under_enfärg_svart.svg|SVG]] [[Media:under_enfärg_svart.pdf|PDF]] [[Media:under_enfärg_svart.png|PNG]] [[Media:under_enfärg_svart.jpg|JPEG]]
|-
|| [[File:under_tvåfärg_svart.preview.png|tvåfärg_svart.preview.png]] ||Tvåfärg för ljus bakgrund ||[[Media:under_tvåfärg_svart.svg|SVG]] [[Media:under_tvåfärg_svart.pdf|PDF]] [[Media:under_tvåfärg_svart.png|PNG]] [[Media:under_tvåfärg_svart.jpg|JPEG]]
|}

= Länkresurser =
PDF – Grafisk manual som pdf

=====Typsnitt=====
* [http://www.latofonts.com%20www.latofonts.com Lato] – vårt officiella typsnitt
* [http://www.google.com/fonts/specimen/Lato Google fonts] Lato på webbsidor
* [http://fortawesome.github.io/Font-Awesome Font Awsome] – fri ikonfont för webb och illustrationer

=====Logotyper för nedladdning=====
* adress för alla logotyperna kommer – samtliga loggor i ett paket, eps 4-färg för tryck.
* adress för grundloggan kommer – den primära loggan (stående och liggande), eps 4-färg för tryck.

=====Fria bilder=====
* [http://stocksnap.io stocksnap.io] Snygga högupplösta bilder som får användas fritt
* [http://www.freepik.com/popular-vectors www.freepik.com/popular-vectors] Fria vectorbaserade illustrationer
* [http://compfight.com Flickr] (för att hitta CC-bilder på Flickr)
* [http://www.flickr.com/search/advance www.flickr.com/search/advance] (ställ in CC när du söker)
* [http://bildbank.piratpartiet.se/main.php bildbank.piratpartiet.se/main.php] (PPs bildbank)
* [http://commons.wikimedia.org commons.wikimedia.org] (såklart)
* [http://search.creativecommons.org search.creativecommons.org] (portal för CC-bildsidor)
* [http://www.google.com www.google.com] bildsök – ställ in användarrättigheter för att hitta fria bilder

=====Tips=====
* [http://www.skills2tech.com/2015/01/social-media-images-size-guide-2015.html Guider för format i sociala medier]
* [http://freepsdfiles.net Fria psd-filer]
* [http://www.jamendo.com/en Fri musik], för exempelvis film
* [http://www.easypdfcloud.com Kombinera och konvertera pdf-filer]
* [http://freesound.org Fria ljudeffekter]

=====Inspiration=====
* Pirate Party Australia (posters, social media materials)
* Confederación Pirata (posters, memes, ads, logos)
* Pirate Party UK (posters, flyers, images etc.)
* Pirate Party of Slovenia (flyers, posters etc.)

File:Webbadresser.jpg

2015-10-09T17:24:40Z

Emma: Emma uploaded a new version of "File:Webbadresser.jpg"

2015-10-09T16:46:17Z

Emma: /* Officiell logotyp */

Välkommen till Piratpartiets grafiska manual. Detta är ej stenhårda regler utan är tänkt som ett stöd för när man gör saker med Piratpartiet som avsändare.

= Officiell logotyp =
=====Stående logga=====
{| class="wikitable" style="background: #e0dede;"
| [[File:Standard stående medsvarttext.svg|350px|frameless]]
| [[File:Standard_stående_medvittext.svg|350px|frameless]]
| [[File:Serpentin_stående_medsvarttext.svg|350px|frameless]]
|}

=====Liggande logga=====
{| class="wikitable" style="background: #e0dede;"
| [[File:Standard_liggande_medsvarttext.svg|350px|frameless]]
| [[File:Standard_liggande_medvittext.svg|350px|frameless|style="background-color: #512483;"]]
| [[File:Serpentin_liggande_medsvarttext.svg|350px|frameless]]
|}

= Logotypens uppbyggnad =
Logotypen får även användas utan text till, samt i olika PP-färger.

=====Stående logga=====
[[File:Uppbyggnad1.jpg|500px|frameless]]

=====Liggande logga=====
[[File:Uppbyggnad2.jpg|500px|frameless]]

= Logotypens användning =
=====Regioner/föreningar=====
{| class="wikitable"
|[[File:Regioner.jpg|500px|frameless]]
|Piratpartiet behöver inte vara utskrivet vid logotypen om sammanhanget gör det tydligt att det är Piratpartiet. Exempel: en Facebooksida där sidans namn redan anger ”Piratpartiet Västra Götaland”, el.dyl.
|}

=====Webbadress, osv.=====
{| class="wikitable"
|[[File:Webbadresser.jpg|500px|frameless]]
|Ska helst alltid vara i det stående formatet och alltid Lato Bold i gemener.
|}

= Färger =
Färgerna får även användas i procentad form.
{| class="wikitable"
!colspan="13"|Färgkoder
|-
|
|Webb
|Tryck (CMYK)
|-
|
|-
|Lila – primärfärg
|#512483
|85-100-0-0
| style="width: 30%; background-color: #512483;"|
|-
|
|-
|Orange – sekundärfärg
|#f28903
|50-10-100-0
| style="width: 30%; background-color: #f28903;"|
|-
|
|-
|Gul
|#eabd00
|0-20-100-10
| style="width: 30%; background-color: #eabd00;"|
|-
|
|-
|Grön
|#95b420
|0-55-100-0
| style="width: 30%; background-color: #95b420;"|
|-
|
|-
|Rosa
|#d82e8a
|10-90-0-0
| style="width: 30%; background-color: #d82e8a;"|
|-
|
|-
|Röd
|#cf242c
|15-95-85-0
| style="width: 30%; background-color: #cf242c;"|
|-
|
|-
|Blå
|#00a6d0
|90-0-15-0
| style="width: 30%; background-color: #00a6d0;"|
|-
|
|-
|Mörkblå
|#005c9f
|100-60-10-0
| style="width: 30%; background-color: #005c9f;"|
|-
|
|-
|Turkos
|#00a09b
|79-12-44-0
| style="width: 30%; background-color: #00a09b;"|
|-
|}

= Kombination logotyp och färger =
{| class="wikitable"
| [[File:Lila_segel.svg|100px|frameless]]
| [[File:Orange_segel.svg|100px|frameless]]
| [[File:Gult_segel.svg|100px|frameless]]
| [[File:Grönt_segel.svg|100px|frameless]]
| [[File:Rosa_segel.svg|100px|frameless]]
|-
| [[File:Rött_segel.svg|100px|frameless]]
| [[File:Ljusblått_segel.svg|100px|frameless]]
| [[File:Mörkblått_segel.svg|100px|frameless]]
| [[File:Turkost_segel.svg|100px|frameless]]
| [[File:Vitt_segel.svg|100px|frameless|style="background-color: #512483;"]]
|}

= Typsnitt =
[[File:Lato.jpg|thumb|right|Lato]]
Vi använder primärt fonten LATO i fyra skärningar (inom parentes Google Fonts): Light/Light Italic (300), Regular/Italic (400), Bold/Bold Italic (700) och Black/Black Italic (900). Gärna i kombination med varandra (se avsnitt Formgivning). Det finns fler skärningar av fonten – exempelvis LATO HAIRLINE. Den kan användas för trycksaker, men fungerar inte bra för skärmbilder online osv.
* Ladda ner till dator från [http://www.latofonts.com www.latofonts.com]
* [http://www.google.com/fonts/specimen/Lato Google fonts], för webb.

= Formgivning =
Dela in sidan i en grid: 14 rutor på bredden och 20 på höjden.

{| class="wikitable"
|-
| [[File:Liggande.jpg|300px|frameless]]
| Den liggande loggan placeras alltid i vänsterkant, vid lite mer konventionella layouter, ska den ta 1 ruta på höjden.
| [[File:Stående.jpg|300px|frameless]]
| Den stående loggan kan placeras i alla hörn, vid lite mer konventionella layouter ska den ta 2 rutor på höjden.
|-
| [[File:Form1.jpg|300px|frameless|]]
| På affischer, flyers osv, kan den stående loggan placeras fritt inom marginalerna. Båda loggovarianterna kan ändras till den storlek som passar till bild och layout.
| [[File:Form2.jpg|300px|frameless|]]
| 1 rutas marginal runt om. Ska materialet skrivas ut på skrivare, lägg en halv rutas vit kant runt om.
|-
|}

Tänk på att bild och text ska kunna kombineras. Bilder med många detaljer = kort text. Längre texter kräver fria ytor på fotografiet. Du kan hitta fria bilder på [http://stocksnap.io stocksnap.io] bland annat.

= Ikoner och illustrationer =
[[File:Raket.jpg|60px|frameless|right]]
Ibland kan man behöva använda sig av ikoner eller illustrationer. För det ändamålet rekommenderas [http://fortawesome.github.io/Font-Awesome Font Awsome]. Används med fördel tillsammans med vårt typsnitt och våra färger.

= Remix av logotyp =
Remixa (gärna) logotypen och gör roliga saker med den. Använd dock typsnitt och färger som angivet i manualen när det handlar om officiella budskap från partiet eller föreningen. Originalutseendet på loggan får även användas och kombineras fritt.

=====Exempel på partianknuten avsändare – mix av gammalt och nytt=====
[[File:Remix1.jpg|500px|frameless]]

=====Exempel på helt fri remix=====
[[File:Remix2.jpg|500px|frameless]]

===== Den gamla loggan - liggande =====

Den här loggan får användas för remix och utveckling.

{| class="wikitable"
!Bild
!Syfte
!|Filer
|-
|| [[File:logga_text.enfärg_svart.preview.PNG|enfärg_svart.preview.PNG]] ||Enfärg för vit/ljus bakgrund ||[[Media:logga_text.enfärg_svart.svg|SVG]] [[Media:logga_text.enfärg_svart.pdf|PDF]] [[Media:logga_text.enfärg_svart.png|PNG]] [[Media:logga_text.enfärg_svart.jpg|JPEG]]
|-
|| [[File:logga_text.tvåfärg_svart.preview.png|tvåfärg_svart.preview.png]] ||Tvåfärg för ljus bakgrund ||[[Media:logga_text.tvåfärg_svart.svg|SVG]] [[Media:logga_text.tvåfärg_svart.pdf|PDF]] [[Media:logga_text.tvåfärg_svart.png|PNG]] [[Media:logga_text.tvåfärg_svart.jpg|JPEG]]
|}

===== Den gamla loggan stående =====

{| class="wikitable"
!Bild
!Syfte
!|Filer
|-
|| [[File:under_enfärg_svart.preview.png|enfärg_svart.preview.png]] ||Enfärg för vit/ljus bakgrund ||[[Media:under_enfärg_svart.svg|SVG]] [[Media:under_enfärg_svart.pdf|PDF]] [[Media:under_enfärg_svart.png|PNG]] [[Media:under_enfärg_svart.jpg|JPEG]]
|-
|| [[File:under_tvåfärg_svart.preview.png|tvåfärg_svart.preview.png]] ||Tvåfärg för ljus bakgrund ||[[Media:under_tvåfärg_svart.svg|SVG]] [[Media:under_tvåfärg_svart.pdf|PDF]] [[Media:under_tvåfärg_svart.png|PNG]] [[Media:under_tvåfärg_svart.jpg|JPEG]]
|}

= Länkresurser =
PDF – Grafisk manual som pdf

=====Typsnitt=====
* [http://www.latofonts.com%20www.latofonts.com Lato] – vårt officiella typsnitt
* [http://www.google.com/fonts/specimen/Lato Google fonts] Lato på webbsidor
* [http://fortawesome.github.io/Font-Awesome Font Awsome] – fri ikonfont för webb och illustrationer

=====Logotyper för nedladdning=====
* adressförallalogotyperna – samtliga loggor i ett paket, eps 4-färg för tryck.
* adressförgrundloggan – den primära loggan (stående och liggande), eps 4-färg för tryck.

=====Fria bilder=====
* [http://stocksnap.io stocksnap.io] Snygga högupplösta bilder som får användas fritt
* [http://www.freepik.com/popular-vectors www.freepik.com/popular-vectors] Fria vectorbaserade illustrationer
* [http://compfight.com Flickr] (för att hitta CC-bilder på Flickr)
* [http://www.flickr.com/search/advance www.flickr.com/search/advance] (ställ in CC när du söker)
* [http://bildbank.piratpartiet.se/main.php bildbank.piratpartiet.se/main.php] (PPs bildbank)
* [http://commons.wikimedia.org commons.wikimedia.org] (såklart)
* [http://search.creativecommons.org search.creativecommons.org] (portal för CC-bildsidor)
* [http://www.google.com www.google.com] bildsök – ställ in användarrättigheter för att hitta fria bilder

=====Tips=====
* [http://www.skills2tech.com/2015/01/social-media-images-size-guide-2015.html Guider för format i sociala medier]
* [http://freepsdfiles.net Fria psd-filer]
* [http://www.jamendo.com/en Fri musik], för exempelvis film
* [http://www.easypdfcloud.com Kombinera och konvertera pdf-filer]
* [http://freesound.org Fria ljudeffekter]

=====Inspiration=====
* Pirate Party Australia (posters, social media materials)
* Confederación Pirata (posters, memes, ads, logos)
* Pirate Party UK (posters, flyers, images etc.)
* Pirate Party of Slovenia (flyers, posters etc.)