Pizza Productivity: Feedback for placing pizzas in incorrect workstations

[jugglinmike]

When attempting to place a pizza in an incompatible workstation (i.e. placing a sauce-less pizza in the "Olives" workstation), the user should be informed that this placement is invalid.

@iamjessklein @stevekinney We'll need to decide what this feedback should look like before technical implementation can proceed. Some options:

• A passive message on the workstation itself
• An active overlay dialog

[stevekinney]

I'm leaning towards a passive message considering we don't want to eat up too much time from the countdown clock.

[jugglinmike]

There are many ways we could communicate this information. Some of them involve feed-forward, although I'm not generally fond of those kinds of UIs. I think this is a great opportunity to introduce notifications. Here's an example (pardon the colors--the compression threw them off a bit):

The nice thing about this approach is that it establishes a pattern (both in code and from the user's perspective) for providing event-driven information. That pattern can be re-used across contexts and even across activities.

Here are some examples of how a notification mechanism could be re-used:

• Pizza Productivity
  • Whoops! / You can't switch workstations while you're working on a pizza.
  • Whoops! / That pizza isn't ready for this workstation yet.
  • Whoops! / That pizza has already passed through this workstation.
  • All set! / This pizza is ready for the next workstation. (resolving gh-146)
  • Nice work! / This pizza is complete.
• Supply and Demand of Cocoa
  • The transaction failed. / Make sure that the other party correctly entered your ID and the agreed price.

@cbujara What do you think?

[jugglinmike]

Also, rendering the message in the application header ensures that even short-lived dialogs do not interfere with player interaction.

[cbujara]

Slick. I like it. Any cross-browser issues we need to worry about with this implementation?

[jugglinmike]

Nosir. The demo I built uses CSS3 transforms, but in non-supporting browsers, users will simply see the message appear and then disappear without any animation. Not as fancy, but serviceable.