O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Design for Coders

Video Description

Are there web sites that have a design you really admire? Do you wish you could create attractive and effective designs? Are you "design-challenged" and need to know the basics of creating good-looking web sites, mobile apps or other digital media? You may never be a world famous designer, but you can design attractive, effective and high-quality digital media by understanding the foundations of design. If you're a one-person shop and have to create interfaces even though you are trained as a developer. this course is for you! If you're approaching design for the first time and need to be able to apply your new design skills quickly, you need to take this course. In this exciting series of lectures and activities, expert designer Joseph Caserto will start with the foundations including line, shape, space, color and texture and apply the design foundations to every day digital work. You'll learn to create beautiful typography, learn to understand your audience , create effective layouts and examine motion, sound and interactivity. With over 30 fascinating video lectures, multiple lab exercises, and fascinating insight from your instructor, you'll be creating designs that everyone will be talking about.

Table of Contents

  1. In this video, Joseph introduces the basics of shape and lines in website design with examples across the internet 00:04:25
  2. Joseph breaks down the concept of using space to your advantage in design 00:04:46
  3. In this video, Joseph explains how color, tone and texture can be used for organization, conveying a mood, and creating illusions in your design. 00:02:58
  4. Joseph explains briefly how color works from a scientific standpoint, and how color on our screens differs from color we see on paper or in objects. 00:04:15
  5. This video explains how designers use colors of light, and breaks down basic concepts of hue, saturation, and lightness 00:03:13
  6. Joseph goes through how coders and designers formulate colors into specific numbers and hex codes to use in HTML, CSS, and other areas of design. 00:04:11
  7. In this video, Joseph goes through terms that are fundamental to understanding typography. 00:05:51
  8. Joseph describes styles and families of fonts. 00:03:45
  9. In this video, Joseph delves into how to recognize type as a collection of shapes and space instead of simply utilitarian symbols, and how to use this perspective in designing typography. 00:06:38
  10. Joseph explains how good design is heavily dependent on the viewer or user it is meant for, and why it is so critical to know who your audience is when you are designing. 00:05:11
  11. In this video, Joseph explains how to keep your user in mind when designing your website or interface, and goes through some recent examples of useful designs 00:08:06
  12. This video goes through how to make your design give hints and clues to the user about how to use your interface, and how you can use feedback from an independent user to improve the functionality of your design 00:04:21
  13. Joseph explains how you can use elements of design to guide your user to what they should see first or to help them find where they want to go as quickly as possible 00:04:52
  14. This video explains how designing grids, organizing sections by prominence and using space effectively help your user navigate your page. 00:06:00
  15. In this video, Joseph explains the importance of the utility of your design over the specifics of how it looks. 00:03:36
  16. Joseph explains how the importance of what is left out of your design can be just as important as what is in your design. 00:05:57
  17. In this video, Joseph explains the importance of keeping in mind the many different types of devices your user could potentially be using. 00:03:54
  18. Joesph goes through the circumstances out of your control, such as your users' connection speeds and device qualities, to keep in mind when designing your project 00:03:15
  19. This video explains the concept of resolution, and keeping in mind how it varies from device to device. 00:09:49
  20. Joseph explains how to effectively convey to your user which elements of your design are interactive, and what those elements will do or where they will bring you. 00:08:39
  21. This video explains what icons are in the context of web design, and what makes them intuitive and effective 00:07:06
  22. In this video, Joseph runs through some examples of effective imagery in design, and explains how they are used to convey information to the viewer as well as text. 00:07:17
  23. Joseph explains how understanding what your user expects of the medium they are using can help you in your designing process. 00:05:21
  24. This video goes through some fun examples of web sites and apps that use motion and sound effectively, and how your use of these techniques can make or break your user's experience. 00:12:17
  25. In this video, Joseph goes through some examples of web pages and apps with great interactive designs, which is an effective way to organize your content 00:03:42
  26. Joseph explains the importance of helping your user find content and get to it quickly and easily. 00:03:51
  27. This video explains what rollover states are, how they can be a great and effective tool for navigation on a web site, and why they must be avoided on tablet interfaces. 00:03:06
  28. Joseph describes the techniques and importance of planning the organization of your content before delving into appearances and specifics. 00:05:43
  29. Further explaining the importance of organization, Joseph goes through the concept of wireframing your site or app and setting it in stone before designing any appearances. 00:08:07
  30. Bringing it back to the user once more, Joseph explains the importance of keeping in mind what the person using your website or app is there for and how to get them to the information they want as easily and quickly as possible 00:03:32
  31. In this video, Joseph goes through some examples of uniform websites and explains the importance of not just seeing your website as a collection of individual pieces, but how those pieces fit together as a whole. 00:03:48
  32. Joseph explains how using an element more than once serves to reinforce the purpose of that element and helps everything work together. 00:04:16
  33. This video sees Joseph running through some examples of good consistent design, which is important in helping your user easily understand your design and learn how it functions 00:07:16