Wednesday, April 30, 2014

Prototype: Evaluating Prototypes that we make at Mozilla

I am at the Mozilla annual All-Hands meetup in San Francisco this week. I made this quick animated gif to explain this idea that I have had in my head for a while. One problem I have for evaluating the prototypes that I make at Mozilla is really figuring out if the prototype matches the design values of Mozilla. I quickly drafted this idea for a widget that can be dropped on to any web-based prototype for contributors to help me to see how aligned with the values the concept is (or isn't).

Just in case the gif was a bit too fast for you to see the interaction, here are some stills of the process:

Step one: a prototype - maker (whether that's a Mozilla employee or a Mozillian) puts the e-VALUE-ator * widget on to their prototoype.  * = working title, probably won't stick :)

Step 2: a prototype user will hover over the widget, it spins to get their attention and then turns into a clickable button:

Step 3: after click the button, this screen will appear - asking the user to choose which Mozilla design values this prototype embodies.

Step 4: After a user submits the values, a confirmation screen will appear, showing the user a graph-i-fied version of the widget, reflected their feedback. Additionally a user can then look at the birds eye view feedback on the prototype from many contributors etc. or, if they are motivated, give long form feedback in a comment field.