Interactive Prototype ReportFor the interactive prototype, we used Hype, a designer-friendly authoring tool for HTML5 interactive Web content, for animate and interact with our prototype. It is a keyframe-animation system that allows users to create and record objects that move across the screen. It supports CSS3 styles and JavaScript for object manipulation. Therefore Hype helped us focus more on the interaction content than the details of coding as it generates HTML5 and Javascript for our prototype automatically.
For our scenario tasks, we used JQuery UI to make the tabs for each different scenario. It was really easy and straightforward to separate each scenario task.
Hype was really good for recording animations and replaying it. However we cannot control how specific mouse interaction like dragging the graph in the track progress section to see past and future dates. Furthermore we cannot insert custom HTML so we can type with the keyboard entering the username for example.
We have only implemented actions and features that are part of our scenarios since it covers the core features of our application so people can get a sense of the unique features of the app.
We omitted the extra features not because of technical limitations but because we considered they were future functionality and we try to limit to scope of our prototype for the time allotted. We chose not to implement checking in a place, finding who’s here, adding a friend, viewing the inbox or viewing the privacy policy because we think they already know from using Facebook what those functionalities are.