This document discusses principles of design and provides tips for creating effective designs. It covers topics like layout, images, color, typography, and feedback. Key points include that attractive designs work better because they create emotional reactions and meet users' expectations. Design is presented as similar to coding, involving patterns, practices, and feedback cycles. Junior and senior designers are compared, with senior designers able to emphasize appropriately and drive user attention. Specific design tips are provided around whitespace, emphasis, the golden ratio, rounded vs square elements, consistency, and optimizing images. Color theory basics and creating engaging typography are also outlined. The importance of usability testing and not just asking for likes is emphasized.
16. Design is very similar to code
Patter ns , Pr ac tic es , H er etic s , R ules , Logic . TD D ,
Feedbac k C yc les .
17. Junior Designers vs. Senior
Designers
https :// medium.c om /the -ye a r- of-the -lo o kin g -
glas s /junior - d es ig n er s-vs -senior-designers -
fbe483d3b51e
75. "In some ways, the most difficult
part of design process is finding
the initial inspiration to make a
font" ~ Karen Cheng
Mos t impor tant as pec t of d e s ig n
104. • Layout, Images, Colours,
Typography, Feedback
• Just like code… Copy, Test,
Iterate, Feedback, Play.
• Sign up to JoinScrapbook.com
• Tweet me for slides @Ben_Hall
Notes de l'éditeur
www2.warnerbros.com/spacejam/movie/jam.htm
1996
As children we’re told that corners hurt…
Steve jobs hated corners
Sadly no-one told Microsoft
Enhance other content on your page
Valentica
Works of art
This is because the serif make the individual letters more distincitve and easier for our brains to recognise easier. Without the serif, the brain has to spend longer identifying the letter because the shape is less distinctive
Different font weights will render typefaces specifically created for that weight, unlike the old days where bold could be just an algorithm to fatten a typeface. Obvious uses the numerical value of font-weight to enable the best representation of a typeface.
Harder to read…
Giving feedback
Progress bars are key… make them interactive with a video too