When I got the initial ideas of wireframes, site map, and user flow created, it was time to start designing and developing the screens to see what a potential final product could look like.
I first started off by doing a Mid-fidelity wireframe of the core screens, to get a base skeleton to build upon. This helped me visualise and put together the wireframes and the site map. At this stage I was only using monochrome or greyscale colours, and a basic typeface. They can be added as I build upon the design and add more detail. The two main flows are cameras and checklist, and getting these mid-fidelity screens made has been great as I can now visualise and understand how the user will navigate and interact with in each screen.
Throughout the design stage I wanted to focus on UX writing, and making sure that there was a consistent writing style and tone of voice across the whole app. Since my app was all about home security, and this is something that is quite serious, I wanted to use concise yet useful language. This meant that there wasn’t any humour or slang used, but instead I kept it clear and simple, using plain English. I used https://hemingwayapp.com/ to ensure that my sentences and languages were written in the simplest and best possible way.
Here are my final screens that I designed by applying colour and typography. The screens mostly stayed the same from the mid-fi screens, which added details and features when necessary. I wanted to keep the app to be easy to navigate around, with no unnecessary features or pop-ups that may hinder or distract the user to do what they need. Using images and icons helps the user understand what they are reading and guides them through the flow of either checking their home cameras or completing a checklist. The app is super easy to understand and having purple as the primary CTA button colour, the user intuitively knows that key features are in this colour. Users can also have a quick glance at their cameras without having to complete many interactions, allowing for quick and easy access to their home cameras and some events that have happened in an organised timeline. The checklist screens have a similar layout and format throughout, and this gives a sense of familiarity to the user, allowing them to learn the app quickly. Below are the core screens from the app.
