Vi stöter fortfarande på grafiska manualer där hänsyn inte tagits till digitala medier. Det är både märkligt och tråkigt. På detta seminarium reder vi ut vilka faktorer man måste titta djupare på och förstå för att lyckas med en grafisk manual i en digital tid. Vår tes är att man i varumärkets grafiska utformning måste identifiera och ta hänsyn till olika områdens inbyggda restriktioner och möjligheter för att sedan kunna utveckla och detaljera. Vi kallar det den minsta gemensamma nämnaren. Under fyrtiofem minuter ger vi vår syn på webbtypsnitt, responsiva griddar, tillgänglighet, färgvärden och rörelser i digital varumärkesutformning. Fredrik Marcus, Creative Director Creuna Robin Lantz, Designer Creuna

1. Vad hände (inte) med
den grafiska profilen?

2. Robin Lantz
AD
robin.lantz@creuna.se
Instagram.com/tabalawalken
Fredrik FM Marcus
CD/AD/2D/3D/HD inte VD
fm@creuna.se
Twitter.com/fm
instagram.com/fm
www.facebook.com/
fredrik.marcus

4. BIG data
Internet of things
Gamification
Hyper-connectivity
Digital ecosystem
Low-hanging fruit
Disruptive Business
Vad vi inte kommer att tala om:

5. In the dawn of time

6. Förhistorisk hårdvara
Power Mcintosh 7200
Apple Design Team
Arla/Astra/ASG

7. Fler förhistoriska
exempel
GF388
LM Ericsson
December 1994

8. Gammal-tv

9. 90-talswebb

10. 90-talswebb

11. 90-talswebb

12. 90-talswebb

13. 90-talswebb

14. Vad är en
grafisk
profil/
manual?

15. Känns
detta
igen?

16. Känns
detta
igen?

19. Internet growth statistics
(1995-2013)
0
750
1500
2250
3000
1995 2000 2005 2010 2013
16 millions
(0.8% *)
361 millions
(5.0% *)
957 millions
(13.9% *)
1966 millions
(28.7% *)
2749 millions
(38.8% *)
* World population
using internet

20. Internet growth statistics
(1995-2013)
0
750
1500
2250
3000
1995 2000 2005 2010 2013
16 millions
(0.8% *)
361 millions
(5.0% *)
957 millions
(13.9% *)
1966 millions
(28.7% *)
2749 millions
(38.8% *)
* World population
using internet

21. Vad hände (inte) med
den grafiska profilen?

22. Om vi säger mobile first,
ska vi inte säga digital
first när det handlar om
grafiska profilen???

23. 1962

24. 2013

25. Exempel på digitala ytor

31. Två STORA
förändringar har skett
den senaste tiden:
upplösning & typografi.

32. Upplösning

33. Upplösning

34. Upplösning

35. Upplösning

36. Upplösning

37. Typografi

38. Webbfonter 1996-2002

39. Sökresultat:

40. Sökresultat:
Alla typsnitt
5414 typsnitt funna :O

41. Sökresultat:

42. Sökresultat:
Gotham
Ingenting :(

43. Browsers + rendering = false

44. 6 19 16 4.0
7 20 17 5.0
8 21 18 5.1
9 22 19 6.0
10 23

45. Responsivt

50. TAKEAWAYS TYPOGRAFI
Använd samma fonter överallt
Nästan alla typsnitt finns
Vikter är viktigt
Finns alla glypher du behöver?
Läsbarhet
Kantutjäming på olika enheter
Licensmodell?

51. Logotyper

56. v

57. Tänk på appar

58. Tänk på appar
Tänk på
sociala
medier

63. Funka på små och stora skärmar
Vektorer även på web
Svg är begränsat “tänk på”
Logotypens form
Logotyp som appikon
Logotypens placering
Rörligt? Modulärt? Interaktivt?
TAKEAWAYS LOGOTYPER

64. Färger

66. FÄRGER
Färger som fungerar på skärm/print!
Speciellt anpassade paletter
Kontraster (även storlekar)
Tillgänglighet
Reservera Call to action-färg

67. X-faktorn

72. The crazy ones
Think different commercial
Narration by Steve Jobs

73. The crazy ones
Think different commercial
Narration by Steve Jobs

74. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!

75. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först

76. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!

77. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!
Analogt och digitalt ska ha samma känsla

78. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!
Analogt och digitalt ska ha samma känsla
Utvärdera och revidera ofta

79. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!
Analogt och digitalt ska ha samma känsla
Utvärdera och revidera ofta
Glöm inte att ha roligt

80. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!
Analogt och digitalt ska ha samma känsla
Utvärdera och revidera ofta
Glöm inte att ha roligt
Kom ihåg att djävulen är i detaljerna

81. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!
Analogt och digitalt ska ha samma känsla
Utvärdera och revidera ofta
Glöm inte att ha roligt
Kom ihåg att djävulen är i detaljerna

82. 20 NOV 2012© 2012 CONFIDENTIAL & PROPRIETARY
Tänk på detta kamrater!
Designa för svåraste ytan (digitalt) först
Glöm Arial och Verdana nu!
Analogt och digitalt ska ha samma känsla
Utvärdera och revidera ofta
Glöm inte att ha roligt
Kom ihåg att djävulen är i detaljerna

83. Tack!