Webmaker/Design Research: Difference between revisions

 
(30 intermediate revisions by 2 users not shown)
Line 1: Line 1:
== The Webmaker Design Research Lab ==
== MoFo Design Research Lab ==


=== What is Design Research? ===
=== Summary ===
[[File:WhatIsDesignResearch.png|850px]]
[[File:DesignResearchDefinition.png|850px]]
[[File:FromCodesign.png|850px]]


Design research refers to an array of methods which can be applied to provide essential data on user experiences '''throughout the life of a product, prototype or community development process''' (ie Webmaker!). Designers and developers are increasingly employing these techniques in product development, and the result is often tools that better serve users' needs.  
Design research refers to an array of methods, from user testing to codesign, which are applied to provide essential data on user experiences '''throughout the life of a product, prototype or community development process'''. Designers and developers are increasingly employing these techniques in product development to better serve user needs. At the Mozilla Foundation, many of our products have matured to the point that we can now apply core design research approaches in order to better inform each product's development process from conception to final launch.


At the Mozilla Foundation, many of our products have matured to the point that we can now apply core design research approaches, such as '''user testing''' and '''co/participatory design''', in order to better inform each product's development process, from conception to final launch.
The Mozilla Foundation staff leading the progress of this initiative are '''Karen Smith, Kat Braybrooke, Emily Goligoski and Chloe Varelidi''', with collaboration from User Research and Insights teams at the Mozilla Corporation and various in-house designers who have kindly offered their designs, recommendations and guidance.


The Mozilla Foundation staff who are leading this initiative are '''Karen Smith, Kat Braybrooke, Emily Goligoski and Cassie McDaniels''', with collaboration from User Research and Insights teams at the Mozilla Corporation and various in-house designers who have kindly offered their designs, recommendations and guidance.


[[File:DesignResearchPresentationSlides.pdf|framed|center|Design Research Lab: An Introduction]]
==== Our Design Methods ====
 
Here are a few diagrams which explain the traditional methods used by design researchers. Past efforts have '''looked a lot like the first example (ie chaos!)''', but we intend to culminate findings from our activities into one coherent and organized offering in 2014, and are holding weekly meetings to achieve this.
<gallery>
File:DesignResearchDiagram.jpg|All Processes
File:DesignResearchIterativeDiagram.jpg|Iterative Process
File:DesignResearchcumulativeDiagram.jpg|Cumulative Process
File:DesignResearchConvergentDiagram.jpg|Convergent Process
</gallery>


