brad frost let's business core values the culture engine com ubuntu design voice and tone special snowflake syndrone carbon design sys unity glue good kickoff meetings vote on outcomes prioriyt votes for principles what won? what lost? why> design principles process | product best thing the easiest grab it quick crowd proof tech agnostic opposites strong and direct sketch libs photoshop etiquette com intra/inter style guide guide concurrent work content choreography brains chaos vs rigidity humanity
-
-
Save ryanve/ac07024b5bb0c04aa3ebd667ed9edb03 to your computer and use it in GitHub Desktop.
donna @dlichaw in 2004 all you need ot know about story from breaking bad beg mid end |_ intrigue over time exposition hero goal inciting incident rising action crisis climax (resolution) denouement (falling action) learned and accomplished end twist narrative parsing cannot move fwd life is a story you are the hero 2-in-1 example fantasical autocomplete rising action better than before system feedback happy socks who goal cta flow impediment value finish measure diff teams are diff story part peak end rule utility usability desireability value choice who is the hero what do they want how do they get there
eric 80ft on this day unknowns good will overcomes stumbles stress test moment of crisis test cheatin' uh unjust accusation assumptions humor not diffusing tension pokestops "what's being assumed?" Connected Whopper video ad inclusive design at microsoft recognize exclusion learn from diversity solve for one, extend to many design for real life: DFRL-AEA17 "our assumptions come back to haunt us" practice "don't assume too much"
ethan non-ideal collab gap
- visual inventory
- pattern naming
- code kss fractal.build/guide styleguide generator roundup naming and language consistent atomic ambiguity glossary velocity words language of modular design pattern naming collab css arx via design help articulate dp vox: uniq, resize, clarity, rwd, a11y airbnb: unified, iconic, convo smartphone syria refugee example the next billion stars
a11y @feather
how to fix what went wrong
a11y lives in: people, process, tools
Perfect. Better.
20 things mini sprint
unachievable vs achievable
real-world usability testing
proximity
muscle memory
straw test
keyboards
magnifying
text resize
background noise no captions
prioritize: keyboard, media, forms
because they accounts for 2/3 of logged issues
accidently accessible: oranges in plastic
waffle house cheat sheet
interaction tables
elevator scotish speech
build for the future
higgins build trhu ix personal focus continue discovery duolingo chatbot after 3 lessons change aversion lapse opps: initial, coninued, redesign, lapse diverse methods diff paths from: first exposure, diff platform, competitor default states vis hier task skeleton (air wander) inline guideance to weave info reactive guidance (twitter mute example) proactive guidance (duolingo direct example) on-demand guidance (discoverable help) weaverbird look back to find key actions breakdown into modules: trigger activity follow-up reinforce spaced repitition reps prevent 1-time use mindset choose appropriate methods < exploring - on mission > < established - novel > | lightweight - prominent _ general - focused set learning checkpoints 5s test onboarding is over time learn all the time (churn example) when does onboarding end? never? onboarding: everyday guidance
ml speech pattern data bias iaas apis
- amazon
- ibm watson
- ms cognitive services
- emoition api
- wit.ai -> intents
- giorgio cam ml is design material machines make mistakes chijuahj or muffin raw chicken or trump picdescbot anticipate weirdness embrace uncertainty
our anw machin have an overconf prob creative humility
- favor accuracy over speed
- perf is speed of answer (not page)
- but gotta be the right answer
- idk can be better
- allow for ambiguity
- signal confidence. ask for help
- add human judegement
- put ppl where the pipes will go
- hostile info zones
- advocate sunshine (transparency)
- scale, importances, secrecy
- CivicScape
- import the data (data bias)
- weaopons of match destruction
- "letd's not codiu the past"
- make it easy to contribute accurate data
- the machines eat us
- give ppl data control
- right to erase
- transparent access
- be loyal to user
- take responsibility
technical advance dillisionment critique
juvet agenda org
ml speech pattern data bias iaas apis
- amazon
- ibm watson
- ms cognitive services
- emoition api
- wit.ai -> intents
- giorgio cam ml is design material machines make mistakes chijuahj or muffin raw chicken or trump picdescbot anticipate weirdness embrace uncertainty
our anw machin have an overconf prob creative humility
- favor accuracy over speed
- perf is speed of answer (not page)
- but gotta be the right answer
- idk can be better
- allow for ambiguity
- signal confidence. ask for help
- add human judegement
- put ppl where the pipes will go
- hostile info zones
- advocate sunshine (transparency)
- scale, importances, secrecy
- CivicScape
- import the data (data bias)
- weaopons of match destruction
- "letd's not codiu the past"
- make it easy to contribute accurate data
- the machines eat us
- give ppl data control
- right to erase
- transparent access
- be loyal to user
- take responsibility
technical advance dillisionment critique
juvet agenda org
- charts nivo.rocks
- shape morphing
- greensock
- css line drawing
- d: path()
- offset-path
- bodymovin
- stroke-dasharray drawing
- ui animation
- insertion
- cut away mask
- loading
- password
- audio
- icon system
- svg sprite and
- include inline "jist inulcde them"
- do art
- scenes
- turbulence filter
- diagrams
- data viz
- text transform code example
- ads
- headline lockups
- real world
- explain your product
- teaching
- delight
motion and meaning podcast it depends
low barrier to entry (gateway drug) clear states mq limited events predefined some places it can't wuite get to
motion + logic effortless perf
3+ sequence transform physics narrative or immersive drag n drop bouncy timeline raf gs vel anime complex dom svg canvas react ref transition group plus react motion for springs fiber cartoon talk: lin clark
just numbers and math logos, ills, icons, dataviz, fluid responsive scaling zooming shapes morphing squishing css svg transform not in ie or edge prog enhance only way to do motion on path accelerated: scale translate rotate opacity style > layout > paint > composite paint flashing css declaritive js impoertive canvas acceleratable svg accel only in ff today