The next stage of the development process for my project was to start doing some wireframes and think about what the app could potentially look like. I will start with sketching and work my way through to high-fidelity Figma wireframes and this is to help ensure that I keep my options open at this point and explore fully what the screens will look like.

Paper Sketching

Starting with paper sketches, I thought about what some of the main screens would look like. This was done with the inspiration of other competitors as well as the users needs in mind. There was 4 main screens that I wanted to start sketching, and these were: Home screen, sticky notes screen, calendar screen, and add sticky note. As the project develops there will be more screens that are needed along the way, but for now it is enough to get the core screens down on paper.

IMG_2964.jpeg

IMG_2965.jpeg

IMG_2966.jpeg

IMG_3116.jpeg

IMG_3117.jpeg

Mid-Fidelity

After sketching my ideas out on paper, it was now time to take them into Figma and create them digitally. I will start with mid-fi screens with basic colour and typography, and eventually work my way through until the screens are polished and high-fidelity. I started off by giving my frames a grid that would be used throughout all the screens. This will help with the overall layout and consistency of all the screens. Getting the basic elements down on the screen with just shapes and text has really helped me understand how it might look and is great for this stage to bridge the gap between my initial ideas and what the final version will look like.

Screenshot 2025-03-11 at 12.07.10.png