visual design skillshare
DESCRIPTION
Visual Design Basics workshop @ the Designer/Engineer Skillshare May 17, 2011 Teaching Engineers design skills in trade for engineering skills.TRANSCRIPT
![Page 1: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/1.jpg)
Visual Design SkillShare
by @ meekalbajaj and @karldotter
![Page 2: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/2.jpg)
2 design examples =
![Page 3: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/3.jpg)
Quora.com
![Page 4: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/4.jpg)
DustinCurtis.com
![Page 5: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/5.jpg)
What do you think of these designs
visually?
![Page 6: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/6.jpg)
You can speak the language of design.
![Page 7: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/7.jpg)
3 basic patterns:color, grid, typography
![Page 8: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/8.jpg)
Color
![Page 9: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/9.jpg)
votizen.com
![Page 10: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/10.jpg)
Color helps convey active tab and hover state visual feedback
![Page 11: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/11.jpg)
Grid
![Page 12: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/12.jpg)
![Page 13: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/13.jpg)
![Page 14: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/14.jpg)
![Page 15: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/15.jpg)
![Page 16: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/16.jpg)
![Page 17: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/17.jpg)
![Page 18: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/18.jpg)
Typography
![Page 19: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/19.jpg)
linkname.com
![Page 20: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/20.jpg)
![Page 21: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/21.jpg)
![Page 22: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/22.jpg)
Revisit design examples:quora.com & dustincurtis.com
• form groups of 2-3 • formulate opinions • think about grid, color, typography
![Page 23: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/23.jpg)
Now, let's share with the group
• phrase questions as themes around color, grid, typography • list down the things people noticed
![Page 24: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/24.jpg)
Visual design resources:
dribbble.comforsst.comilovetypography.comnicewebtype.comcolorschemedesigner.com
![Page 25: Visual Design SkillShare](https://reader034.vdocument.in/reader034/viewer/2022051515/54c80e3e4a7959994b8b45be/html5/thumbnails/25.jpg)
Thanks! for SkillSharing
@ meekalbajaj and @karldotter