Smart OKR Prototype By Nestor

Here is a simple prototype for personal OKR management, made by ProtoPie and some SVG images only.

Multiple Objectives can be organized in a single Event, every objective have multiple Key Results. Weight, progress, score and description is the basic properties for key results.

You can add tags to a Event, and use tags as filter to find events more quickly in the side menu.

The most important of this prototype is to show how to interaction with real data, not only transition in some static pages. It will make the prototype to run like a real App.

You can find the pie file here:
https://cloud.protopie.io/p/b4b1a88cab
NOTE: online view will cause some bug, download pie file, use ProtoPie player will get better experience.

Use a mobile device to try this Pie will be better than browser, and here is the interaction list

Main page interactions:

1. Pull down to create a new Key Result;
2. Auto calculate weight, progress, score for all key results, include the key results created in run time. And update Objective card automatically;
3. Slide up/down quickly to shrank the objective card;
4. Slide left/right to navigate between objectives;
5. Tap Create card to open new Objective page; (Only UI)
6. Tap Key Result cell to open Key Result Edit page; (Only UI)
7. Edge slide right to open the side menu. This is not a default trigger, so it will not work correctly in a very small chance. The menu button in Navigation bar will open side menu too;

Side menu interactions:

1. Pull down to create a new Event just like main page; (Page jump only)
2. Tap any tag below will set a filter for events;
3. Slide up tag area will show tag panel;
4. Drag any tag will show delete panel, drop any tag there will delete it;
5. Add new tags through Create tag button. All new tags will add to the tag panel, and auto layout as a tag cloud depend on the tag length.

All this functions is based on reusable components.

Data interaction and management, application logic, this is more important than just UI Interactions in a real App like prototype.

ProtoPie can really getting these done elegantly.

So I made this pie, hope you like it.