I then moved onto actually designing the screens that would be on the app. This was where all of the research, defining, and ideation would be brought together into a finished digital product. With the colour palette and typography chosen, it was now time to slowly add elements until I had a product that was ready to be prototyped.
One of the most unique and key features of my app is the fact that there is sticky notes. Other than Miro, I can’t think of many other apps that use these so much. Designing these well was something that is so important, as they are such a central part of the app. I wanted to use a select few colours, so chose 5, meaning that the user can colour code their notes in whatever way they want. I used a semibold font to make the notes stand out. The sizes of the sticky notes can be adjusted, and double tapped to delete. If the sticky has a time set or repeats, this will be indicated on it as well. Using a drop shadow I was able to make these look like sticky notes, and I am quite pleased how they turned out. With these made I could now move onto the screens themselves.
The main screen is the ‘Sticky Notes’ screen. This acts as the home page for the user and is the first screen they are taken to after onboarding. As you can see below they will start with no stickies on their board, but they can use the plus button to add one. The next page shows the screen with some stickies added. There is a hint for users on how to delete sticky notes, which is done by double tapping them. Stickies can be moved around easily and resized or edited by clicking on them. There is also some feedback for stickies that have just been added to provide the user some feedback that their sticky note was added successfully.
The main screen in the app is the ‘Schedule’ screen. This is where the user can see all of their stickies organised and put in a task schedule for them, with this being done by the app. The only exception are the stickies that the user assigns a set time for, as these will be placed wherever the user chooses. Users can also drag and drop tasks into whatever order they want, if they decide that they do want to change the time of that task. Users will receive notifications when it is time to do that task. This way they don’t need to have the app open to still get the benefit of it. Some buttons include a search bar, allowing the user to search for specific tasks, and also a calendar button that allows the user to change the view from daily to weekly.
The next major screen is the ‘Add new task’ screen where the user will be taken to when they click on the plus button. This will take them to a screen where they can type what information they want to be on the sticky, as well as choose the colour of it. If they wish to add a time and repeats, they can do with the buttons below. I wanted to make it as easy as possible for the user to get their sticky note written, so no unnecessary extra steps or features are there to slow down or complicate this process for the user. Once the user is happy with their sticky note, they can press the add button at the bottom to add it to the notice board.
I really enjoyed designing this project, and loved the idea of digitising a physical thing like sticky notes. It was quite challenging to get the final design right but after doing a usability test I was able to make big improvements that helped the navigation and path that the user takes to add a sticky note. I think that the app aesthetically looks great, and gives the playful and colourful vibe that I was going for. Getting rid of Playfair display was definitely a good decision, and has improved the look and feel of the app.