Kategoriarkiv: Design

Box-sizing är en räddare i nöden

Postat av
Svara

CSS har sin box model, som man behöver känna till för att verkligen få ihop responsiv desig. Ibland gå man på pumpen och då finns en räddare i nöden, Box sizing. Men det lilla css undret kan du på ett enkelt sätt ändra hur box model fungerar, och till exempel flytta på marginaler så att de istället placeras inne i boxen istället för utanför.

Tänk dig till exempel ett input-fält där du vill ha 4px padding inne i fältet men du vill kunna ha fältets totala bredd till 100% (för att flöda responsivt). Ett tänkbart sätt är att välja 2% padding och 96% bredd, vilket resulterar i att paddingen varierar mellan olika enheter vilket kan vara osnyggt. Men med box-sizing kan man enkelt vända på steken och lägga sin padding inne i boxen, och lungt kunna använda 100% för den totala bredden.

textarea, input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="search"] {
@include box-sizing;
padding: 4px;
width: 100%;
}

och en box-sizing mixin kan se ut på detta sätt.

/*
* Box-sizing
*
*
* Usage:
* @include box-sizing;
* @include box-sizing($type = "border");
*
* Acceptable values are border, content, and padding - content is the default W3C model
*
*/

@mixin box-sizing($type: border) {
box-sizing: #{$type}-box;
-webkit-box-sizing: #{$type}-box;
-moz-box-sizing: #{$type}-box;
}

Google rekommenderar responsive design

Postat av
Svara

På Googles blogg för utvecklare har man nu gått ut med en officiell rekommendation för hur man ska bygga sajter för mobiler. Artikeln med rubriken ”Why we recommend responsive design” berättar glädjande nog är det nu är responsivt som gäller. Man säger att en och samma url ska gälla till ett och samma innehåll, varken mer eller mindre.

Ganska givet kan tyckas men det har på senare tid förekommit en del prat om att man bör skala ner det mobila innehållet (Why Jakob Nielsen is wrong about mobile websites). Så: en url -> en sida -> ett och samma innehåll, Om Goggle får bestämma.

Poetfreak.com är top 15 av världens inspirerande sajter enligt .net Magazine

Postat av
Svara

För en tid sedan blev jag kontaktad av .net magazine som ville prata responsiv design. Jag trodde det var ett skämt, tidningen är baserad i england och världen bäst säljande magasin för designers och webbutvecklare. Vad vill de mig?

Nu visar det sig dock att det inte var ett skämt. Mitt projekt Poetfreak har blivit utvald till en av väldens mest insprirerande responsiva sajter, wow! I deras artikel 15 fabulous responsive sites for your inspiration visas sajten vid sidan av storheter som till exempel Sony och Smashing Magazine.

.net skriver följande, vilket känns riktigt bra och inspirerande! Glad och stolt är bara förnamnet.

Made up of two core views – a list of poems, and a detailed view containing the creation, plus any comments or related writings – on both mobile and desktop, the site maintains a calm air of simplicity. On the iPhone, you sometimes get a strong feeling of Readability or Safari’s Reader function, minimalising the on-screen content in an effective way.

Bygger WordPress full frontend-editering?

Postat av
3

Snart släpps WordPress 3.4 och det är en version som har lagt fokus på att göra det enklare och bättre att arbeta med teman. Kanske känns det inte så värst hett men jag kan inte låta bli att undra var man har planerat för de kommande versionerna?

Är det helt enkelt så att man siktar på att flytta all redigering och hantering av innehåll till frontend?

Se på dumpen från 3.4 beta 2. Detta är en ny vy där man kan ändra på några grundläggande saker på sin wp-sajt i realtid. Du ser sajten och ändrar direkt på sidan, smidigt. Varför skulle det stanna vid att man kan ändra bakgrundsfärg och titlel?

Tänk dig att man framöver lägger till editering av poster och pages i samma skal. Och tänk dig att vi som utvecklare kan plugga in egen funktionalitet i detta skal som man även den kan editera direkt från frontend.

