본문 바로가기
Figma

Figma Plugin을 활용하여 10분 만에 포트폴리오 만들기

by 고수 지망생 2023. 11. 23.

Figma에는 다른 사람이 만들어 놓은 Plugin 기능을 이용하여 여러 용도로 편리하게 사용할 수 있다. 마찬가지로 Plugin을 활용하여 빠르고 간단한 포트폴리오 템플릿을 제작해 보겠다.

 

Figma Plugin을 활용하여 10분 만에 포트폴리오 만들기

1. 인트로 페이지 제작하기

🛑인트로 페이지는 몰입감을 주며 전체적인 포트폴리오의 컨셉을 잡아주어야 한다.

❓사용하는 Plugin: Mockup

준비물은 1920/1080의 프레임과 목업에 들어갈 페이지이다.

 

준비가 끝났다면

 

원하는 목업 이미지를 클릭하고 + 버튼을 누른 뒤 넣고 싶은 페이지를 클릭하여 집어 넣는다. Pasete in Canvas 버튼을 누르면 최종적으로 목업 이미지가 생성된다.

그러면 이런 프레임이 나오게 되는데 이때 몰입감을 높여주기 위해서 나는 오른쪽에 어두운 그라데이션 박스를 넣어줄 것이다. 그라데이션 박스를 배경으로 타이틀과 이름이 들어가면 가독성과 몰입감 모두를 가져갈 수 있을 것이다.

 

Rectangle을 프레임 안쪽에 높이 맞게 생성하고 박스의 Fill 설정창에 들어가서 그라데이션 속성으로 오른쪽은 Black 100%로 지정한 후에 프레임 흰배경이 보이는 지점부터 시작해서 휴대폰까지를 그라데이션으로 넣으면 시작점보다 왼쪽인 부분은 그라데이션이 아닌 단색으로 들어가기 때문에 100% Black으로 보이게 된다. 그러므로 자연스러운 그라데이션을 넣을 수 있다. 여기서 한 번 더 디테일하게 그라데이션을 넣기 위해 그라데이션 3단계 중에 가장 오른쪽에 위치한 포인트를 배경에 있는 조약돌의 색깔과 일치하게 만들어준다. 이때 I  단축키를 활용하여 스포이드 기능을 이용하면 된다.

 

마지막으로 그라데이션 위에 타이틀과 분야, 본인의 이름이 들어갈 칸을 만들어주면 몰입감 있는 인트로 화면이 완성된다.

 

2. 본인소개 페이지

🛑본인 소개란에는 수상경력, 교육스펙 등을 같이 적으면 본인을 구체적으로 소개할 수 있다.

❓사용하는 Plugin: Unsplash

 

똑같이 1920/1080 사이즈의 프레임의 수상경력과 교육스펙을 적고 본인의 사진이 들어갈 카드를 만든다. 우리는 템플릿을 제작하기에 Unsplash로 사람 사진을 집어 넣을 것이다. 박스에 마우스를 올리고 우클릭하여 Unsplah plugin을 실행해 준다. 없다면 Explorer에서 'Try it out' 버튼으로 Plugin을 가져오면 된다. 

 

원하는 사진을 고른 뒤에 클릭하게 되면 오른쪽 사진처럼 이미지가 들어간 모습을 볼 수 있다.

3. 작업물 페이지

🛑본인만의 Wireframe으로 편집하여 사용하면 된다.

❓사용하는 Plugin: Wireframe  Designer

 

 

같은 크기의 프레임을 생성하고 Plugin Wireframe Designer을 실행시켜주고 작업물의 내용을 입력해주면 된다. 나는 health planner라고 입력하였고 나온 내용물을 토대로 편집하여 사용하면 된다.

편집한 결과물

4. 프로젝트 소개

🛑진행한 프로젝트의 상징을 간략한 아이콘과 설명으로 보여준다. 또한 포지셔닝 맵으로 방향성을 보여준다.

❓사용하는 Plugin: Material Symbol, Product planner

 

 

프로젝트 명이 들어갈 텍스트를 삽입하고 Plugin Material Symbol을 실행시켜 본인의 프로젝트와 관련된 아이콘과 설명을 삽입하여 프로젝트 설명 페이지를 만든다. 

 

포지셔닝 맵은 아래 두 사진과 같이 플러그인을 실행하게 되면 나오는 어슘션 그리드를 활용하면 되는데 필요한 부분만 추출하여 페이지 안으로 집어 넣으면 된다.

 

5. 통계 자료

🛑원하는 통계적 사실이나 자료를 그래프로 표현할 수 있다.

❓사용하는 Plugin: Charts

 

 

Plugin Charts를 실행하게 되면 위와 같은 창이 나오게 되는데 여기서 그래프의 형태와 값을 입력하여 원하는 그래프를 만들 수 있다.

 


최종 결과물

 


마무리 글

이렇게 포트폴리오 템플릿을 Plugin들을 활용하여 아주 빠르고 간단하게 만들어 보았다. 이것 자체로는 포트폴리오로서 매력이 없겠지만 Plugin의 활용법을 익힌다는 것 혹은 편집하여 조금 더 퀄리티가 높은 결과물을 만들어 낼 수 있을 것이다.

-끝-