내 이야기를 온라인으로 가장 잘 표현하는 방법은 무엇일까요? 그래픽 디자이너들은 자신의 포트폴리오 웹사이트에서 작업물과 개성을 보여주기 위해 다양한 디자인 테크닉을 활용합니다.

온라인 포트폴리오를 제작하면 나만의 특별한 아이디어를 공유하고, 내가 어떤 사람인지 창의적으로 표현할 수 있습니다. 하지만 ‘나’라는 복잡한 존재를 디지털 세계라는 제한된 공간에서 시각적으로만 표현하는 것이 쉽지 않은데요. 개인적인 프로젝트를 작업하다 보면 내가 잘 하고 있는 것이 맞는지, 디자인이 이상하지는 않은 지 혼란스러워지곤 합니다. 한 스푼의 영감과 아이디어를 얻으실 수 있도록 Wix에서 시선을 사로잡는 창의적인 웹사이트를 제작한 그래픽 디자이너 8명의 포트폴리오를 소개해드리겠습니다. 아트 디렉션에서부터 모션 그래픽, 브랜딩 디자인, 웹디자인까지 다양한 분야에서 활동 중인 각 디자이너들은 자기 자신과 디자인 작업물과 여러 가지 방법으로 표현하고 있습니다.

브랜딩/디지털/모션 디자인 스튜디오

최고의 웹사이트라면 시선을 한눈에 사로잡을 수 있어야 하는데요. 이 그래픽 디자인 스튜디오의 웹사이트가 딱 그렇습니다. 홈페이지에 들어가자 마자 자신들의 기술을 보여줄 수 있는 애니메이션을 삽입함으로써 눈길을 끕니다. 애니메이션에서는 스튜디오의 3D 로고가 나타나 움직이며 브랜드의 특성을 강조합니다. 또한, 웹사이트 전반에 걸쳐 명확한 시각적 이미지와 크고 두꺼운 글꼴을 일관성 있게 사용하고 있는 것이 특징입니다. 각 프로젝트 페이지에서는 영감을 얻은 단계에서부터 타이포그래피 및 색상 파레트 선택, 스크린 속으로 걸어 들어가고 싶을 정도로 멋진 배경 이미지 제작까지의 모든 과정을 소개하고 있습니다.

아트 디렉션 및 푸드 타이포그래피

Kanyegg의 다니엘 에반스는 푸드 타이포그래피로 유명합니다. 대중문화의 아이콘인 카니예 웨스트(Kanye West)를 탐구하던 다니엘은 달걀을 매개체로 사용하여 한 걸음 더 나아가기로 결정했습니다. 다니엘은 가 의류 라인에 사용하는 색조를 그대로 사용함으로써 영감의 원천에 충실하고자 했습니다. 섬세하고 정교하게 제작한 달걀 창작품처럼 웹사이트의 디자인 세세하게 신경 썼습니다. 마우스 커서를 이미지 위에 놓았을 때, 해당 이미지가 흐려지거나 달라진 모습의 이미지가 나타나는 등의 다양한 를 적용했습니다.

그래픽 디자인 스튜디오

Lynx & Co는 타이포그래피 및 레터링, 브랜딩, 웹디자인, 일러스트레이션 등의 다양한 전문 분야를 아우르기 때문에 이 스튜디오의 그래픽 디자인 웹사이트는 정말 기대할만한데요. 전체적으로 독특한 타이포그래피를 적용하고, 트렌드에 맞는 로고 디자인을 선택하여 깔끔하고 매력적인 감각이 균형을 이룹니다. 잠재 고객의 시선에 맞춰 스튜디오에 대한 명확하면서도 친근한 소개와 큰 사이즈의 작업물 이미지를 올려 두었습니다. 그리고 Lynx & Co 스튜디오는 자신들의 그래픽 디자인 포트폴리오를 활용한 타이포그래피 프린트 등을 온라인 판매하기 위해 온라인 쇼핑몰을 제작했습니다.

예술/디자인 스튜디오

Stolen Goods 스튜디오는 사람들을 웃게 하는 방법을 잘 알고 있습니다. 아름다운 일러스트로 장식한 제품과 친숙하고 깔끔한 홈페이지 디자인이 홈페이지에 유입된 방문자들의 마음을 사로잡습니다. 행과 열에 따라 나열된 다양한 패턴의 매력적인 제품 사진들 바깥으로 커다란 화이트 프레임이 스크린 측면을 따라 사진들을 두르는 형태를 띠고 있습니다. 이게 다가 아닙니다. 브랜드에 알맞는 로고 제작이나 분위기에 적합한 특정 어조를 사용하는 등 홈페이지에 있는 모든 요소들을 세심하게 신경 쓴 흔적을 발견할 수 있습니다. 홈페이지에 들어가면 바로 발견할 수 있는 강렬하면서 매력적인 ‘hello!’ 문구에서부터 로고를 감싸는 ‘since whenever’ 문구까지 이런 작은 디테일들이 사람들의 감성의 문을 두드립니다. 내 웹사이트에 나만의 개성을 반영하기 위해 마이크로카피를 조정하는 것은 고려할 만한 가치 있는 그래픽 디자인 포트폴리오 팁입니다.

