This weekend, I finally found the time to sit down and learn Figma prototyping. I started from scratch with the UI screens below and can happily say that it was a productive weekend session after six hours of dedicated learning. In this blog post, I’ll talk about how I used Figma to make a prototype of my ChatGPT wish list.
It all started with a simple wish list for ChatGPT: pinning chats, bookmarking answers, and copying an entire chat (although I’m pretty sure there’s a limit with the length that can be copied by the OS). I wanted to create a prototype to showcase my ideas, but I had no experience with Figma prototypes.
Using the current ChatGPT interface as inspiration, I decided to start from scratch with three UI screens and got to work. The first thing I realized was that the best way to learn was to just do it. It took me a few hours to get the UI completed, and then I started prototyping interactions, everything started to fall into place. I tinkered with the interactions until I was able to create a prototype that showcased my ideas in a clear and concise manner.
During this process, I discovered the importance of using components and their assigned properties to make the prototyping process more efficient. While I was able to create my prototype using basic techniques, I know there’s a lot more I can do with Figma Prototyping, and I plan on exploring this further in the future.
In conclusion, learning Figma Prototyping through creating a ChatGPT wish list prototype was a success. With some practice and patience, you too can create impressive prototypes that will bring your ideas to life. If you’re looking to learn Figma Prototyping, I encourage you to start small and just dive in. Learn by doing, and don’t be afraid to experiment with different design elements and techniques. With some effort and dedication, you’ll be well on your way to mastering Figma Prototyping.
Link to the Figma Prototype
Screens with annotations
