Download - Design & Front-End: Couples Therapy
![Page 1: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/1.jpg)
Couples Therapy For Designers
& Front-end Developers
Liam Oscar Thurston @liamthurston Creative Director
![Page 2: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/2.jpg)
Shit Designers & Devs Say The Agile Manifesto (?!) Radical Candor! Group Therapy xoxo
COUPLES THERAPY, LET ’S PART Y
![Page 3: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/3.jpg)
INSTALLATION BY TREVOR WHE ATLEY
![Page 4: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/4.jpg)
T WG . I O
![Page 5: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/5.jpg)
Sh!t Des!g~ers & Devel*per$ S@y
![Page 6: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/6.jpg)
“Oh … I thought you could cut out those assets…”
WHEN LAZY DESIGNERS SAY
![Page 7: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/7.jpg)
Own it. TM
![Page 8: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/8.jpg)
![Page 9: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/9.jpg)
“So … when are you designing … all those screens?”
WHEN NAGGING DEVELOPERS SAY
![Page 10: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/10.jpg)
Pair up.
![Page 11: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/11.jpg)
Hands you the messiest file…
WHEN A STONED DESIGNER
![Page 12: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/12.jpg)
Speakthe SameLanguage
![Page 13: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/13.jpg)
B E M
![Page 14: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/14.jpg)
Block Element Modifier
![Page 15: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/15.jpg)
blockName-elementName--modifierName
![Page 16: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/16.jpg)
![Page 17: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/17.jpg)
![Page 18: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/18.jpg)
blockName-elementName--modifierName
BEM
userList-inviteButton--disabled
![Page 19: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/19.jpg)
blockName-elementName--modifierName
BEM
userList-inviteButton--active
![Page 20: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/20.jpg)
blockName-elementName--modifierName
BEM
userList-inviteButton--active
userList-userName
![Page 21: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/21.jpg)
![Page 22: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/22.jpg)
grey-light grey-medium grey-dark
light-grey medium-grey dark-grey
![Page 23: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/23.jpg)
![Page 24: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/24.jpg)
![Page 25: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/25.jpg)
![Page 26: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/26.jpg)
![Page 27: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/27.jpg)
“Heyo, there seem to be some things … missing in this styleguide …”
WHEN A PASSIVE-AGGRESSIVE DEVELOPER SAYS
![Page 28: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/28.jpg)
States: the Obvious
![Page 29: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/29.jpg)
![Page 30: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/30.jpg)
C.I.S.S.
SMOOCH!
![Page 31: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/31.jpg)
![Page 32: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/32.jpg)
States: the Obvious
![Page 33: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/33.jpg)
When __________________,
I want to _______________,
so I can ________________.
JOB STORIES R ULE
SITUATION
MOTIVATION
EXPECTED OUTCOME
B LO G . I N T E R C O M .C O M
![Page 34: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/34.jpg)
When I need help from a group member,
I want to find their contact info,
so I can connect with them quickly.
JOB STORIES R ULE
![Page 35: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/35.jpg)
When I need help from a group member,
I want to find their contact info,
so I can connect with them quickly.
JOB STORIES R ULE
![Page 36: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/36.jpg)
“What’s with all this … white space?”
WHEN DEVELOPERS CALL YOU OUT
![Page 37: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/37.jpg)
Your Spacing is Inconsistent
DON’T SPACE
OUT!
![Page 38: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/38.jpg)
![Page 39: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/39.jpg)
.spacer--sm
.spacer
.spacer--lg
.spacer
![Page 40: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/40.jpg)
![Page 41: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/41.jpg)
![Page 42: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/42.jpg)
![Page 43: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/43.jpg)
![Page 44: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/44.jpg)
![Page 45: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/45.jpg)
![Page 46: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/46.jpg)
![Page 47: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/47.jpg)
![Page 48: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/48.jpg)
![Page 49: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/49.jpg)
![Page 50: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/50.jpg)
![Page 51: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/51.jpg)
![Page 52: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/52.jpg)
“Wow, these lines lengths and photos are just … perfect.”
WHEN SARCASTIC DEVELOPERS SAY
![Page 53: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/53.jpg)
Use Real Content.com
THIS
DOMAIN IS
AVAILABLE!
![Page 54: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/54.jpg)
![Page 55: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/55.jpg)
“So, you used about… 50 shades of grey.”
WHEN WELL-RE AD DEVELOPERS SAY
![Page 56: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/56.jpg)
You used 63 shades of grey.
![Page 57: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/57.jpg)
Try starting with 3
![Page 58: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/58.jpg)
“Hey I’m thinking we might use Zeplin …”
WHEN LAZY DESIGNERS SAY
![Page 59: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/59.jpg)
Use Zeplin.
![Page 60: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/60.jpg)
![Page 61: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/61.jpg)
![Page 62: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/62.jpg)
![Page 63: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/63.jpg)
![Page 64: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/64.jpg)
![Page 65: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/65.jpg)
![Page 66: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/66.jpg)
“Hey, I built that component that I saw in Zeplin…”
WHEN SPACED-OUT DEVELOPERS SAY
![Page 67: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/67.jpg)
Keep your files fresh.
![Page 68: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/68.jpg)
“I’ll do some design QA tonight…”
WHEN PASSIVE-AGGRESSIVE DESIGNERS SAY
![Page 69: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/69.jpg)
“I’ll do some design QA tonight…”
WHEN PASSIVE-AGGRESSIVE DESIGNERS SAY
![Page 70: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/70.jpg)
Stay close. ALWAYS BE
QA’IN!
![Page 71: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/71.jpg)
“Damn that user testing session was great, we learned so much!”
WHEN PRETENTIOU S DESIGNERS SAY
![Page 72: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/72.jpg)
Come Together.
![Page 73: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/73.jpg)
The Agile Manifesto.
![Page 74: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/74.jpg)
Individuals & interaction over processes & tools
AGILE MANIFESTO
![Page 75: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/75.jpg)
Working software over comprehensive documentation
AGILE MANIFESTO
![Page 76: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/76.jpg)
Customer collaboration over contract negotiation
AGILE MANIFESTO
![Page 77: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/77.jpg)
Responding to change over following a plan
AGILE MANIFESTO
![Page 78: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/78.jpg)
Radical Candor.
![Page 79: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/79.jpg)
Ruinous Empathy
CHALLENGE DIRECTLY
Radical Candor
Manipulative Insincerity
Obnoxious Aggression
CARE PERSONALLY
BULLSHIT
FREE ZONE
![Page 80: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/80.jpg)
“Oh … I thought you could cut out those assets…”
WHEN LAZY DESIGNERS SAY
![Page 81: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/81.jpg)
“Oh … I thought you could cut out those assets…”
WHEN LAZY DESIGNERS SAY
SOLUTIONS PROS CONS
I can do it now I’ll do it tomorrow You should do it
It’s done It’s done late I don’t do it
I don’t have time Project delays You do it
![Page 82: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/82.jpg)
YOUR TURN
![Page 83: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/83.jpg)
Hope Fear
This week, in your role, what is your biggest…
![Page 84: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/84.jpg)
Pros Cons
Now help your partner avoid their fear using Radical Candor
Care personally & challenge directly
![Page 85: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/85.jpg)
Shit Designers & Devs Say The Agile Manifesto (?!) Radical Candor! Group Therapy xoxo
COUPLES THERAPY, WE PARTIED
![Page 86: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/86.jpg)
Questions?! Liam Oscar Thurston @liamthurston Creative Director
![Page 87: Design & Front-End: Couples Therapy](https://reader031.vdocuments.us/reader031/viewer/2022022412/58f9b36d760da3da068bd606/html5/thumbnails/87.jpg)
Couples Therapy For Designers
& Front-end Developers
Liam Oscar Thurston @liamthurston Creative Director