Our next step in the process of creating our websites is to create a prototype on Figma, which I have been building and working on in the previous weeks through my research, sketching and mock-ups. I used these mock-ups on Figma to begin adding animations and interactions, and placed my designs into a suitable frame to be seen in a desktop.
My designs went through a few small changes during this process, such as changing the positioning of certain text boxes and headers. It’s interesting to see how a design can change once you begin putting it into actual use. I think these changes were beneficial before moving my design into the actual thing – webflow.
This is an image of my Figma workflow, which consisted of a variety of different frames due to changing colours of text.
Here are the individual screens for my website:
I grew familiar with prototyping using Figma during my last project, so I didn’t find much difficulty during this part of the project. One of the main difficulties I had during this part was encouraging myself that my own designs were good – it becomes hard sometimes as a designer to step away from your work and look back on it with a fresh pair of eyes.
As a solution to this, I was able to present my site prototype to friends and family, and received pretty much mostly positive feedback from them. This was very useful in encouraging me to continue down my route, as I was feeling – not bored, but pretty stuck with my designs.
This was useful as a last reflection before moving onto the real thing – webflow. This will be my next step in the project.