=== Design Research Lab Method #1: User Testing ===
=== Design Research Lab Method #1: User Testing ===
[[File:PrototypeFlow.gif|300px|right]]
User testing is a term that typically describes a research process to understand how users interact with a design. To conduct user testing, you need to have a prototype or design to test with users. 
==== User testing characteristics ====
*  Places a prototype (paper or digital) or product in front of a user
*  Features distinct roles for participants, researchers, and facilitators
*  Assumptive: Is testing if an existing design works
*  Researcher analyzes the data from the participants and generates the results
*  Involves users completing tasks through the use of a prototype or product
==== User testing methods ====
*  Usability tests
*  Surveys
==== Sample user testing methods at MoFo ====
*  Appmaker Technovation [https://emgollie.makes.org/thimble/LTkyNDUxNjM1Mg==/technovation-appmaker-session-teaching-kit-template on-site testing] (Emily Goglioski)
*  Hive Labs [https://docs.google.com/forms/d/1efktnCUV7qZPV41d_0zy6p8D0OF1VeaEhYs9WYht2jA/viewform platform usability survey] (Kat Braybrooke)


=== Design Research Lab Method #2: Co/Participatory Design ===
=== Design Research Lab Method #2: Co/Participatory Design ===
[[File:DifferentDesigns.gif|460px|right]]


Codesign is a term that describes collaborative approaches to product research where the '''boundaries between users, designers and researchers are intentionally blurred'''. The term codesign overlaps with that of [http://cpsr.org/prevsite/program/workplace/PD.html/ participatory design], where many early projects occurred in Scandinavia in the early 1980s as new technologies were being introduced to workplaces and trade unions, workers and designers collaborated to ensure workers were not negatively impacted by the introduction of new technologies.
Codesign is a term that describes collaborative approaches to product research where the '''boundaries between users, designers and researchers are intentionally blurred'''. The term codesign overlaps with that of [http://cpsr.org/prevsite/program/workplace/PD.html/ participatory design], where many early projects occurred in Scandinavia in the early 1980s as new technologies were being introduced to workplaces and trade unions, workers and designers collaborated to ensure workers were not negatively impacted by the introduction of new technologies.
Line 26: Line 60:
* Projects may range from being more "practical" (oriented towards practicality?) with the purpose of building products or content, or "conceptual" to build our skills and knowledge about codesigning with the community.
* Projects may range from being more "practical" (oriented towards practicality?) with the purpose of building products or content, or "conceptual" to build our skills and knowledge about codesigning with the community.


==== Suggested implementations ====
==== Codesign methods ====
* A codesign research phase embedded into '''every''' project and prototype across the Foundation, to ensure in-depth data gathering in each stage of the agile process;
* Immersive participatory design workshops, including creative activities and making materials. Tools may include sticky notes for jotting down ideas, whiteboards for sketching, idea-inducing exercises like charettes. Outputs range  from paper prototypes to full-scale reports;
* Qualitative data-gathering to gather on-site user experiences, with researchers embedded at events and makerparties, including participant observation and on-site ethnographies.


==== Example codesign projects and ideas ====
* In-depth data gathering about participant experiences at an event or during an interaction, notifying participants so they are '''partners''' in this work;
* Immersive and participatory workshops, including creative activities and making materials;
* Tools may include sticky notes for jotting down ideas, whiteboards for sketching, idea-inducing exercises like charettes. Outputs range from paper prototypes to full-scale reports;


* [http://www.priv.gc.ca/resource/cp/2014-2015/cp_bg_e.asp Co-Designing Open Badges for Privacy Education with Canadian Youth] (upcoming 2014 - 2015) 
==== Sample codesign projects at MoFo ====
* [http://blog.kaibray.com/post/76615169574/a-mozilla-winter-web-makers-co-designers-and Blog post: Codesign at Webmaker]
* [https://blog.webmaker.org/lets-teach-the-web-offline Proposal: Let's Teach the Web, Offline]
* [https://etherpad.mozilla.org/codesignthinkbig Telefonica Teaching Kit codesign workshop] (Etherpad)
* [http://emilygoligoski.com/2014/02/12/research-reads-you-shouldnt-miss/ Blog post: Research reads]
* [http://emilygoligoski.com/2013/12/11/introducing-open-badges-user-profiles/ Blog post: Community co-designed personae development for the Open Badges project]


=== Progress ===
* [http://www.priv.gc.ca/resource/cp/2014-2015/cp_bg_e.asp Co-Designing Open Badges for Privacy Education with Canadian Youth] (upcoming 2014 - 2015, Karen Smith) 
* [http://emilygoligoski.com/2013/12/11/introducing-open-badges-user-profiles/ Codesigned personae development, Open Badges] (Emily Goglioski)
* [http://blog.kaibray.com/post/76615169574/a-mozilla-winter-web-makers-co-designers-and Blog post: Codesign at Webmaker] (Kat Braybrooke)
* [https://blog.webmaker.org/lets-teach-the-web-offline Let's teach the web offline] and [https://blog.webmaker.org/lofinofi Lo-Fi No-Fi Kit codesign] (Kat Braybrooke)
* [https://etherpad.mozilla.org/codesignthinkbig Telefonica codesign workshop] (Kat Braybrooke)


Want to get involved in getting the Webmaker Design Research Lab started? Start below:
=== Weekly Research Meetings ===


* Help draft our next activities: https://etherpad.mozilla.org/webmakerdesignresearch
The Design Research Lab meets '''every Thursday at noon PST'''. All interested participants are welcome to attend and go through findings and methods with us. Meeting notes can be found on [https://etherpad.mozilla.org/user-research-roar](the User Research Roar Etherpad).
* Leave comments/suggestions on the Bugzilla task bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1004540
Confirmed users
273

edits