Why you should build your portfolio on Figma, now

Farhan Ramadhan
UX Collective
Published in
7 min readNov 22, 2020

--

As a product designer, you want to showcase your design work. But oftentimes, we are confused about how we should show it. Should I create my personal website? What if I don’t really understand about web deployment? What if I don’t have that much money to build it? Oh, I think Notion is the trend now. But isn’t it too formal for me? and so on. The question keeps arising without any real effort from us, to really build the product.

Apparently… This condition also happens to me lately. Start question things, without any answers and any solutions to it 😅.

Isn’t that an irony, when you are a product designer, who works for a living just to solve other people’s problems, but can’t even solve your own problem?

After realizing it, I begin to take some real actions by reading some articles about how I can show my work properly whilst also solving my problems. Building a dynamic portfolio that has a lot to offers, with the least cost (money and skills).

Here it comes, the mighty Figma

So as my mini-research goes, I stumbled upon one of the latest Figma’s product announcements, which was Figma Link.

As the background, they provide a filled-workspace that contains information about Figma Link and how powerful it’s if you can use it on your Figma file. Which in my personal opinion, is a great way to announce new things. Using your own product, to actually announce something new about your product. (Go check it out here if you haven’t see it)

I start to wonder, why I haven’t seen any portfolio that uses Figma as their platform? I came to a realization that today’s Figma, is sooooo powerful compared to the Figma that I met years before. You can create a great prototype with lots of interaction on it, you can also include an actual link and open in the prototype, you can also create vector inside your Figma file, and there are many more. Ah! And the most important thing is, you can have a powerful design tool without paying anything (of course, apart from your internet!). And their improvement is not finished yet. So, can you imagine how powerful it is in the next 5 or 10 years from now?

So I changed my question to this: Why I don’t create my portfolio using Figma prototype?

I begin my journey, to find the answer to my own question. Instead, as I move forward, what I found along the way makes me even more confident on building my own portfolio in Figma. So, here are some findings that I’ve found while building my own portfolio with this mighty creature called Figma:

1. Future starts with an “F” word, so does Figma

Frankly speaking, Figma is one of the trends now, especially in UI/UX Design. Why do I have the guts to say this? It’s because lot of designers from big companies are starting to migrate to this app. Collaboration also plays a big role for making Figma as the future of design tool. If you don’t know, Figma opens their application to their communities so they can build their own product inside Figma. You’ll find a bunch of helpful plugins, design reference, even a fancy design system.

Not only for designing your product, some people also starting to build their presentation deck, illustration design, even value proposition canvas in Figma. So, it’s safe to say that, as a design tool, Figma is really an all-around design tools. At least for me.

Still not sure? I believe it’s the right time for you to really try it, so you can be sure about it. Perhaps for your next project? besides, It’s not a sin if you want try it, right? 😏

Show the animation of Figma Community exploration
Preview of the interface of Figma Community — where you can find and grab anything that you need

2. Portfolio in Figma is environmental-friendly: Reduce, Reuse, Recycle

First of all, Reduce

  • Storage
    Compare to other apps, Figma doesn’t consume your storage. All of the files that you’ve created will be saved on the cloud. So, when you create your portfolio here, you don’t need to buy any hosting or a cloud storage to save it. Just share your portfolio’s link and let Figma do the magic for you.
  • Cost (Money)
    Figma offers freemium package, so you can access all of its features without any costs, including their prototyping tools — which used for your portfolio. So, if you want to build your portfolio here, It’s safe to say that it won’t take any of your money. At least for now 😁.
  • Skills
    It doesn’t mean Figma reduce your skills. But what I mean is Figma reduces the amount of skills required to build a portfolio. You just a need basic knowledge on how to operate design tools, the content, and some determination to build your own portfolio on the web.

Then we Reuse

Figma offers a way for you to design a reusable components, and it’s called Components (Similar to Symbols in Sketch). By this, you don’t need to create a lot of components. So, you can simply create a component that will be copied (reused) to lot of pages that you want. As easy as that.

And don’t forget to Recycle

As a designers, it’s good to archive all the things that you’ve created, not to delete it completely from this world. Who knows it could be good for your next portfolio or other project? And Figma offers this by not giving any limit to project storage, even in their freemium package.

3. Figma can move, so let’s make our Portfolio dance

One of main tools that really helps you to create your portfolio is Figma prototype. This is Figma’s main differentiator compared to other platform (Notion for example) if you want to build your portfolio. It’s because Figma allows you to really move your product. From one page to other page interaction, drag interaction, scroll interaction, GIF animation, even a delayed interaction. So I think this potential could be very beneficial if you can maximize it.

By this, you can make your own portfolio dance and feels alive *play September by Earth, Wind & Fire in the background*

Preview of my portfolio dancing around — hanra.xyz

4. In Figma, you can be yourself #NoFilter

I guess, nobody likes to pretend like someone else right? By creating your Portfolio in Figma, you could make it as personal as possible, without any limitation (again, compared to Notion). I believe it’s an important thing for designers to show their true colors, visually. Not just by an image or a text that respresent it.

Now… it’s your turn. What are you waiting for?

Show your true self to the world so they know what kind of designer you want to be with Figma prototype~

Looking back and moving forward

  • Overall I do enjoy creating my portfolio on Figma prototype. Even though I’ve found some issues that can’t be solved at this moment, but it’s still a fun experiment for me. My suggestion for the designers who are still confused on where they should build their portfolio: Go try Figma!

Some feedback for Figma team

  • Figma can’t have a hover and scroll interaction at the same time
    When you hover, you can’t scroll. As I saw in some posts, Figma is considering more to improve their prototype, so I guess it’s just a matter of time. Let’s see!
  • One view only prototype
    Instead of mobile-view only or desktop-view only, I hope in the future Figma can consider enabling the responsive view. It would be very helpful and powerful at the same time.
Preview of people moving forward while looking at their back using a skateboard
Source: Giphy

A little cherry to your beautiful cake

  • Make sure to resize your ultraHD-consumed big storage image
    Keep in mind that when other people open your prototype, it typically loads all the screen at once. People don’t want to wait for too long fellas, especially when your design is not worth the wait. Kidding 😂.
  • Make it looks like you own them
    Combine it with link shortener or even your domain and add your name on it to make it more you. You can use bit.ly or any others link shortener. In my case I bought a domain and combine it with short.io to rebrand the url link.
  • Make it looks like a real product
    One more thing that you can do is to add &scaling=scale-down-width&hide-ui=1 at the end of your shared link. It’ll remove the toolbar and rescale the zoom so it looks more like a real product, not a prototype.

If you are wondering. This is my portfolio hanra.xyz ✨.

Notes: I’m not a Figma ambassador. I don’t get paid either by them. I just love it. That’s all.

Show the ending of a cowboy movie — a riding his horse
Source: Giphy

I guess this is the end of the story. But I’m pretty sure this is not the end of our relationship. So if you want to share your story or just want to know me more feel free to send this guy a message on farhanraa@gmail.com 👋.

The UX Collective donates US$1 for each article published in our platform. This story contributed to Bay Area Black Designers: a professional development community for Black people who are digital designers and researchers in the San Francisco Bay Area. By joining together in community, members share inspiration, connection, peer mentorship, professional development, resources, feedback, support, and resilience. Silence against systemic racism is not an option. Build the design community you believe in.

--

--

Product and UI UX Enthusiast. Together designing the future with technology.