Visst känns det som att teamet bakom WordPress ruvar på något nytt och bra i ver 3.4.

LESS för WordPress

Status

Svara

Dynamisk CSS (LESS) är riktigt intressant. För visst har även du velat kunna sätta variabler i ett stylesheet, för att sedan använda rakt igenom och därmed bara få ett ställa att ändra på. Det finns flea olika sätt att implementera Less på i WordPress. Artikeln ”How to implement LESS in WordPress, first approach” beskriver hur man gör det ”för hand”, men man kan även använda en färdig plugin, till exempel denna, Less.js for WordPress.

Prata mindre, koda mer – bygg prototyper

Postat av
Svara

Många webbprojekt har väldigt många möten, planering och workshops. Vi webb-folk verkar nämligen tro att saker som design, strategier och funktioner måste vara specade och klubbade innan man drar igång kodandet. Orsaken till det kan vara att vi tror att mängder tid kommer slösas bort på felutvecklade saker, om vi inte vet exakt vad som ska göras före vi drar igång. Vi kunde inte ha mer fel.

Utveckling, kodande och design är sammanflätat i en kreativ process så det går helt enkelt inte att dela in dessa i separerade arbetsuppgifter. Det ena ger input till det andra och tillsammans skapas insikter som annars skulle vara omöjliga att upptäcka.

Tänk dig en krukmakare som sätter sig med en platt klump lera, krukmakaren har givetvis en bild av vad som ska göras men insikter längs med arbetet förändrar förutsättningarna och påverkar slutresultatet. Just denna lerklumps speciella egenskaper eller möjligheter skapar helt nya lösningar. Exakt samma sak gäller för webutveckling så; starta alltid era projekt med att bygga en halvtaskig prototyp, förbättra den efterhand eller släng och starta om. Ta bort några möten och ersätt de med kodande, så ska du se att slutresultatet träffar ännu bättre.

Vill du veta mer om prototyper så finns det utmärkt läsning här.

Det räcker inte med bra UX, designa för känslor

Postat av
Svara

Jag har just läst Designing for emotion av Aaron Walter. En underbart bra bok som alla borde ha i sin Ipad. Aaron menar att det inte räcker med att vara bra på klassisk UX för att bygga bra applikationer. Man måste även ha en tydlig emotionell nivå i det man gör, man måste tilltala emotionellt.

Det räcker alltså inte med att knappar och fält ligger på rätt ställen på en webbsida, det måste vara en ren njutning att använda dem. Anledningen är att nu när alla vet hur man gör en bra struktur, en fungerande navigation och ett väl testat gränssnitt, ja då väljer vi människor utifrån känslor, magkänsla.

Enligt Walter behöver en applikation uppfylla fyra lager (påminner om Maslow behovspyramid) för att bli framgångsrik. Först och främst behöver man erbjuda funktioner som täcker användarnas behov. Sedan måste applikationen vara tillförlitlig, den måste fungera utan att krångla. Därefter behövs ett användbart gränssnitt, så man kan använda funktionerna (här kommer klassisk UX och IA). Men ovanpå allt detta måste man dessutom vara tillfredställande, det måste helt enkelt vara en ren och skär fröjd att använda en webbsajt.

Tänk dig om din internetbank inte bara vore lätt att använda, tillförlitlig och att den erbjöd rätt funktionalitet. Utan att den dessutom faktiskt var roligt att trivsam, att jag blev smått glad av att logga in och flytta pengar.

Det är först då folk kommer välja just din webbsajt framför konkurrenternas. Man måste helt enkelt träffa en nerv hos användarna som skapar ett osynligt band mellan er, det måste vara kärlek.

Hur gör man då det? Ett exempel som tas upp i boken är fotosajten Flickr. Det finns många fotosajter där ute men Flickers framgång bygger på att det upplevs trevligt och roligt att dela bilder där. Det handlar om flera olika saker men den lite roliga copyn är en. Det personliga anslaget och den ganska lekfulla välkomsthälsningen på olika språk är exempel på det.

