P4
Hi(er)-Fi Prototype
This project milestone involved the revision of our lo-fi prototype into a med-fi prototype, developing a hi-fi prototype based on the heuristic evaluation feedback on the med-fi, and coding a partially functioning prototype in ReactNatve. The full documentation of these steps in the process can be read here. The information provided below serves as a brief overview of this milestone.
Revision of Lo-Fi
Based on the feedback we received from our usability testing at the end of P3, we made changes to our lo-fi Figma prototype in order to turn it into a med-fi prototype. We started by drawing some new sketches to brainstorm how to incorporate the feedback we received during the testing into our next prototype. The main changes that we made included moving the new post button to the bottom navigation bar so it does not cover up any of the feed. Additionally, we changed the contacts tab to a message tab because users felt that the contacts tab was unnecessary and could be replaced by accessing a "friends" list on their profile page. Finally, we adjusted some of the wording in the app to make its meaning more intuitive and added additional functionality to increase user control and freedom. Some examples of these changes are illustrated here. You can also test out our med-fi prototype by clicking on the button below!
Revision of Med-Fi
Based on the feedback we received from our heuristic evaluation during P5, we made changes to our med-fi Figma prototype in order to turn it into a hi-fi prototype. The main heuristics that our evaluators found to have been violated were Error Prevention, User Control and Freedom, and Help and Documentation. Some improvements that we made included adding an "Information" page and extra error checking when a user presses any cancel button. Finally, we incorporated a more consistent design into our prototype. Here are some examples of the revised screens and you can test the hi-fi prototype by clicking the button below!
Partially Functional Prototype
Our partially functional prototype was developed in ReactNative. We decided to implement our simple task of scrolling through the feed and making a post. We also implemented the navigation bar. Although the only functional pages are the home/feed page and the new post page, the navigation bar is still functional for the message, group, and profile screens. These screens are static and hard-coded, but they are meant to give users an idea of what a functional version of these screens would look like. Here are some screenshots of the application being run on an iOS simulator and a demo video of one of us navigating the application.
