Mozilla Developer Network Redesign: UX Workshop

Holly Habstritt Gaal

The following post is an example of how the Mozilla websites team is improving how we implement research, A/B testing, and metrics-validated solutions into our process. This allows us to learn from our users and produce work that we are confident will support our community. As we treat the Mozilla web as we would a product, we are able to work iteratively and react to the ever-changing environment that supporting our Mozilla products brings.


MOZILLA + DESIGN GYM WORKSHOP COLLABORATION

Mozilla teamed up with The Design Gym to hold a 3-part UX workshop in NYC. The workshop was unique in that it involved participants, or “solvers”, that had an interest in a particular challenge that Mozilla is working on.

For each workshop we invited expert guests to participate and add new thinking along the way. We had a great mix of beginner-level coders, self-taught experts, and designers who would like to improve their coding skills. The first workshop was held at the startup accelerator, TechStars, where we were joined by technical and creative founders. We interviewed TechStars members and they joined in design thinking exercises. For our second workshop we invited students from the MFA Design and Technology program at Parsons who brought their knowledge of creative coding and physical computing to the group. For the final workshop we were joined by members of the MDN team who participated in the final steps of the workshop and also gave feedback on the final presented solutions.

OUR CHALLENGE

We used the following challenge as the subject of our workshop: We are working on a redesign of the Mozilla Developer Network. We have an excess of valuable content, code demos, code challenges, documentation, a large and dedicated developer community, and a common goal of supporting the open web. MDN also offers content and participation on a global scale. At MDN you can be at a beginner level and learn from the community, or as an expert, contribute your skills to Mozilla. The key issue is that this content is currently presented and organized without the community in mind and how they would use MDN as a resource. Developers & designers are the MDN community, and the experience should reflect how they would use it.

The first workshop allowed the participants to learn about our challenge, community, and content. This knowledge allowed them to deconstruct and understand the problem in the second workshop and eventually focus on arriving at tangible solutions in the final workshop. It is quite a large endeavor to try to solve for everything needed in a site redesign at the end of 3 workshops, so I asked the teams to focus on 5 key topics:

  • Trust
  • Communication
  • Continuity
  • Functionality
  • Notoriety

To help the workshop participants stay on the right path, I captured key points, quotes, and feedback from the MDN community along the way. At the beginning of each workshop I presented this feedback, what we have learned so far, and topics to focus on for the session. The Design Gym leaders guided the participants through exercises that resulted in both interesting questions and solutions.

If you are interested in details about what we learned along the way and pictures of how our post-it notes turned into tangible ideas, I have posted workshop summaries on my personal blog. The workshop was divided into the following sessions, each lasting 3 hours:

VALUE

This workshop was invaluable to learning more, not just about the current MDN community, but about the needs of learners in general and how they collaborate with one-another. In the workshop we identified:

  • benefits of the symbiotic relationship that occurs between experts and beginners
  • how to surface back-channel communication on MDN, like IRC and mailing lists
  • ways to make learning more human
  • how to bring more value to MDN, not by creating more content, but by creating continuity between the content we already have
  • how to facilitate both active and less-assertive participants from all levels
  • how to keep our community both transparent and trustworthy

NEXT STEPS

  • identify bugs and short-term solutions for testing in the first half of 2013
  • create a series of wireframe mock-ups to present as possible solutions
  • create a phased approach to redesigning MDN in 2013
  • begin creating necessary content, features, and tools

Categories: UX