Mailchimp är ett annat exempel där sajtens maskot (en apa) sprider en skön feelgood-känsla till helheten. Hos Mailchimp har man märkt att det finns en relation mellan att ha en feelgood-känsla på sajten och antalet inkommande mail till deras kundservice. Man klagar helt enkelt inte lika mycket om man verkligen trivs. Lite som att man kanske inte klarar på en granne (i sitt trapphus) som man verkligen tycker bra om.

Det handlar också om rena designfrågor, om att ha bra kontrast eller att ha en vacker balans på sin sajt. Studier har visat att om man erbjuder ett vackert och rent gränssnitt så höjer det känslan av att sajten är lätt att använda. En tilltalande knapp är alltså lättare att använda än en ganska ful dito.

Aaron lämnar ett ganska konkret tips, att det kan vara bra att skapa en persona för sin webbsajt. Helt enkelt att försöka ge den en egen personlighet. Att försöka att ge sin egen sajt en tydlig personlighet kan vara ett vinnande koncept, förutsatt att personligheten är något som folk har lätt att tycka bra om.

Gott folk, läs den!

Design på en timme: Barometern.se och balans

Postat av
1

Så, här kommer ännu en re-design på en timme. Denna gång är det Småländska Barometern jag har jobbat på. Jag har försökt få till en balans på sidan en harmoni. Inte helt sällan är nyhets-sajten osannolikt röriga (tex. Aftonbladet.se) vilket gör dem svåra att snabbt scanna sidans innehåll. Varför kan inte en nyhets-sajt få vara vacker och tilltalande?

Sajten är indelar i tre större block. Överst en klassisk nyhetsdel i tre spalter, svart på vitt med feta rubriker. Därefter följer en yta med lite mer långsamt material. Här finns en mer sober form och tanken är att här finns sajtens magasin, texter som kanske ligger en vecka. Vi växlar helt enkelt tempo.

Sist ligger ett block med tjänster som är lokalt knutna, till exempel nyfödda och händelser i en kalender. Det är också här jag tänker mig att försäljning av saker sker, böcker, tjänster, plusmedlemskap, appar osv. Så, grädden är nyheterna, moset är affären.

IE6 lever och frodas – i Kina

Postat av
Svara

Vi är många som tycker illa om ie6 (browsern). Den är inte bara gammal, den gör också livet helt vansinnigt trist för webbutvecklare som vill följa standarder. Oavsett hur rätt man kodar så blir det fel. Detta inser numera även Microsoft som för ett tag sedan försökte ge ie6 en sista dödsstöt via sajten ie6countdown.com och bloggposten Bye bye ie6. Man har lyckats ganska bra och under 1% av internetanvändarna i USA kör nu ie6, siffran för Sverige är under 0.5%.

Men (det finns alltid ett men), jobbar man på ett företag som har användare i Kina ser bilden helt annorlunda ut. Hela 25% av Kinas internetanvändare kör ie6 och det ser inte ut att sjunka lika snabbt i resten av världen. Kina har dessutom flest uppkopplade internetanvändare i världen så föreställningen om att ie6 är död stämmer helt enkelt inte. I alla fall inte om man utvecklar för en global marknad.

Vad beror det på? Säkert flera olika orsaker, bland annat använder många Kineser fortfarande Windows XP och på dessa system finns ie6 förinstallerat. Det sägs dessutom att kring 90% av installationerna är piratkopior och därmed inte helt triviala att uppgradera.

Ytterligare en orsak till ie6-kärleken sägs vara att många av de stora Kinesiska bankerna har anpassat sina system helt efter ie6 och dess activeX-komponenter. Det är alltså inte möjligt att använda flera av de Kinesiska internetbanker med en modern browser. I alla fall inte i dagsläget.

Så vad gör man då? Som siffrorna ser ut just nu måste man helt enkelt anpassa sin sajt till ie6 eller helt enkelt bygga två olika versioner. Trist men ett faktum. Säkert kommer detta förändras (bland annat då win7 tar fart i Kina) men ie6 kommer leva och frodas ytterligare ett tag till, hur usel och utdaterad den än må vara.

