초보자를 위한 지디웹 활용하는 방법

얼마 전 웹사이트 리뉴얼 자료를 찾다가 지디웹을 다시 열어봤는데, 예전보다 훨씬 ‘자료 창고’처럼 느껴졌습니다. 그냥 예쁜 사이트를 모아둔 곳이라고 생각하기 쉬운데, 막상 써보면 디자인 참고, 에이전시 탐색, 포트폴리오 분석까지 꽤 실용적으로 활용할 수 있더라고요.

지디웹은 GDWEB, 굿디자인웹이라는 이름으로도 불리는 국내 웹·모바일 디자인 아카이브 성격의 서비스입니다. GDWEB 선정작, 웹 부문, 모바일 부문, 파이널리스트, 에이전시 정보, 채용 소식 같은 메뉴를 통해 국내 디지털 디자인 사례를 비교해볼 수 있습니다. 특히 웹디자인을 처음 공부하는 사람이나 홈페이지 제작을 맡겨야 하는 담당자라면 시간을 아껴주는 참고 자료가 될 수 있습니다.

지디웹은 어디에 쓰면 좋을까

지디웹을 가장 많이 쓰는 경우는 디자인 레퍼런스를 찾을 때입니다. 예를 들어 병원 홈페이지를 만들 계획이라면 의료·헬스케어 계열 사이트를 찾아보고, 브랜드 쇼핑몰을 준비한다면 커머스 성격의 사이트를 비교해볼 수 있습니다. 단순히 색감만 보는 게 아니라 첫 화면 구성, 메뉴 구조, 버튼 위치, 문의 동선까지 같이 보면 훨씬 쓸모가 커집니다.

사실 처음에는 ‘멋있다’ 정도로만 보게 됩니다. 그런데 10개, 20개 정도 비슷한 업종의 사이트를 모아 보면 패턴이 보입니다. 금융권은 신뢰감을 주는 정돈된 레이아웃이 많고, 뷰티 브랜드는 이미지와 제품 상세 흐름이 중요하며, 공공기관은 접근성과 정보 탐색이 훨씬 크게 작용합니다. 이런 차이를 발견하는 순간 지디웹은 단순 감상용 사이트가 아니라 실무 참고 자료가 됩니다.

웹디자인 포트폴리오를 준비할 때
회사 홈페이지 리뉴얼 방향을 잡을 때
외주 제작사를 찾기 전 사례를 비교할 때
업종별 UI 흐름을 공부할 때
국내 웹디자인 트렌드를 빠르게 훑어볼 때

검색할 때는 업종보다 목적을 먼저 잡기

지디웹에서 자료를 찾을 때 가장 흔한 실수는 막연히 ‘예쁜 사이트’를 찾는 것입니다. 물론 예쁜 사이트도 중요합니다. 하지만 실제 제작이나 공부에 활용하려면 먼저 목적을 정하는 편이 좋습니다. 예를 들어 ‘예약 전환을 높이고 싶다’, ‘브랜드 이미지를 고급스럽게 보이고 싶다’, ‘모바일에서 상품을 쉽게 보이게 하고 싶다’처럼 기준을 하나 잡는 식입니다.

같은 카페 브랜드 사이트라도 목적에 따라 보는 포인트가 달라집니다. 매장 방문을 유도하는 사이트라면 위치, 운영 시간, 메뉴판 접근성이 중요합니다. 반면 원두 판매가 중심인 사이트라면 상품 사진, 장바구니 흐름, 리뷰 노출 방식이 더 중요하죠. 이렇게 보면 지디웹의 선정작을 볼 때도 ‘이 사이트가 왜 좋아 보이는지’를 더 구체적으로 말할 수 있습니다.

초보자가 보기 좋은 체크 포인트

첫 화면에서 무엇을 가장 먼저 보여주는지
메뉴가 3초 안에 이해되는지
모바일 화면에서도 버튼을 누르기 쉬운지
문의, 구매, 예약 같은 행동까지 몇 번 클릭이 필요한지
이미지와 글의 비율이 답답하지 않은지

개인적으로는 첫 화면보다 두 번째 화면을 더 자주 봅니다. 첫 화면은 대부분 힘을 많이 주기 때문에 멋있어 보입니다. 그런데 스크롤을 한 번 내렸을 때 정보가 자연스럽게 이어지는지, 갑자기 분위기가 끊기지 않는지 보면 완성도를 더 쉽게 판단할 수 있습니다.

에이전시를 볼 때는 작품 수보다 결을 보기

