how to keep design and development on the same page
TRANSCRIPT
![Page 1: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/1.jpg)
One Vision
How to keep Design and Development on the same page
Mitja Simcic
@UX Eye, 8/18/15
![Page 2: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/2.jpg)
About ROI·DNA
![Page 3: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/3.jpg)
![Page 4: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/4.jpg)
Communication
![Page 5: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/5.jpg)
Handoffs
• Inconsistency• Inattention to detail• Lack of
organization• Poor awareness of
the tools being used
• Good ol’ laziness• Too little and/or
terrible communication
![Page 6: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/6.jpg)
Go Lean or Go Home
![Page 7: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/7.jpg)
![Page 8: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/8.jpg)
Workflow
![Page 9: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/9.jpg)
New methodologies & ideas
![Page 10: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/10.jpg)
Content modules
![Page 11: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/11.jpg)
Next steps
• Content module library• Wordpress framework• Color palette• Grid systems• Styleguides• Fontguides• Not just mobile, design for hi-res as well
![Page 12: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/12.jpg)
Communication
• Notes about everything• We never, ever assume• Use naming conventions• Checklists• Retrospectives• Understand eachother’s constraints• It’s not only designers and developers but
everyone involved with the project (marketing, ux, project management, clients)
![Page 13: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/13.jpg)
Tools
• PSD: Assets.adobe.com Specctr Ink (http://ink.chrometaphore.com/) Photoshop: Layers, Linked Smartobjects with Layer Comps
• Sketch: zeplin.io
• Browsers: PerfectPixel extension
![Page 14: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/14.jpg)
Developer’s mind
• varying constraints of the technologies we’re developing for
• best-practices• future-proofing• building efficient code• developing a manageable application/website
![Page 15: How to keep Design and Development on the same page](https://reader034.vdocuments.net/reader034/viewer/2022042723/58f08d961a28ab7d108b45e3/html5/thumbnails/15.jpg)
Create Good Habits by Jason Lengstorf
• Deliver consistent designs• that are fully thought out• and well-organized• using the appropriate tools• and without getting lazy.
Then, discuss it like besties.