Välj rätt strategi för sidhuvudet – testa dig fram och förfina

Postat av
2

Sidhuvuden och navigation på sajter är intressanta saker. En navigation ska till exempel ge användaren insikt i vad som faktiskt finns på sajten och den ska samtidigt vara lätt att använda. Navigationens innehåll ska dessutom ligga i linje med varumärket och dessutom vara logisk och strukturerad på ett sätt som känns naturligt.

Inte så sällan uppstår konflikter mellan de olika behoven. En sajtägare vill kanske använda en nytänkande navigation men användarna vill egentligen bara hitta det man letar efter. Intressanta avvägningar är vad som väntar för designen och hur kan man angripa det?

Man bör (som alltid) ha en klar bild över vad man själv vill åstadkomma och vad användarna faktiskt vill göra, samt i vilka situationer de kommer att göra så. Man bör även veta vad man förmedlar genom att välja olika sidhuvuden, och vad man inte förmedlar då man väljer sin strategi.

Ett bra sätt att snabbt skissa upp vitt åtskilda sidhuvuden och sedan fundera på vad som egentligen kommuniceras och hur det står upp mot vad man vill åstadkomma. Dvs, förutom att sidhuvudet är ”snyggt”, hur bra löser det användarens behov och hur bra förmedlare det min egen ide. Utifrån detta kan man sedan välja ett eller kanske två sidhuvuden för att förfina och köra tester.

För att illustrera har jag gjort fyra väldigt ruffa varianter av Dn.se, alla med olika tänk, som möter användare med olika behov och som löser uppgiften på olika sätt.

# Minimalt
Sticky sidhuvud som följer med då användaren scrollar. Skapar mycket plats och levererar de mest grundläggande (utvalda) sektionerna. Missar vid en snabb överblick helt att kommunicera sajtens bredd. Eftersom många sektioner saknas krävs istället tydliga visuella ingångar till resten av innehållet på själva sidan, eller kanske i en mer omfattande sidfot. Ställer alltså stora krav på resten av sidans utformning. Facebook använder minimalt sidhuvud med framgång och allt man behöver finns alltid inom räckhåll.

# Sökoptimerat
Stor central sökruta som fungerar som huvudnavigering. Söket kanske inte bara ger en vanlig träffsida utan leder vidare till de olika avdelningarna (sök på Zlatan visar direkt förslag på sektionen sport/fotboll osv.). Tydligt och enkelt för användare med vara av att googla, dessutom ganska enkelt att anpassa till tablet och mobilt. Gör det fullkomligt omöjligt att puffa lite hårdare för händelser under kortare perioder (tex. Lägga fotbolls-VM i en meny) utan överlämnar allt till användaren. Avslöjar vid en första anblick absolut ingenting av sajtens omfattning. Twitter använder väldigt sökoptimerat sidhuvud trots att de med enkelhet skulle kunna visa en fyllig meny baserat på deras #-taggar. Det bygger dessutom känslan av att Twitter är döenkelt, på alla sätt.

# Visa bredd
Här finns i princip alla sektioner med. Detta tar mycket plats men ger en tydlig bild av sajtens innehåll. Den stora mängden ingångar kan uppfattas som rörig och kan eventuellt leda till menyblindhet. I just detta läge befinner sig många med argumentet ”syns man inte i menyn så finns man inte”. Kan stå helt för sig självt. Många dagstidningar använder framgångsrikt denna modell där man vill betona sin bredd och sitt digra och fullteckande innehåll som signalerear att här finns något för alla.

# Visa djup
Ger extremt snabb tillgång till exakt allt men kan samtidigt ge problem att använda (bli fullkomligt oanvändbart) på ipad och mobiler som har problem men att hovra menyn. Kräver en väldigt väl genomtänkt gruppering av innehållet för att alls fungera. Amazon.com är glada i lager och man gör det på ett bra sätt. Enkelt vid en första anblick, och djupt för den som önskar.

