Illustrating User Interface

Transcript

1. ILLUSTRATING USER INTERFACE supereightstudio.com @matthamm

2. ABOUT ME

3. None
4. None
5. None
6. None

7. 1 WHY? 2 TYPES 3 STYLES 4 WORKFLOW

8. WHY?

9. None

10. 40,000 YEARS OLD

11. PRIMITIVE

12. None

13. DESIGN ART

14. ILLUSTRATION ART Style

15. DESIGN IS PROBLEM SOLVING

16. ILLUSTRATION CAN SOLVE PROBLEMS

17. We work our way through, initially understanding the problem, whatever

    that may be, thoughtfully considering the client, the business, the market, the goals, the audience and users, and then find ways of telling the right story.” “ - Mark Bolton

18. Illustration is pictures to read or words to look at.”

    - Quentin Blake “
19. None

20. TYPES

21. MASCOT & CHARACTER

22. THEMATIC

23. None
24. None

25. ICONIC

26. None

27. THE NOUN PROJECT

28. HAND RENDERED TYPE

29. None
30. None

31. DIAGRAMMATIC

32. APIs API API SIP Your OSS/BSS Your Servers DRUM HQ

    Your Customer Billing Reporting Provisioning Tra c connection Integrate Reporting + Billing Provision Access No. + PINS Call Control Collaboration Provisioning Fully Integrated Audio Conferencing & Web Meetings Drum Audio Your Network Drum Web Hosted Service Drum Web Meetings
33. None
34. None

35. DATA VISUALISATION

36. None
37. None
38. None

39. STYLES

40. STYLE ISN’T ONLY VISUAL

41. 3D RENDERED

42. HYPER-REALISTIC

43. SIMPLE VECTORS

44. None
45. None

46. MINIMALIST

47. None

48. HAND DRAWN

49. None
50. None

51. TRADITIONAL

52. None

53. WORKFLOW

54. THE BRIEF

55. Can u design me a cool mascot 4 my website,

    like Mailchimp? okthxbye” - New client “

56. CLARIFY THE STYLE THE AMOUNT OF CONCEPTS NUMBER OF ITERATIONS

    PRICING STRUCTURE EXAMPLES

57. RESEARCH

58. None
59. None
60. None
61. None

62. FLICKR ISTOCKPHOTO DRIBBBLE GIMMIEBAR/ZOOTOOL GOOGLE IMAGE SEARCH

63. ASK FRIENDS BRAND GUIDELINES READ BOOKS TARGET AUDIENCE ILLUSTRATION BLOGS

64. SKETCH

65. None
66. None
67. None
68. None
69. None

70. VECTOR ARTWORK

71. None
72. None
73. None
74. None

75. ITERATE

76. None
77. None
78. None
79. None
80. None

81. DETAIL

82. None
83. None
84. None
85. None
86. None
87. None
88. None

89. $50 $40 $30 $20 YHOO

90. None

91. ESTABLISH AN ILLUSTRATION STYLE

92. THE USE OF ILLUSTRATION ISN'T APPROPRIATE FOR EVERY BRAND

93. DOODLE

94. FIN supereightstudio.com @matthamm