Träff #11 • Ingresser , Webbtypografi • Tor 16 mars • vt 23 • UX Writing

Transcript

1. Jonas Söderström • 2023 Ingresser Typografi Trä ff #11 • Torsdag16 mars Jonas Söderström • Vt 23 • UX Writing • Nackademin
2. Jonas Söderström • 2023 Idag Lite repetition Liten rubrikuppgift Ingresser UX-bonus: Webbtypogra fi
3. Jonas Söderström • 2022 Repetition • Skriv rubriker så läsarna vet vad de kan hoppa över. • Se till att få med nyckelord som tydliggör området. • Försök visa ”vad ger det mig” i rubriken. • Var mer misstänksam mot korta rubriker än mot långa. • Använd verb i rubrikerna. • Använd gärna tilltal - ”du”, ”vi”, ”din” . • Inledningarna ”Så”, ”Då”, ”Därför”, ”Här” … är e ff ektiva.
4. Jonas Söderström • 2023 Lockande? Du kan inte ana vad som hände sen
5. Jonas Söderström • 2023 Men vad ger det mig???
6. Jonas Söderström • 2023
7. Jonas Söderström • 2023 Lägg viktiga ord i främre delen av meningen! (Frontloading)
8. Jonas Söderström • 2023
9. Jonas Söderström • 2023 Hundratals växter har förbättrat skolans inomhusmiljö Krisberedskapsveckan ska få fl er Timråbor att re fl ektera över hur man kan lösa vardagen vid kris Har du ett hjälpmedel du inte använder? Årets barnrättsutmärkelse Elefanten till Barnrättsombuden i Västernorrland UPPGIFT: SKRIV NYA RUBRIKER MED MAX 30 
 TECKEN!
10. Jonas Söderström • 2023 Hundratals växter har förbättrat skolans inomhusmiljö Krisberedskapsveckan ska få fl er Timråbor att re fl ektera över hur man kan lösa vardagen vid kris Har du ett hjälpmedel du inte använder? Årets barnrättsutmärkelse Elefanten till Barnrättsombuden i Västernorrland Målgrupp: 
 Timrå-bor
11. Jonas Söderström • 2023 Max 30 tecken! Till exempel De fi ck Elefantenpriset 2023 (28 tkn) 
 Timrå kommun prisad (19 tkn) 
 Elefanten till Timrå bibliotek (30 tkn) Så kan du lösa vardagskrisen (28 tkn) 
 Så ska Timrå möta kriser (24) 
 Lös vardagen vid kris och krig Växter ger bättre skolmiljö (27) 
 Växter hjälpte skolans klimat (29) 
 Bättre skolmiljö med gröna rum (30) Slutat använda ett hjälpmedel? (30) 
 Lämna tillbaka hjälpmedel här (29) 
 Några oanvända hjälpmedel? ( (Elefant) (Kris) (Skolmiljö) (Hjälpmedel)
12. Jonas Söderström • 2022 Gör gärna rubriker långa, om det behövs … Ok, det var korta rubriker. Men:
13. Jonas Söderström • 2023 … men skriv korta inledningar! Gör tröskeln in i texten så låg som möjligt! Få och korta meningar! 
 Inga bisatser! 
 Enkla och korta ord!
14. Jonas Söderström • 2023 Mest lästa artikel (feb 2007) 60.000 tecken = 12 sidor Eat food. Not too much. Mostly plants. Sju ord. Tre meningar. Sex bokstäver.
15. Jonas Söderström • 2022 Det skulle kunna ha varit….. Frågan om vilken diet som är den nyttigaste har diskuterats under många år av läkare, fysiologer, närimngsforskare. Olika experter har haft olika syn på saken, och otaliga förslag till dieter har avlöst varandra. Vissa har hållit fram medelhavsdieten, medan andra förespråkat en stenålders- diet … bla bla bla Men, i själva verket …
16. Jonas Söderström • 2023 Jag har gråtit. Ja, jag har bölat som Jag har gråtit. Ja, jag har bölat som ett barn. Längsta ord: 6 bokstäver.
17. Jonas Söderström • 2023 Jag har gråtit. Ja, jag har bölat som ett barn. Jag har traskat varv efter varv runt lägenheten som en rastlös hund. För det fi nns ingenting annat att göra. 3 7 12 7 Median ordlängd = 4 bokstäver
18. Jonas Söderström • 2023 Kom ihåg: • Gör tröskeln in i texten så låg som möjligt • Enkla ord. • Korta meningar. • Ta med det viktigaste. • Starta inte ”djupt” (”Redan de gamla grekerna…”). • Starta inte ”mjukt” – 
 allmänna fraser kring ämnet.
19. Jonas Söderström • 2023 Starta inte ”mjukt”
20. Jonas Söderström • 2022 Det skulle kunna ha varit….. Frågan om vilken diet som är den nyttigaste har diskuterats under många år av läkare, fysiologer, närimngsforskare. Olika experter har haft olika syn på saken, och otaliga förslag till dieter har avlöst varandra. Vissa har hållit fram medelhavsdieten, medan andra förespråkat en stenålders- diet … bla bla bla Men, i själva verket …
21. Jonas Söderström • 2023 NYT
22. Jonas Söderström • 2023 NYT
23. Jonas Söderström • 2022 Starta inte ”mjukt” Varför använda en köksplanerare? Att bygga ett nytt kök är en stor dröm för många, men det kan vara en utmaning att hitta ett kök som passar din stil och dina behov. Med en köksplanerare blir det enklare för dig att skapa drömköket precis som du vill ha det. Elgiganten > Meny > Epoq Kök & Tvättstuga > Epoq Designer - Rita ditt eget kök
24. Jonas Söderström • 2022 Skolplattformen Ditt barn och ditt barns lärare använder Skolplattformen dagligen i den kommunala grundskolan. Där finns verktyg som underlättar planering och lärande. Här finns viktig information från ditt barns skola, som schema, närvaro, bedömning/betyg kontaktuppgifter till lärare och annan personal. Bla, bla, bla
25. Jonas Söderström • 2022 Skolplattformen Här finns viktig information från ditt barns skola, som schema, närvaro, bedömning/betyg kontaktuppgifter till lärare och annan personal. Bla
26. Jonas Söderström • 2022 Skolplattformen Här finns schema, närvaro, bedömning/betyg, kontaktuppgifter till lärare och annan personal, samt annan viktig information. Det konkreta först!
27. Jonas Söderström • 2021 ”Har jag covid-19?”
28. Jonas Söderström • 2022 Webbtypografi
29. Jonas Söderström • 2023 A Läsning är ingen naturlig aktivitet
30. Jonas Söderström • 2023 Läsning och förståelse är målet Typogra fi är verktygen
31. Jonas Söderström • 2023 Vilket typsnitt är bäst? Storlek? Hur långa rader? Grunderna
32. Jonas Söderström • 2023 ”En undersökning visar …” Ta det med en nypa salt.
33. Jonas Söderström • 2023 • Läsning är extremt komplext och resultaten 
 kan till stor del vara motstridiga, beroende på textens storlek, läsarens avstånd till den, belysningen, innehållet etc… • Även om ett resultat tycks vara att en design läses ”snabbare” eller ”lättare”, kan skillnaderna vara små i praktiken. • Människor har ofta en annan uppfattning om läshastighet etc, än vad tidtagaruret säger.
34. Jonas Söderström • 2023 Brödtext 
 och allmänt
35. Jonas Söderström • 2023 Aalborg Två grundtyper Aalborg Antikva Serif-typsnitt Linjär Grotesk Sans serif Anses numer lika lättlästa g g Serif Serif
36. Jonas Söderström • 2023 A Typsnittsformer A Linjär Grotesk Sans serif Antikva Serif-typsnitt Medieval- antikva Garald Didon Nyantikva A Mekan Egyptienne Slab serif A Real Transantikva A
37. Jonas Söderström • 2023 A A Futura Helvetica Frutiger Garamond Berling Bembo Minion Goudy Old Style Didot Bodoni A Rockwell Clarendon Memphis Beton A Baskerville Times A Typsnitt har namn – tidigare ofta efter formgivaren eller uppdragsgivaren (tryckeri/tidning) Linjärer har varit populära för skärmar, pga sämre upplösning än papper
38. Jonas Söderström • 2023 Olika typsnitt i samma grad 
 framträder i olika storlek på skärmen. Älgx Älgx Älgx Monaco 175 p Trebuchet 175 p Adobe Garamond 175 p Ä 175 p Ä
39. Jonas Söderström • 2023 Älgbix Verdana Älgbix Älgbix Calibri Trebuchet Älgbix Open Sans Älgbix Lucida Grande Arial Älgbix
40. Jonas Söderström • 2023 Skillnader i bokstavsformer skapar olika grad av svärta eller ljushet i textbilden Man strävar normalt efter en ”lagom” svärta
41. Jonas Söderström • 2023 Långt nere under honom bullrade den nyvaknade staden; ångvinscharne snurrade nere i Stads- gårdshamnen, järn- stängerna skramlade i järnvågen, slussvaktarnes pipor visslade, ångbåtarne vid Skeppsbron ångade, Kungsbacksomnibussarn e hoppade skallrande fram på den kullriga stenläggningen; Långt nere under honom bullrade den nyvaknade staden; ångvinscharne snurrade nere i Stadsgårds- hamnen, järnstängerna skramlade i järnvågen, slussvaktarnes pipor visslade, ångbåtarne vid Skeppsbron ångade, Kungsbacksomnibussar ne hoppade skallrande fram på den kullriga stenläggningen; Långt nere under honom bullrade den nyvaknade staden; ångvinscharne snurrade nere i Stads- gårdshamnen, järn- stängerna skramlade i järnvågen, sluss- vaktarnes pipor visslade, ångbåtarne vid Skepps- bron ångade, Kungsbacksomni- bussarne hoppade skallrande fram på den kullriga stenläggningen; ITC Garamond Adobe Garamond Sectra
42. Jonas Söderström • 2023 Display-typsnitt (eller rubrik-typsnitt) vs bröd-typsnitt
43. Jonas Söderström • 2023 Långt nere under honom bullrade den nyvaknade staden; Långt nere under honom bullrade den nyvaknade staden; Långt nere under honom bullrade den nyvaknade staden; Röda Rummet Röda Rummet Röda Rummet Röda Rummet Röda Rummet Röda Rummet Brödtext Display
44. Jonas Söderström • 2023 Slutna former 
 eller öppna
45. Jonas Söderström • 2023 oceas Slutna former gör bokstäverna svåra att skilja från varandra i små grader oceas oceas g Mabry Myriad Atkinson Hyperlegible Helvetica 29 Mabry 29 Open Sans g oceas Myriad Helvetica
46. Jonas Söderström • 2023 Ill Bokstavsformer och bokstavspar bör vara distinkta! Ill Helvetica Tahoma Ill Trebuchet !" Arial Avenir nh Ill Atkinson Hyperlegible #$%& Helvetica Trebuchet lo b lo b Atkinson Hyperlegible
47. Jonas Söderström • 2023 Bokstavsformer och bokstavspar bör vara distinkta! &' Helvetica BBC Reith bd bd Atkinson Hyperlegible ij Helvetica Tahoma ij Mabry ij ij Atkinson Hyperlegible
48. Jonas Söderström • 2023 • Atkinson Hyperlegible
49. Jonas Söderström • 2023 En annan detalj e a s e a s Adobe Garamond Helvetica
50. Jonas Söderström • 2023 x-höjd xnh73 % Century Gothic xnh55 % Adobe Garamond
51. Jonas Söderström • 2023 xnh xnh xnh xnh 73 % 69 % 52 % 72 % Cochin Myriad Century Gothic Trebuchet xnh Open Sans 72 % xnh55 % Adobe Garamond xnh63 % Minion
52. Jonas Söderström • 2023 Proportioner
53. Jonas Söderström • 2023 Många sajter/appar använder högsmala typsnitt (”condensed”) för att få in tillräckligt med information på smala mobilskärmar. Älgbix Älgbix Älgbix Myriad Condensed Blair MD ITC Myriad Normal
54. Jonas Söderström • 2023 … för rubriker
55. Jonas Söderström • 2023 … men också för knappar
56. Jonas Söderström • 2023 … och en smalare för opinions- artiklar NY Times har en måttligt smal rubrikstil för nyheter …
57. Jonas Söderström • 2023 Tisdag Mars 21 Genomgång Uppgift 2 Ton Avsändar- personor Framing 16.00–18.00 Flöden 
 Ux-research: kundresa Länkar UX-process Torsdag Mars 30 Mars 27 Vecka 12 Vecka 13 Torsdag Mars 23 Måndag