Som sagt, skissa snabbt och rufft ut ditt sidhuvud utifrån olika behov och situationer, testa på användarna, förfina och välj ett tydligt spår. Att försöka möta alla behov i en och samma lösning brukar vara svårt. Du kommer tvingar välja bort saker, se bara till att välja bort rätt.

UX persona – designa utifrån situation istället

Postat av
1

Begreppet personas är väl känt och vida använt i ux-världen. En persona är en fiktiv användare som är baserad på kunskap man fått genom bland annat undersökningar. Man försöker illustrera ett typisk användare och göra denna levande. Därefter gäller det att designa för denna användare. Och lyckas man med det så har man gjort en träffsäker applikation, perfekt.

Exempel på persona: Detta är Carl, har är 27 år och jobbar på konsum. Har lever ett lugnt liv och uppskattar ordning och reda. På helgerna bjuder Carl in till middagar där han lagar all man själv. Han kan i god tid planera sina helger och han sparar alla sina recept för framtiden. Carl lever ensam i en liten lägenhet och har två katter.

En persona beskrivs alltså gärna målande med text och väldigt gärna med en bild, allt för att göra den typiska användaren så levande som möjligt. Det finns fler tankar kring persona men detta är själva kärnan.

Så, nu ska vi designa en receptapp till Carl (vi har helt säkert fler personas också), vad säger detta mig? Carl vill kunna beräkna antalet portioner för han har ofta stora middagar? Carl vill ha tydliga instruktioner till alla sina recept för han lagar all mat själv? Carl har god tid på sig, så han vill ha detaljerade instruktioner?

Och där tror jag vi missade målet…

Vad händer om vår Carl står i affären och har glömt sitt recept hemma. Eller vad händer om Carl är sjuk och snabbt vill slänga ihop mat till bara sig själ. Då ser vår användares behov ut på olika sätt. Hur bra fungerar vår receptapp då?

Det är helt enkelt väldigt svårt att överföra Carls liv och livssituation till vad vår app faktiskt behöver kunna. Det är vad Carl gör, och i vilken situation han befinner sig i som avgör behoven. Det är alltså situationen som styr de verkliga behoven, inte personan.

Så, prova att överge persona ett tag och designa för typiska situationer användarna befinner sig i, och se vad det tillför din applikation.

Designa för bra beslut – inte bara för action

Postat av
Svara

Traditionellt har UX pratat mycket om att designa för ”actions”, dvs användarnas handling. Exempel på det kan vara att skapa en meny som är enkel att orientera sig i eller en sådan grundläggande sak som att göra länkar tydliga och lätta att följa. I en intressant artikel skriven av Colleen Roller beskrivs ”Designing for Decision-Making” som istället handlar om att designa för att optimera och stödja användarnas väg till ett beslut.

Vem har inte varit på en e-handelssajt och försökt välja mellan två olika produkter. Vilken skillnad är det? Vilken är bäst för mig? E-handlaren vill att jag ska lägga en vara i kundvagnen men först måste ett beslut till. Varje ”action” från användare gör föregås således av ett beslut. Därmed blir det givetvis viktigt att man designar för beslutsfattande.

Så hur gör man det? Colleen Roller menar att det mest grundläggande sättet att ta beslut på grundas i att jämföra. Erbjuder man två eller flera alternativ kan användaren enkelt skapa sig en bild av vad som är bäst för denna och därmed ta ett beslut. Visuellt bör man till exempel tydligt visa de olika alternativen vid sidan av varandra, eller i en tabell. Så användaren snabbt kan avgöra vad som ger denna störst värde. Sammantaget handlar det om att:

  • Erbjuda en referenspunkt så folk enkelt kan värdera
  • Erbjud en sida fri från brus som då blir enkel att scanna och värdera
  • Erbjud rätt information i rätt tid på rätt plats, allt för att underlätta värdering
  • Ta bort alt trams (som stör processen att värdera och besluta)

