How I Made a Portfolio in Framer in 1 Week

Hello! Vlad Kalashnikov is at the keyboard, Senior Product Designer at the Re:Luna startup, before that he worked at MTS and Pinkman. I have been doing design for 6 years and product for 4 years. Recently in his telegram channel wrote about how I made a portfolio in Framer. I decided to write a slightly more extended mini-article on this topic with pictures.

I've wanted to put together a decent portfolio for a long time now. At first, I had one on Behance, like all aspiring designers. Then, at the beginning of 2023, I put together Notion, and last week I started working on a website. In this mini-article, I'd like to share my experience and tell you that putting together a portfolio in Framer is quite simple.

I'm attaching it right away link to portfoliofor those interested. And a small disclaimer: This is an MVP version of the portfolio, which I will be refining in the future and writing cases. But for now, the current implementation is quite enough for me as a business card site.

1. I started with a small portfolio research. Here's where I looked at them:

2. Then I sketched out the structure of my future portfolio site

3. Then, in the evening, I threw together a design and inserted content from my LinkedIn

As for the design, I decided to show everything I've done over the past 2-3 years on one page in the most compact form. Since people who look at it usually don't have much time and they don't have time for fancy portfolio design. I also plan to add an English version, write a couple of cases and lock them with a password.

4. For assembly, without thinking twice, I decided to use Framer

I heard that it is great for this, and I was right. In general, you can transfer a design from Figma to Framer with a couple of clicks via Framer plugin. But, as far as I know, this won’t work with styles.

The functionality and design of Framer itself is quite simple and similar to Figma. I literally had a couple of small difficulties. But I found Framer chat in Telegramwhere I asked for advice a couple of times.

As for the tariff, the free version was quite enough for me and I didn’t pay anything.

Another first time working with CMS. I liked it. In general, I really enjoyed the assembly, so I can proudly add to myself the skill of basic zero-coding.

5. Connected Google Analytics

Connected according to this guide. In general, it is quite interesting to look at information about interaction with the site

As a result

The main thing is not to piss yourself and not to try to make the portfolio ideal from the first iteration. First, you can launch an MVP, like I did. And then gradually refine it. Otherwise, you may never publish the portfolio at all.

Actually, here it is again link to portfolio. Welcome!

And if you encounter any bugs, be sure to let me know in the comments ↓

Kindly Reminder about my telegram channelwhere I post my concepts and write notes.

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *