Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Innehåll först med innehållsprototyper

666 views

Published on

En presentation om problemet med att ta fram visuell design innan innehållet är klart. Innehållet måste då pressas in i en illasittande kostym. Lösningen är att i stället börja med en innehållsprototyp som ger underlag för den grafiska formen. Börja med verksamheten, inte med dekorationen.

Published in: Business
  • Be the first to comment

Innehåll först med innehållsprototyper

  1. 1. Innehåll först med innehållsprototyper @axbom
  2. 2. @axbom Lorem! Ipsum! Dolor sit! Amet!
  3. 3. @axbom
  4. 4. @axbom Hur gör vi när vi ska bygga en ny webbplats?
  5. 5. @axbom – Hur ska den se ut?
  6. 6. @axbom
  7. 7. @axbom DIN WEBBPLATS ÄR        DETTA        DIN        WEBBPLATS VI ÄR UNIKA LÄS MER Vi är oerhört unika och särskiljer oss från alla våra konkurrenter. Även om vår webbplats ser likadan ut. Alltid. Tre. Kolumner. Vi skulle kunna ha fyra kolumner. Men alla andra har ju tre. Vi kände oss kreativa så vill la en bild på en leende kvinna här. Webbplatsen dikterar alltså att vi begränsar oss till 3 tjänster. Idén stulen, med all respekt, av: Dave Ellis. / novolume.co.uk
  8. 8. @axbom
  9. 9. @axbom
  10. 10. @axbom – Hur snygg som helst, nu testar vi!
  11. 11. @axbom – Vänta, var det här innehållet ni ville kommunicera?
  12. 12. @axbom Ingen vågar ta ansvar för innehållet. Alla vet nämligen att om innehållet inte matchar behoven är sajten värdelös.
  13. 13. @axbom Användarens resa
  14. 14. @axbom Användarens resa
  15. 15. @axbom Användarens resa
  16. 16. @axbom
  17. 17. @axbom DIN WEBBPLATS ÄR        DETTA        DIN        WEBBPLATS Rubriken skriver vi någonstans mitt på sidan Här är det innehåll du som användare söker. Är du inte glad att du hittade fram hit? Beroende på vilken sida du hamnat på så kanske det här i och för sig kanske bara utfyllnadstext som leder dig vidare till det innehåll som egentligen hjälper dig att komma vidare. Vi behövde den här sidan för designern byggde det så. Lycka till! Alternativ 1 Alternativ 2 Alternativ 3 Alternativ 4 Alternativ 5 Alternativ 6 Alternativ 7 Alternativ 8 Eftersom vi inte litar på att du hittar något så lägger vi för säkerhet skull alla länkar en gång till i sidfoten också. Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Gå vidare till det riktiga innehållet Mer saker Eftersom vi inte klarar av att lösa ditt problem på den här sidan så vill vi tipsa om andra sidor. Ännu mer saker Sidan blir obalanserad om vi inte lägger något här så vi bad Jimmy hitta på något. Det blev en puff. Här i högerkanten lägger vi också några länkar som ingen orkar förvalta: Några länkar Lorem ipsum Lorem ipsum Avdelning 1 Avdelning 2 Avdelning 3 Avdelning 4 Avdelning 5
  18. 18. @axbom DIN WEBBPLATS ÄR        DETTA        DIN        WEBBPLATS Rubriken skriver vi någonstans mitt på sidan Här är det innehåll du som användare söker. Är du inte glad att du hittade fram hit? Beroende på vilken sida du hamnat på så kanske det här i och för sig kanske bara utfyllnadstext som leder dig vidare till det innehåll som egentligen hjälper dig att komma vidare. Vi behövde den här sidan för designern byggde det så. Lycka till! Alternativ 1 Alternativ 2 Alternativ 3 Alternativ 4 Alternativ 5 Alternativ 6 Alternativ 7 Alternativ 8 Eftersom vi inte litar på att du hittar något så lägger vi för säkerhet skull alla länkar en gång till i sidfoten också. Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Gå vidare till det riktiga innehållet Mer saker Eftersom vi inte klarar av att lösa ditt problem på den här sidan så vill vi tipsa om andra sidor. Ännu mer saker Sidan blir obalanserad om vi inte lägger något här så vi bad Jimmy hitta på något. Det blev en puff. Här i högerkanten lägger vi också några länkar som ingen orkar förvalta: Några länkar Lorem ipsum Lorem ipsum Avdelning 1 Avdelning 2 Avdelning 3 Avdelning 4 Avdelning 5
  19. 19. @axbom DIN WEBBPLATS ÄR        DETTA        DIN        WEBBPLATS Rubriken skriver vi någonstans mitt på sidan Här är det innehåll du som användare söker. Är du inte glad att du hittade fram hit? Beroende på vilken sida du hamnat på så kanske det här i och för sig kanske bara utfyllnadstext som leder dig vidare till det innehåll som egentligen hjälper dig att komma vidare. Vi behövde den här sidan för designern byggde det så. Lycka till! Alternativ 1 Alternativ 2 Alternativ 3 Alternativ 4 Alternativ 5 Alternativ 6 Alternativ 7 Alternativ 8 Eftersom vi inte litar på att du hittar något så lägger vi för säkerhet skull alla länkar en gång till i sidfoten också. Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Gå vidare till det riktiga innehållet Mer saker Eftersom vi inte klarar av att lösa ditt problem på den här sidan så vill vi tipsa om andra sidor. Ännu mer saker Sidan blir obalanserad om vi inte lägger något här så vi bad Jimmy hitta på något. Det blev en puff. Här i högerkanten lägger vi också några länkar som ingen orkar förvalta: Några länkar Lorem ipsum Lorem ipsum Avdelning 1 Avdelning 2 Avdelning 3 Avdelning 4 Avdelning 5 Nej, men ser man på, där är ju innehållet jag ville läsa!
  20. 20. @axbom Innehåll definierar struktur. Inte tv är
 to
 m!
  21. 21. @axbom
  22. 22. @axbom
  23. 23. @axbom
  24. 24. @axbom
  25. 25. @axbom
  26. 26. @axbom
  27. 27. innehållsprototyp Vad menas med ?
  28. 28. innehållsprototyp Ett dokument med det innehåll användaren behöver för att uppfylla sina mål. En
  29. 29. …alltså inte ett dokument med vackra bilder som får webbägaren att må bra och känna sig viktig.
  30. 30. @axbom Grafisk design som inte utgår från innehåll är inte design, det är på sin höjd estetisk verksamhet. Jag dekorerar webbplatser.Vad gör du?
  31. 31. @axbom En innehållsprototyp
  32. 32. @axbom En innehållsprototyp Utgår från riktiga behov. Måste inte läsa tankar
  33. 33. @axbom En innehållsprototyp Utgår från riktiga behov. Är snabb och kostnadseffektiv. Måste inte läsa tankar
  34. 34. @axbom En innehållsprototyp Förstås av alla. Utgår från riktiga behov. Är tillgänglig för alla att bidra. Är snabb och kostnadseffektiv. Även användare Måste inte läsa tankar
  35. 35. @axbom En innehållsprototyp Förstås av alla. Utgår från riktiga behov. Är tillgänglig för alla att bidra. Är snabb och kostnadseffektiv. Hittar inte på egenskaper. Även användare Måste inte läsa tankar
  36. 36. @axbom En innehållsprototyp Förstås av alla. Utgår från riktiga behov. Är tillgänglig för alla att bidra. Är guld värd för en visuell designer. Är snabb och kostnadseffektiv. Hittar inte på egenskaper. Även användare Måste inte läsa tankar
  37. 37. @axbom En innehållsprototyp Förstås av alla. Utgår från riktiga behov. Är tillgänglig för alla att bidra. Är guld värd för en visuell designer. Är snabb och kostnadseffektiv. Hittar inte på egenskaper. Måste inte passa en struktur. Gör att vi jobbar iterativt med innehåll. Även användare Måste inte läsa tankar
  38. 38. @axbom En innehållsprototyp Förstås av alla. Utgår från riktiga behov. Är tillgänglig för alla att bidra. Är guld värd för en visuell designer. Är framtidssäker. Är snabb och kostnadseffektiv. Hittar inte på egenskaper. Måste inte passa en struktur. Gör att vi jobbar iterativt med innehåll. Stöd för tillgänglighet Plattformsoberoende Mobile first Även användare Måste inte läsa tankar
  39. 39. @axbom En innehållsprototyp kan användas för en webbsida, en app… ja, till och med en tweet. 
 
 Syfte: Dra trafik till en landningssida. Bygg varumärke. För: deltagare på Webbdagarna Välkomna att ladda ner en gratis innehållsprototyp på axbom.se/ipro
  40. 40. @axbom En innehållsprototyp kan användas för en webbsida, en app… ja, till och med en tweet. 
 
 Plats för exempel Syfte: Dra trafik till en landningssida. Bygg varumärke. För: deltagare på Webbdagarna Välkomna att ladda ner en gratis innehållsprototyp på axbom.se/ipro Syfte: Dra trafik till en landningssida. Bygg varumärke. För: deltagare på Webbdagarna Vill du bli tydligare med syfte, budskap och värde som din tjänst ger? Använd en innehållsprototyp. axbom.se/ipro #webbdagarna
  41. 41. @axbom En innehållsprototyp kan användas för en webbsida, en app… ja, till och med en tweet. 
 
 Plats för exempel Syfte: Dra trafik till en landningssida. Bygg varumärke. För: deltagare på Webbdagarna Välkomna att ladda ner en gratis innehållsprototyp på axbom.se/ipro Syfte: Dra trafik till en landningssida. Bygg varumärke. För: deltagare på Webbdagarna Vill du bli tydligare med syfte, budskap och värde som din tjänst ger? Använd en innehållsprototyp. axbom.se/ipro #webbdagarna Plats för exempelSyfte: Dra trafik till en landningssida. Bygg varumärke. För: deltagare på Webbdagarna Fet *facepalm* när visuell design kommer före innehåll. Ligg ljusår före, använd en innehållsprototyp: axbom.se/ipro #webbdagarna
  42. 42. @axbom –Matt Jones “Skribenter är världens snabbaste designers.”
  43. 43. @axbom –Abby Covert “Skrivande kommunicerar avsikt.”
  44. 44. @axbom En innehållsprototyp kommunicerar tydligt
 syfte, värde och nytta.
  45. 45. @axbom Genom att först ta fram bra, strukturerat innehåll tillgodoser du den minsta gemensamma nämnaren i sättet som användaren konsumerar innehållet, vare sig det är en liten skärm, en textläsare eller en TV. Innehållet funkar överallt.
  46. 46. @axbom enwebbsida.se
  47. 47. @axbom enwebbsida.se/fk
  48. 48. @axbom enwebbsida.se/fk
  49. 49. @axbom enwebbsida.se/fk
  50. 50. @axbom enwebbsida.se/fk
  51. 51. @axbom enwebbsida.se/fk
  52. 52. @axbom enwebbsida.se/fk
  53. 53. @axbom enwebbsida.se/fk
  54. 54. @axbom enwebbsida.se/fk
  55. 55. @axbom – Men vi har inget innehåll!
  56. 56. @axbom – Det finns alltid innehåll! •Den gamla sajtens innehåll •Konkurrenters innehåll •Skriv innehållet!
  57. 57. @axbom Ditt innehåll kommer förändras Med en innehållsprototyp jobbar du kollaborativt, iterativt, inkluderande, generöst och genomtänkt. Innehållet kommer inte först eller sist, det händer hela tiden – det är innehållet som är din verksamhet. Innehållet visar din avsikt.
  58. 58. @axbom
  59. 59. @axbom @axbom Gratis mall för innehållsprototyp: axbom.se/ipro

×