Läs den utmärkta artikeln i sin helhet hos uxmag.com.

Ett mail från strokedrabbade poeten Jon, och ny version av Poetfreak.com

Postat av
Svara

I veckan lanserade jag en uppdaterad version av poetfreak.com. Förutom arbetet i ramverket så har strukturen och designen förändrats. En förändring som denna gör man sällan (eller aldrig) helt perfekt och heller inte utan kritik, så inte heller nu. Men denna gång var det på ett ovanligt sätt.

Efter ett tag kom nämligen ett långt och varmt mail från ett barnbarn till den på Poetfreak mycket uppskattade poeten Jon. Jon hade tidigare i år varit med om en bilolycka och därefter drabbats av stroke. Hans minne var inte lika fungerande som tidigare och Jon hade fått svårt att memorera skriven text. Däremot fungerade han bättre om det fanns bilder intill text, för då kunde hans hjärna associera bilderna till texten.

På den tidigare versionen av Poetfreak fanns alltid bilder vid namnen på poeterna. Dessa bilder tog jag bort i ett försök att förenkla formen (utan vetskap om Jons problem). Jag ville ha renare rader och jag ville dessutom att man inte skulle kunna skapa uppmärksamhet genom bilden. Min hypotes var att det skulle bli ett tydligare fokus på texterna om bilderna försvann.

Tyvärr gjorde detta att hela sajten blev oanvändbar för Jon, han kunde inte längre orientera sig och koppla samman personer med texter. Jons hjärna behövde bilderna för att klara det och jag förbisåg helt och hållet behovet av den visuella kopplingen mellan en text och en bild, för att man via den snabbt kan associera till en poet, vilket är viktigt då textminnet sviker.

Givetvis är bilderna tillbaka på sajten nu och jag är en insikt rikare. Det är viktigt att designa för alla, men det är minst sagt svårt.

Redesign på en timme – Aftonbladet.se

Postat av
1

Aftonbladet ska redesignas nu i höst och jag vill ju inte vara sämre än att jag gör detsamma (om än i miniformat) och resultatet ser ni nedan. Tydligare fokus på nyheter, inloggning på en mer  naturlig plats, Sportbladet får tydligare egen plast och navigationen är rensad ner till några få huvudalternativ. (det saknas flera element och detta ska ses som en skiss/mock, och ingen annat!)

Responsiv design förändrar designprocesen – och dödar det pixelperfekta

Postat av
Svara

Responsiv design är en självklar och viktig del då man vill designa för flera plattformar. Själva tekniken är numera väl beskriven i en uppsjö av artiklar de senaste åren, men hur själva designprocessen påverkas är ganska outforskat. Exakt det borrar Stephanie Rieger djupare i  på ett ypperligt sätt i denna serie slides.

Det här är intressant för det handlar om hur vi arbetar med utveckling för att få fram ett så bra slutresultat som möjligt. Det traditionella sättet med spec, photoshop-skiss, koda html, implementera för att se och det ser ut exakt som skissen kanske inte är helt optimalt längre. Luke W har gjort en ypperlig sammanfattning, som i princip går ut på detta och jag sammanfattar ungefär såhär.

  • Att utgå ifrån pixenperfekta .psd-filer gör det omöjligt att tänka responsivt, tvärtom så låser det formatet och tänket
  • Designprocessen flyttas från skisser till att man gör html nästan direkt, därefter jobbar man i korta iterationer mellan mockups och ny html
  • Du kan inte få med allt överallt, räkna med att element försvinner och rör på sig i flertalet enheter (pixelperfekt fungerar alltså inte)
  • Man behöver riktigt innehåll direkt, för att kunna testa hur det uppför sig
  • Beställare och team måste förstå att sajten kommer att se olika ut på olika plattformar
  • Test blir komplext och mer omfattande
  • Då det pixelperfekta försvinner blir funktioner, interaktion och helhetsupplevelsen viktigare, det är helheten som avgör om du lyckas bra, inte pixlar
  • Stor risk för att teamet gör mängder av specialare för olika plattformar, så för att förvaltningen riskerar att bli väldigt komplex
  • Kunden är van vid att man kan kontrollera allt (pixelperfekt) så utbilda kunden!

