Browsing Tag

formgivning

personligt, politik

Nya banners för Piratpartiet

Jag gjorde några banners för användning på mina webbplatser och tänkte att andra kanske skulle kunna ha nytta av dem också. Ganska många av oss piratpartister bloggar eller driver andra webbprojekt. Vi har ju därför stora möjligheter att påminna våra besökare om Piratpartiet som ett alternativ i valet till EU-parlamentet.

Givetvis får du använda bilderna hur du vill. Klistra in kodsnuttarna nedan för att länka direkt till bilderna eller ladda upp dem på din egen server.

De lila bilderna ser bra ut även i IE6 (alfatransparent png8) medan de svarta bör undvikas om du har många besökare med IE6 (png32).

Koden klistrar du säkrast in precis efter <body> eller innan </body>.

Piratpartiet

<a style="position: absolute; top: 0px; right: 0px; z-index: 9999;" href="http://www.piratpartiet.se">
<img style="border:none;" title="Piratpartiet till EU-parlamentet 7 juni" src="http://mediascreen.se/lab/pirate/banners/piratpartiet_black_right.png" alt="Piratpartiet" />
</a>

Piratpartiet

<a style="position: absolute; top: 0px; right: 0px; z-index: 9999;" href="http://www.piratpartiet.se">
<img style="border:none;" title="Piratpartiet till EU-parlamentet 7 juni" src="http://mediascreen.se/lab/pirate/banners/piratpartiet_black_left.png" alt="Piratpartiet" />
</a>

Piratpartiet

<a style="position: absolute; top: 0px; right: 0px; z-index: 9999;" href="http://www.piratpartiet.se">
<img style="border:none;" title="Piratpartiet till EU-parlamentet 7 juni" src="http://mediascreen.se/lab/pirate/banners/piratpartiet_purple_right.png" alt="Piratpartiet" />
</a>

Piratpartiet

<a style="position: absolute; top: 0px; right: 0px; z-index: 9999;" href="http://www.piratpartiet.se">
<img style="border:none;" title="Piratpartiet till EU-parlamentet 7 juni" src="http://mediascreen.se/lab/pirate/banners/piratpartiet_purple_left.png" alt="Piratpartiet" />
</a>
webbutveckling

De 10 bästa färgverktygen på nätet

Förra veckan tipsade jag om några program för att ta fram färgpaletter. Idag tänkte jag gå igenom några av alla de färgrelaterade gratistjänster som finns på nätet. De flesta av dem har olika syften eller funktion, men gemensamt för dem alla är att de kan användas i framtagningen av färgpaletter för webben.

  1. Kuler – Adobes verktyg/community för att skapa och dela färgpaletter. Utvecklad som en demonstration av möjligheterna med Flash. Kräver Flash Player 9, men fungerar riktigt smidigt trots ett ganska komplicerat gränssnitt. Registrerade användare kan spara paletter.
  2. Colour lovers – Möjlighet att skapa palett från en bild eller manuellt. Ger förslag på matchande/liknande färger men har ingen möjlighet att ange hur matchningen ska göras. Registrerade användare kan spara och dela paletter.
  3. colr.org – Genererar paletter från bilder eller andra webbplatser. Har flera olika slumpfunktioner och registrerade användare kan spara paletter.
  4. ColorJack – Ser bedrägligt enkel ut men har massor av funktioner. Kan generera paletter enligt alla vanliga formler plus några till. Dessutom slumpgenerator och anpassning till olika varianter av färgblindhet.
  5. Color Schemer Online – Enklare variant av desktopprogrammet från samma företag. Rakt på sak utan några utmärkande funktioner.
  6. Color palette creator – Skapar tio olika nyanser mellan vitt och svart, av den valda färgen. Bra att ha när man redan bestämt sig för en huvudfärg.
  7. Color Blender – Skapar valfritt antal nyanser mellan två olika färger.
  8. Color Fields Colr Pickr – Intressant liten sida som hämtar olika foton från flickr beroende på vald färg.
  9. Colour Contrast Check – Mäter kontrastskillnaden mellan två färger och anger om kontrasten är tillräcklig för att uppfylla W3C riktlinjer för tillgängliga webbplatser.
  10. Color Vision – Visar hur färgpaletten upplevs av människor med olika typer av färgblindhet.

Utanför min topplista hamnar de resterande 27 webbapplikationer som jag prövat. Själv tycker jag att de är ganska överflödiga, men eftersom alla kanske inte har samma smak eller behov som jag har så kommer de här: Technicolor, Colormixers, EasyRGB, Unsafe Colormatch, Color Wheel, 4096 Color Wheel, Colour Schemes, Infohound Color Schemer, Palette Man, nColor, Color Wheel, Peter Pipers Palette Picker, ChromoFlash, Color SynthAxis, Munsell Palette, Color Tool, Color Scheme Generator 2, Colour Scheme Chooser, Color Palette Generator, DeGreave Color Palette Generator, I Like Your Colors, Color Blender, ColorToy 2, ColorMatch Remix, Genopal Online och till sist Color Calculator. Puh!

webbutveckling

9 program för att hitta rätt färger

