DjangoDay 2012, Brescia, Italy

Using Django Framework for Rapid Application Prototyping.

Transcript

1. Django and RAP Elia Contini Django Day, Apr 21 2012, Brescia (Italy)
2. Design phase (Classic) Wireframes Client interview / validation Graphic Designer, etc. Note: this is a simplified schema UX Designer Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
3. Design phase (Classic): side-effects Wireframes • They give no sense or insight into flow. • They have to be created at various different screen sizes to account for how customers will actually see them. • The client won't see them in their native element. The context is wrong. 3 Feb 2012 - Wireframes are Dead, Long Live Wireframes, ZURBlog Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
4. Design phase (RAP) Prototypes Client interview / validation Graphic Designer, etc. UX Designer, Front-end Dev Note: this is a simplified schema Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
5. Design phase (RAP): side-effects • Widgets themes can distract client and create false expectations • Less creativity • Time and effort Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
6. Case study: MR. EDU [1/3] Users elementary students, teachers and parents Main goal define a method to design and develop web apps for educational activities Methodology Ethnographic study, Personas and Scenarios, Prototyping, User test Time constraint No Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
7. Case study: MR. EDU [2/3] Technologies Python + Django, HTML5 + CSS, RDF (rdflib) Step 0 Wireframes and workflow definition Step 1 (Django Template Layer) Workflow improvements and multi-device testing Step 2 (Django ORM) Database design and backend implementation Source: http://code.google.com/p/mr-edu/ Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
8. Case study: MR. EDU [3/3] Conclusion • focus on process and users • rapid release of functionalities (~15 days) • users always involved in the implementation / design • debug time → 0 • desktop and tablet version available at the end of the process Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
9. Further reading • The Death of the Wireframe? Towards An Integrated Approach to UX Design http://www.fabernovel.com/en/blog/284-the-death-of-the-wireframe-towards-an-integrated-approach-to-ux-design • Prototyping, Todd Zaki Warfel, Rosenfeld Media, 2009 • Sviluppare applicazioni con Django, Marco Beri, Apogeo, 2009 • Python, Marco Beri, Collana Pocket, Apogeo, 2007 • Design with Progressive Enhancement, Parker et al., New Riders, 2010 Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners
10. Thank you! Grazie! Vielen Dank! GitHub: @EliaContini Twitter: @EliaContini Blog: blog.eliacontini.info Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License All trademarks and registered trademarks are the property of their respective owners