Det ser ut som om design och frontkodaren behöver närma sig varandra. Designers behöver kunna html och css samt leverera mockups snarare än .psd. Fronkodaren behöver bli bredare och behöver kunna ta egna designbeslut då mockuperna inte är perfekta och skapas löpande under projektets gång. Alla behöver vara bättre på att förstå vad som levererar en bra helhetsupplevelse av en webbapp.

Bostonglobe.com gör betalvägg, jag gillar!

Postat av
Svara

För en tid sedan bestämde sig Boston Globe för att bygga två sajter, en skulle vara fri (Boston.com) och den andra skulle vara en betalsajt. Nu har betalsajten kommit och man kan inte göra annat än att tycka bra om den (kolla här).

Ska man ta betalt för en sajt, så måste den leverera mer än vad andra gör. Man måste bli blåst av stolen, lite som första gången man såg en iPod (om någon kommer ihåg den dagen). Man måste känna att oavsett vad det kostar så är detta en grej för mig. Och givetvis måste man leverera ett bra innehåll.

Många har gjort avancerade och smarta upplägg och flöden för vem som ska bli erbjuden vad och i vilket skede. Lika många har investerat miljoner på betallösningar, på integration med inloggning, serverparker och servrar. Men få har gjort sin designläxa!

Här har vi nu en sajt som levererar en skön känsla, en sajt som trivs lika bra på alla plattformar, en sajt som är grymt snabb att ladda och en sajt som vilar vackert i min browser, och det är betydelsefullt.

För mig, och för många andra styrs ett köp av psykologi. I valet mellan två produkter som är likvärdiga handlar det om känsla och lite sån känsla får jag inför Bostonglobe.

Det här känns fantastiskt bra, det känns inte son en snikversion och inte som en vanlig sajt, wrappad med betalvägg. Det är fruktansvärt välgjort och trevlig upplevelse man levererar och vem vill inte vila i den miljön till morgonkaffet!

Vackert!

Luke vs Jakob Nielsen, mobile first eller?

Postat av
Svara

Jag gillar Luke Wroblewski och hans argument för att designa för Mobile First. Jag har skrivit om det tidigare men i korta drag handlar det om att man bör starta ett designarbete med utgångspunkt i en mobilskärm.

Det lilla formatet gör att man automatiskt tvingas skala bort allt utom det absolut viktigaste, vilket leder till en med fokucerad slutprodukt. Då den är klar kan man skala upp till tablet och sedan vidare till desktop. Luke publicerade detta redan 2009 och har sedan dess föreläst i ämnet, och ganska snart släpper han en Mobile-first-bok.

Många gillar iden och Luke har varit hyggligt oemotsagd. Men så händer det…. Användbarhets-guden Jakob Nielsen kastar lite nytt fokus på iden via ett inlägg på din blog kallat Transmedia Design for the 3 Screens (Make That 5), där han väldigt tydligt ger Luke svar på tal (typ, Luke har fel och jag har rätt).

Some even recommend designing websites for mobile first, and then modifying the design for the desktop PC as an afterthought. I disagree.

Nielsens menar att desktop fortfarande är ledande och att ”PCs Will Remain Important”. Därför bör man designa för desktop först. Han menar att även om mobilen som plattform ökar så är den långt ifrån så pass ledande att man helt bör lämna det tidigare design-tänket.

Det är inte heller så att ”det nya kommer ta död på det gamla” (har vi hört den förut). Ja ni förstår, och därpå följer den obligatoriska Twitterdebatten där Luke försvarar sig och andra försvarar Luke (Nielsen finns inte på twitter).

Oavsett detta så är det obligatorisk läsning av båda dessa underbart smarta design-människor!
Transmedia Design for the 3 Screens (Make That 5) (Jakob Nielsen)
Mobile First (Luke Wroblewski)