Transcript
Page 1: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

@melchoyce choycedesign.com

Page 2: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Not a developer

Not you

Page 3: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Step One:Become an easier designer to work with.

Page 4: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Become an easier designer to work with

Be Consistent.

Page 5: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Consistent.Use consistent typefaces and font sizing.

Become an easier designer to work with

Page 6: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Consistent.Use consistent colors.

Become an easier designer to work with

Page 7: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Consistent.Use consistent spacing.

Become an easier designer to work with

Page 8: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Consistent.Use consistent column widths.

Become an easier designer to work with

Page 9: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Consistent.Style elements consistently.

Become an easier designer to work with

Page 10: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Become an easier designer to work with

Be Clean.

Page 11: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Clean.Logically organize your source files.

Become an easier designer to work with

Page 12: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Clean.Name your layers.

Become an easier designer to work with

This is bad

This is good

Page 13: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Clean.Group related layers.

Become an easier designer to work with

This is bad

This is good

Page 14: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Clean.Delete unused layers.

Become an easier designer to work with

What is this?!

Page 15: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Clean.Use whole pixel values.

Become an easier designer to work with

Bad

Page 16: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Clean.Name your source files appropriately.

Become an easier designer to work with

Page 17: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Become an easier designer to work with

Be Knowledgeable.

Page 18: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Knowledgeable.Learn how to code... just a little.

Become an easier designer to work with

Page 19: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Knowledgeable.Learn how to user developer tools.

Become an easier designer to work with

Page 20: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Knowledgeable.Learn about browser compatibility.

Become an easier designer to work with

http://browsehappy.com/

Page 21: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Knowledgeable.Learn the right buzzwords.

Become an easier designer to work with

Page 22: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Be Knowledgeable.Get to know WordPress (or whatever you’re using).Protip: Have your developer insall the Theme Unit Test on your dev site (http://codex.wordpress.org/Theme_Unit_Test)

Become an easier designer to work with

Page 23: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Remember:Even if you are knowledgeable, your developer is the expert on development. Not you.

Become an easier designer to work with

Page 24: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Step Two:Work on your communication skills.

Page 25: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

When should you involve a developer in your design process?

Work on your communication skills

Page 26: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Immediately.

Work on your communication skills

Page 27: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

...Or a least before you show any designs to your client.

Work on your communication skills

Page 28: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

What’s their process?Go over your developer’s process and how you fit into it.

Work on your communication skills

Page 29: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

What’s your process?Go over your process and how you would like it to work with your developer’s.

Work on your communication skills

Page 30: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

What about giving your developer feedback?Establish a protocol for doing check-ins and reviews.

Work on your communication skills

Page 31: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Giving Handoffs.Double-check your source files.

Work on your communication skills

Page 32: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Giving Handoffs.Try to give handoffs in person, if possible. If not, try video, then phone.

Work on your communication skills

Page 33: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Giving Handoffs.Walk your developer through your psds.

Work on your communication skills

Page 34: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Giving Handoffs.Go over interactions.

Work on your communication skills

Page 35: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Giving Handoffs.Include relevant assets.

Work on your communication skills

Page 36: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Watch this.http://www.geekwire.com/2011/comedydevelopers-designers-communicate/It’s funny.

Work on your communication skills

Page 37: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future
Page 38: Alas, No Mind Meld: Designer-Developer Communication for a Harmonious Future

Thanks.

Any questions?

@melchoyce choycedesign.com