지디웹에는 에이전시 정보도 함께 확인할 수 있습니다. 홈페이지 제작을 맡기려는 입장에서는 꽤 유용합니다. 다만 작품 수가 많다고 무조건 내 프로젝트와 잘 맞는 것은 아닙니다. 포트폴리오를 볼 때는 ‘이 회사가 어떤 스타일을 반복해서 잘하는지’를 보는 게 좋습니다.

예를 들어 어떤 에이전시는 대기업 캠페인 사이트처럼 비주얼이 강한 작업에 익숙하고, 어떤 곳은 공공기관이나 교육기관처럼 정보 구조가 중요한 프로젝트에 강합니다. 또 어떤 곳은 쇼핑몰과 브랜드몰에서 구매 흐름을 잘 잡습니다. 내 사이트가 소개형인지, 예약형인지, 판매형인지에 따라 맞는 제작사는 달라질 수밖에 없습니다.

견적을 문의하기 전에는 마음에 드는 사례를 3개 정도 골라두면 대화가 훨씬 쉬워집니다. “이런 느낌으로 해주세요”보다 “이 사이트의 첫 화면 구성은 좋고, 이 사이트의 메뉴 방식은 우리에게 맞고, 이 사이트의 제품 상세 흐름이 마음에 든다”처럼 말하면 제작사도 훨씬 정확하게 이해합니다.

포트폴리오 공부는 따라 만들기보다 분석하기

디자인을 공부하는 사람이라면 지디웹 선정작을 보고 따라 만들고 싶어질 때가 많습니다. 그런데 그대로 베끼는 방식은 실력이 잘 늘지 않습니다. 더 좋은 방법은 화면을 쪼개서 분석하는 것입니다. 헤더 높이, 여백, 글자 크기, 카드 간격, 버튼 위치, 이미지 비율 같은 요소를 하나씩 관찰하면 눈이 빨리 트입니다.

예를 들어 첫 화면 하나만 봐도 분석할 것이 많습니다. 로고는 얼마나 크게 들어갔는지, 메뉴는 몇 개인지, 메인 문장은 몇 줄인지, 행동 버튼은 한 개인지 두 개인지, 이미지가 전체 화면을 쓰는지 일부만 쓰는지 살펴볼 수 있습니다. 이렇게 보면 좋은 디자인이 감각만으로 만들어진 게 아니라 꽤 많은 선택의 결과라는 걸 알게 됩니다.

마음에 드는 사이트 5개를 저장한다
공통점을 5가지 적는다
각 사이트에서 아쉬운 점도 1개씩 찾는다
내 프로젝트에 가져올 요소와 버릴 요소를 나눈다

솔직히 좋은 레퍼런스를 많이 보는 것보다 중요한 건 ‘왜 좋은지 말할 수 있는 상태’입니다. 이 연습을 해두면 클라이언트 미팅이나 포트폴리오 면접에서도 훨씬 설득력 있게 말할 수 있습니다.

지디웹을 더 실용적으로 쓰는 작은 습관

지디웹을 오래 쓰다 보면 그냥 많이 보는 것보다 기록하는 습관이 훨씬 중요하다는 걸 느끼게 됩니다. 마음에 드는 사이트를 캡처해두고, 왜 저장했는지 한 줄만 적어도 나중에 자료 가치가 달라집니다. ‘색이 예뻐서’보다 ‘상품 카테고리 진입이 빠름’, ‘모바일 하단 버튼이 명확함’, ‘브랜드 소개와 구매 흐름이 자연스럽게 연결됨’처럼 적는 식입니다.

또 하나는 최신 선정작만 보지 않는 것입니다. 최신 디자인은 트렌드를 읽기에 좋지만, 오래된 사이트 중에서도 정보 구조가 탄탄한 사례가 있습니다. 특히 공공기관, 교육, 병원, B2B 서비스처럼 유행보다 안정감이 중요한 분야는 시간이 조금 지난 사례에서도 배울 점이 많습니다.

지디웹은 디자이너만 쓰는 곳이라고 생각하기 쉽지만, 실제로는 기획자, 마케터, 대표, 개발자에게도 꽤 유용한 참고 도구입니다. 웹사이트를 보는 눈이 생기면 외주를 맡길 때도, 내부 회의를 할 때도 말이 훨씬 구체적으로 바뀝니다. 좋은 사이트를 많이 보는 일은 결국 좋은 질문을 많이 만드는 일이기도 해서, 저는 프로젝트를 시작하기 전에 지디웹에서 30분 정도 손을 풀어보는 편입니다.