The final stage of this project was to prototype the app and tie it all together in a working prototype. I was looking forward to making the app interactive and usable, to see my work come to completion.
I created a component library to store all my re-usable elements in. This helped me design quickly and be consistent, being able to re-use elements easy and swiftly. This is something I have gotten used to doing in recent projects, and it definitely helps me a lot to be more organised in my design file. I also used variables in Figma to give me more control and power over the elements in the file, allowing me to change a lot of components and elements at once.
I used overlays in this project to create pop-ups that give the user feedback when they fill out a checklist. I thought that it was important that once a user completes a checklist that they get a feedback message that assures them that the checklist was actually completed. The user can simply click around the pop-up to close it. With the use of icons and text the user can quickly understand the message then move on. Although this seems like quite a small touch I believe it is important to give the user feedback so that they can have assurance that the action they just completed actually done something.
The cameras screen is probably the most interactive screen on the app, with two main interactions that I am quite proud of. The first one is a drop down arrow that allows the user to see more areas of the house. The user can now either swipe across to get to the area that they want, or they can hit the arrow to show more areas. Clicking the arrow again will go back to showing just the top row of areas with cameras.
Another interaction on the cameras screen was the ability to view a specific camera, with extra controls such as pause, rewind, full screen, and volume. This means that the user has more control over their cameras, and can not only view them but look back at what has happened. This would be particularly useful if they want to go back to a certain time to see an event that has took place.