Designing with Elements and Modules

These are the slides from my first talk. Based on the .Net article I wrote, these slides explain my thoughts and process for designing with elements and modules.

Transcript

1. DESIGNING WITH ELEMENTS & MODULES Chris Allwood Erskine Breakfast 29/08/2013 Chris Allwood - Designing with elements & modules - 2013
2. Chris Allwood - Designing with elements & modules - 2013 SECOND WEDNESDAY organiser digital designer
3. My early idea of a Designer: - Visual Designer Chris Allwood - Designing with elements & modules - 2013
4. The role of a Designer: - Visual Designer - Front-end Development - Wireframing Chris Allwood - Designing with elements & modules - 2013
5. The role of a Designer: - Visual Designer - Information Architecture - Interaction Design - Usability - User Research - Content Strategy - Front-end Development - Prototyping - etc.. Chris Allwood - Designing with elements & modules - 2013
6. Chris Allwood - Designing with elements & modules - 2013 Designing In the browser? In Photoshop?
7. As we strive for ways to improve our processes, work more efficiently and deliver better products, designing in the browser has become a way of getting into the browser sooner and removing our dependency on signed-off PSD deliverables. Chris Allwood - Designing with elements & modules - 2013
8. There are plenty of positives to this approach, and I believe it highlights many of the problems with our reliance on graphics editing software. Chris Allwood - Designing with elements & modules - 2013
9. Our current processes are often flawed. Fear of change / reluctance to accept new processes / difficulty to monetize new process / set in our ways. We take leaps of faith forward, yet some current suggestions have not fully satisfied our own or client needs. Chris Allwood - Designing with elements & modules - 2013
10. My Suggestion Chris Allwood - Designing with elements & modules - 2013
11. Modularity Work smarter, break things up, Chris Allwood - Designing with elements & modules - 2013
12. Play to strengths Do as little as feasibly possible, don’t repeat yourself. Chris Allwood - Designing with elements & modules - 2013
13. Wireframes Let them do the legwork, identify issues early. Chris Allwood - Designing with elements & modules - 2013
14. Styleboards They paint the bigger picture Chris Allwood - Designing with elements & modules - 2013
15. BEM It's more than just a way to modularize the development of pages. Chris Allwood - Designing with elements & modules - 2013
16. Elements buttons, inputs, links etc Chris Allwood - Designing with elements & modules - 2013
17. Modules, Blocks, Molecules.. Groups of elements. Chris Allwood - Designing with elements & modules - 2013
18. We've already seen front-end development take on a similar approach. Chris Allwood - Designing with elements & modules - 2013
19. Identify the unique Because modularity can breed boring. Chris Allwood - Designing with elements & modules - 2013
20. Plan like an Information Architect Create like a Visual Designer Build like a Developer Chris Allwood - Designing with elements & modules - 2013
21. Thank you Chris Allwood - Designing with elements & modules - 2013