Liz Harris introduces herself as a product designer at LogMeIn and shares four pillars of effective design collaboration: 1) Discovery is a team sport and developers should be included from the beginning, 2) Align with developers before designing to avoid rework, 3) Learn basic coding to speak the same language as developers, 4) Stay organized by clearly documenting and labeling assets for developers. These pillars have helped Liz collaborate successfully with developers from project kickoff through design handoff.

1.
Product Designer
The Four Pillars of Effective
Design Development Collaboration
Liz Harris

2. Liz Harris
Product Designer,
Hi everyone,
— I wanted to start out by introducing myself.
— My name is Liz Harris.
— I’m a Product Designer at LogMeIn.
— When I first started at LogMeIn , I worked on Xively, an Internet of Things Product.
— Currently I’m working to create experiences for small business owners
on the Grasshopper and join.me product team.
— 3 years ago I graduated with a degree in Graphic design from MassArt (right here in Boston) — and have really discovered a passion for making
delightful, — usable digital products.

3. Design + Development
— I’ve come to realize that our role as Product Designers is not to simply fulfill a task and then hand off the work.
It’s about :
- communicating our thoughts thoroughly,
- and working effectively with other teams.
— We all know design is a team sport, but as a rookie on the team it can feel like
designers and developers are on opposing teams. (add a sporty team image into here)

4. 1. Discovery is a team sport
2. Align. Then design.
3. Speak the Language
4. Stay Organized.
The Four Pillars
*Read these aloud.**
With the Four Pillars I’ve learned to live by as a Product Designer,
collaboration is made simple from kickoff through design handoff.

5. 1. Discovery is a team sport
— The first stage of any project is to do research and uncover the problems that need solving.
— The discovery period is the foundation of co-creation.
— Making sure development is included from this beginning stage is important to building
a good relationship and a good product.
— This way — you are giving everyone a sense of ownership,
and setting the team on the same page to align around a common goal.

6. User Interview Room Setup Live streaming interview
Discovery is a Team Sport
— There are different levels of inclusion UX practitioners can use depending on the problem at hand.
— It can be as simple as setting up a viewing room for developers and other stakeholders
to listen into user interviews and take notes.

7. Discovery is a Team Sport
— It can involve including a developer in a design workshop, white boarding session or design sprint.

8. Research Summaries to share Office wall artifacts
Discovery is a Team Sport
— Circulating artifacts,
— research findings
— and design flows to the greater team through
email, Confluence, or hanging artifacts around the office.
— All of these are examples of ways we can get developers immersed in this initial discovery phase.

9. Validate Ideas Build User Flow Design Kickoff
Discovery is a Team Sport
Process Current Solution
Questions
+ Clarification
— On the Grasshopper team, — I’ve noticed a huge difference in our process—
when our team has a design kickoff with dev vs when we don’t.
— We have stakeholders from product and engineering in the room to walk everyone through a problem we are solving for.
— On Grasshopper, — we recently conducted a design sprint for a problem we wanted to validate.
We included a developer stakeholder in this process. The sprint resulted in proposing a new feature to be built.
To kick things off, we invited stakeholders from product and engineering to meet.
———————
****(click)****
We outlined:
1. The process we took to get to our user flow (a brief summary of our research findings, and the design sprint.)
2. Our current solution to the problem.
Then we opened up the meeting for questions, concerns and clarification.

10. 2. Align. Then Design.

11. Align. Then Design.
Login Extra step?
— By aligning from the beginning discovery phase, we’ve been able to eliminate back and forth time to fix things that have already been
implemented.
— On Grasshopper, we meet consistently with dev and when we come across challenges,
our open dialogue allows us to work iteratively to come up with the right solution.
— While working on a login flow for a new application,
development found a problem with a particular feature’s functionality
once users logged in to the app.
— They proposed that we add an extra step to eliminate this problem.
— Our dev team is great at catching problems in the process
but through further discussion and by pulling data on Grasshopper’s average user,
it became clear that we were creating more complexity by accommodating to an edge case user instead of our average user.

12. Final SolutionFirst solution
Align. Then Design.
— We were able to come to a compromise
and find a solution for the edge user that wouldn’t hinder the majority experience.
— It would have been simple to take the feedback at face value and add an extra step into the login build ———
— But if we hadn’t continuously aligned with development and asked why, the user experience would have suffered —
and our customers would have needed to go through an unnecessary step
every time they logged into their app.

13. 3. Speak the Language
— Learning to code expands your knowledge of the development process,
therefore changing the way you think about what you’re designing.
And just to be clear, — I’m not recommending that designers become front end developers.

14. Speak the Language
User
Designer
Developer
Product
=
— UX is about communication between a product and it’s user.
— A basic foundation in coding ensures
a common language to use when talking about your design with dev.
— Personally —Working with developers on a daily basis was a pain-point for me
when I was first starting out in UX.
— I felt that we were often speaking different languages and I wasn’t always
getting what I needed out of a conversation.
— This led me to take a General Assembly Front End Development beginners course.
—From this I learned HTML, CSS and JavaScript. —
— I’ve noticed a significant change in my ability to articulate ideas to development counterparts and empathize with development tasks and challenges.
— I do not code in my every day for work, —
but have found a basic knowledge of front end code to be a helpful tool.

15. version_control_v4
name_spacing_of_files
this is a commit message.
Speak the Language
— It helps to learn a thing or two from the way Developers operate.
— The version control vigour,
— name spacing of files,
— documenting iterations—
or commit messages, etc.. ——
can only help us get more productive and useful at our job.

16. 4. Stay Organized
… Which brings us into our final pillar: Stay organized.
— Setting expectations by following an organized process —
is key to making everyone’s lives easier —
from kickoff, —
to documentation of work, —
to asset handoff.

17. Stay Organized
Mockups Specs + assets Interactions Copy / content+ + +
—When we hand assets over to development, there are multiple layers of information that need
to be conveyed.
— In addition to mockups, specs and assets, we must also share the interactions and copy. —
— All these cover different aspects of the design solution and need to be collated in a simple, accessible manner.
— Every designer will have a slightly different process for organizing their work.
—At LogMeIn we use a tool called Zeplin (you may have heard of it) as an asset handoff, mockup,
copy and collaborative tool.
— We link this tool to working prototypes to fully demonstrate interactions and user flows.
— We take care to organize and clearly label our assets, —
making everything exportable and by visually identifying key ui tools with clarity.
— We have found that by creating a destination for clearly labeled asset downloads
in the same space as our mockups —

18. 1. Discovery is a team sport
2. Align. Then design. Then do it again.
3. Code to understand and empathize.
4. The power of staying organized.
The Four Pillars
1. Discovery is a team sport
2. Align. Then design.
3. Speak the Language
4. Stay Organized.
These are the four pillars I believe can guide us as designers —
to collaborate openly and effectively with our development counterparts.
I really appreciate your time today.
Again, my name is Liz Harris.
Thank you

19. Liz Harris Product Designer at
Thank you!
Liz.Harris@logmein.com
@lizharrisdesign
Liz Harris
Product Designer