디지털 아트(영화, VJ 영상 등)

마이크 윙켈만의 그래픽 디자인 웹사이트에는 풀스크린의 동영상에서부터 단색의 색상 구성표와 마우스 커서를 올리면 단어 위로 선이 가로지르는 효과까지 이 모든 것이 마이크 윙켈만을 표현하고 있습니다. 사이트 전체에서 사용하고 있는 친근한 어조는 말할 것도 없지요. 마이크 윙켈만의 웹사이트에서는 단편 애니메이션, VJ 클립 및 ‘’ 등 다양한 혼합 프로젝트를 살펴볼 수 있습니다. 다양한 스타일과 특성을 가지고 있음에도 불구하고, 각각의 프로젝트가 모두 모여 전체적인 경험을 형성합니다. 하지만 정말 내 자신을 치유하고 싶고(또 추억 여행을 떠나고 싶다면), ‘’ 섹션을 살펴보시라고 하고 싶습니다. 정말 솔직하고 비밀스러운 작품들의 향연이 펼쳐 지기 때문이죠. 즐겨보세요.

아트 디렉션 및 디지털 아트

뭔지 알 수 없는 분홍색 물체, 중력에 반하는 시나리오, 또는 지나치게 실제적인 디지털 재료들이 Daniel Aristazábal의 애니메이션 포트폴리오에서 방문자들을 기다리고 있습니다. 재밌는 것은 이뿐만이 아닙니다. 그래픽 디자인 웹사이트의 모든 페이지에는 특이한 스크롤 효과를 볼 수 있는데요. 스크롤을 내리면 이미지가 슬라이드하면서 나타나거나 움직이기 시작하고, 오버랩되기도 합니다. 또한 패럴랙스 스크롤 효과를 사용한 것도 눈에 띄는 점입니다. 이 웹사이트의 모서리에는 질서정연한 분위기를 더해주는 4가지의 요소가 있습니다. 이 요소들은 화면을 아래로 스크롤해도 계속 같은 위치에 있기 때문에 일종의 웹사이트 내비게이션 역할을 합니다.

프린트, 타이포그래피, 아트 디렉션

이 그래픽 디자이너는 포트폴리오 웹사이트에서 자신의 작업물 슬라이드쇼를 메인 상단에 두어 중요한 요점만을 표현하고 있습니다. 슬라이드쇼 아래로는 나머지 작업물들을 그리드로 나열하여 게시했습니다. 심플한 블랙 배경과 대비되는 화이트 색상의 텍스트 및 화살표 버튼, 컬러풀한 이미지들이 조화를 이루면서 돋보입니다. 특히 'info' 섹션을 누르면 화면 오른쪽에 라이트박스가 직관적으로 미끄러져 들어오는 것을 볼 수 있는데요. 같은 페이지에서 오른쪽 화면의 일부만 덮기 때문에 라즈의 그래픽 디자인 이력서를 볼 수 있는 동시에 그의 작품을 살펴볼 수도 있습니다.

화가

맞습니다. 사실 윌리엄 첸스는 엄연히 따지자면 그래픽 디자이너는 아닙니다. 하지만 윌리엄의 홈페이지를 소개하지 않을 수 없었죠. 윌리엄의 아티스트 포트폴리오는 웹디자인에 있어서 감성을 흔들 수 있는 색상을 사용하는 방법의 완벽한 예시가 되기 때문인데요. 홈페이지 메인 상단에 있는 멋진 애니메이션과 밝은 색상의 블럭 및 형태들이 사이트를 방문하는 사람들의 눈을 현혹합니다. 웹사이트 메뉴에는 깔끔한 산세리프 글꼴을 사용하고 흰색 라인을 활용함으로써 대담한 색조와 패턴을 균형있게 표현했습니다. 게다가 화면을 스크롤할 때 이미지와 텍스트가 어떻게 슬라이드하는지 살펴보세요. 해당 효과를 사이트의 모든 페이지에 걸쳐 적용하여 전체적으로 일관성을 부여했습니다. 이러한 일관성은 작업물을 소개하는 포트폴리오 제작에 있어서 중요한 요소입니다.

다양한 그래픽 디자인 포트폴리오에 대해서 설명해 드렸는데요. 전문가들이 제작한 디자인 템플릿에서 영감을 받고 나만의 작업물을 위한 포트폴리오를 지금 바로 무료로 제작해 보세요!

By 조윤정

SEO & 블로그 전문가