För oss som inte föddes med färgkänsla så finns det numera en rad hjälpmedel som kan göra vårt liv lättare. Det finns gott om verktyg som föreslår färgpaletter baserade på en utgångsfärg. En annan typ av verktyg hjälper oss samla inspiration från andras färgval. Slutligen så finns det webbplatser som samlar och katalogiserar färdiga färgscheman som kan användas direkt eller modifieras efter tycke och smak.

Idag tänkte jag titta lite på vilka program för att skapa färgscheman som finns för desktopbruk:

  • Genopal – Ett av de mer avancerade programmen. Färgpaletterna som skapas har en medveten dragning åt toner som upplevs som mer naturliga. Med pipettverktyg, färdiga paletter och flera exportmöjligheter. Finns för både Mac och PC och kostar 25 dollar.
  • Color Schemer Studio – Kan skapa färgscheman från fotografier, har en praktisk utskriftsfunktion samt massor med import- och exportmöjligheter. Bland annat kan man importera färgscheman från webbplatser eller css-filer. Finns för både Mac och PC och kostar 50 dollar.
  • ColorImpact 3 – Ett kompetent verktyg som har de vanligaste funktionerna. Stöd för flera olika paletter, konfigurerbart gränssnitt och import-/exportfunktioner samt utskrivningsbara färgkartor. Finns till PC för 50 dollar.
  • Color Wheel Pro – Ett enklare program som saknar flera av konkurrenternas funktioner. Verkar dessutom vara kalibrerat för att skapa ganska grälla färgpaletter. Finns till PC för 40 dollar.
  • Coloristic – Ett enkelt litet pipettverktyg med förstoring. Till PC eller Mac för 12 dollar.
  • ColorPic – Ett pipettverktyg med möjlighet att spara olika paletter, val av samplingsstorlek och förstoring. Finns till PC och är gratis.
  • Pixie – Enket litet pipettverktyg på bara 8kb. Gratis till PC.
  • ColorWrite – Enkelt program för att skapa färgscheman. Verkar inte ha uppdaterats sedan 2003 men är gratis och finns till PC.
  • ColorZilla – En extension till Firefox med inbyggt pipettverktyg. Fungerar bara i själva webbläsarfönstret. Gratis men kräver Mozilla Firefox.

Av de uppräknade programmen så står de tre förstnämnda i en klass för sig. Genopal och Color Schemer Studio har dessutom båda funktionalitet som saknas hos konkurrenterna. Med tanke på detta så är det svårt att motivera köp av något av de andra programmen. För de som inte kräver ett fullfjädrat palettverktyg så är gratisprogrammen ColorPic och ColorZilla vettiga alternativ.

Uppdatering:

Upptäckte att jag missat (åtminstone) två program:

  • Painter Picker – Verkar lovande. Skapar många olika typer av paletter och har några smidiga funktioner för att blanda färger och få förslag på de vanligaste matchande färgerna. Finns bara till Mac och kostar 16 dollar.
  • Color Consultant Pro – Ganska typiskt palettverktyg. Utmärker sig genom att alla beräkningar som används för att ta fram färgscheman åskådliggörs på ett tydligt sätt. Bara till Mac. Kostar 30 dollar.
webbutveckling

Två olika inblickar i designprocessen

Få saker är lika inspirerande som att få en inblick i hela processen bakom ett färdigt arbete. Att få se vad som valdes bort och varför, vilka avvägningar som gjordes och vilka metoder som användes. Titta in hos design och varumärkesbyrån Plaid som skriver om sin remake av allt från visitkort till telefonsvararmeddelande (via Speak up) eller hos Veerle som skriver om designprocessen bakom sitt företags nya grafiska profil.

webbutveckling

Web Typography Sucks

Nu är inspelningarna från SXSW upplagda och jag har precis lyssnat igenom Mark Boultons och Richard Rutters föredrag om typografi på webben. Hela inspelningen är på 60 minuter varav den sista tredjedelen är i formen av fråga/svar.

Föreläsningen går igenom en rad typografiska frågor utan något inbördes sammanhang:

  • Korrekt användning av speciatecken som citattecken (“ och ”, inte ”), talstreck (—, inte -) och multiplikationstecken (×, inte x eller *).
  • Möjligheten att anpassa visningen av specialtecken genom att innesluta dem i span-elementet och ange särskilda typsnitt där de ser bättre ut.
  • Hur man skapar ett vertikalt flyt genom att anpassa vertikala marginaler efter typsnittsstorleken.
  • Traditionell formatering av listor (med ordningstalen hängande ute i vänstermarginalen).
  • Hur ett gridsystem kan skapas genom att utgå från ett typografiskt grundmått (som 1 em) samt det gyllene snittet (egentligen approximationen 2:3.
  • Varför de flesta standardgrupper av typsnitt för att ange font-family i css är fel och hur man gör bättre val.

Helt klart värt att lyssna på även om jag tycker att de börjar med detaljer och först i mitten kommer in på mer centrala frågor. Eftersom det bara finns ljudupptagning så underlättar det att ta en titt på presentationsmaterialet som finns på en separat sida tillsammans med en del vidareläsning.

Jag har redan börja fundera på vilka typografiska förändringar jag ska göra här på bloggen…