Prototyping in Figma

Lately, I’ve been experimenting with one of the most popular prototyping tools, Figma. It has a very steep learning curve (especially if you have an Adobe background, as the shortcuts and mechanisms work pretty much the same), and we can quickly draw high fidelity wireframes from scratch to show the clients how the actual product will look like.

You can have a look at my dashboard mockup here. No actual data is needed in this step of the design process, it just gives the idea how the report will look like and function to the business users. You can add interactions to the Figma prototypes, so in this case, if you select on the hamburger menu, a filter pane pops up, or by clicking to the calculator icon you can navigate to an info page. This way you can limit the number of changes need during the dashboard development phase, as in this stage of the process, you can already agree on the scope of the project.

Landing page of the prototype (using dummy data)

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.