지디웹에서 웹디자인 참고 사례 찾는 방법
얼마 전 홈페이지 개편 사례를 찾다가 지디웹을 다시 열어봤어요. 예쁜 화면은 많은데, 막상 우리 사이트에 참고할 만한 사례를 고르려니 어디부터 봐야 할지 막막하더라고요. 그럴 때는 작품을 무작정 넘기기보다 만들려는 사이트의 목적을 먼저 떠올리는 편이 훨씬 빠릅니다.
지디웹은 웹사이트와 모바일 디자인 선정작을 모아 볼 수 있는 곳입니다. 다양한 분야의 사례가 쌓여 있어 첫 화면 구성부터 메뉴 방식, 글자 크기까지 비교하기 좋죠. 다만 선정작을 그대로 따라 그리기보다, 어떤 문제를 어떤 방식으로 풀었는지 읽어내야 실제 작업에 도움이 됩니다.
먼저 찾으려는 사이트의 목적을 좁혀요
지디웹에 들어가면 연도별 FINALIST와 GDWEB 선정작을 볼 수 있습니다. WEB 부문과 MOBILE 부문도 나뉘어 있어요. 처음부터 모든 작품을 훑으면 시간이 금방 지나갑니다. 기업 소개 사이트를 만든다면 기업·브랜드 사례부터, 상품 판매가 목적이라면 쇼핑몰 사례부터 보는 식으로 범위를 좁혀보세요.
같은 업종이라고 다 참고할 필요는 없습니다. 예를 들어 카페 홈페이지를 만든다고 해도 예약을 늘리고 싶은 곳과 원두 판매가 중요한 곳은 첫 화면에서 보여줘야 할 정보가 달라요. 업종보다 방문자가 해야 할 행동이 비슷한 사례를 찾는 게 더 유용합니다.
처음에는 후보를 5개 정도만 고르는 걸 권합니다. 화면 분위기가 마음에 드는 사례 2개, 정보 배치가 편한 사례 2개, 모바일 구성이 좋은 사례 1개처럼 이유를 붙여두면 나중에 비교하기 쉽습니다. 작품 이름만 적어두면 며칠 뒤에는 왜 골랐는지 잊기 쉽거든요.
연도와 화면 종류를 바꿔가며 비교해요
최신 사례만 보면 요즘 자주 쓰는 표현을 파악하기 좋습니다. 반면 몇 년 전 작품까지 함께 보면 잠깐 유행했던 장식과 오래 살아남은 구조를 구분하는 데 도움이 돼요. 같은 분야에서 최근 작품 3개와 이전 작품 2개를 나란히 놓고 비교해보면 차이가 꽤 선명합니다.
PC 화면이 멋져 보여도 휴대전화에서 그대로 편하리라는 보장은 없어요. 지디웹의 WEB 부문과 MOBILE 부문을 각각 확인하고, 가능하다면 실제 사이트도 휴대전화로 열어보세요. 메뉴를 여는 위치, 버튼을 누르기 쉬운 크기, 긴 문장을 읽을 때의 간격은 작은 화면에서 더 잘 드러납니다.
지디웹에는 선정작과 연도별 FINALIST가 따로 보입니다. 지디웹의 심사방법 안내에 따르면 선정작 중에서 다시 심사를 거쳐 분야별 최우수작을 선정합니다. 그래서 두 목록을 같은 뜻으로 받아들이기보다는, 넓게 사례를 모을 때는 선정작을 보고 눈에 띄는 완성도를 비교하고 싶을 때는 FINALIST도 함께 보는 방식이 편합니다.
예쁜 화면보다 쓰는 흐름을 먼저 봐요
작품을 열었다면 첫 화면에서 세 가지만 확인해보세요. 이 사이트가 무엇을 하는 곳인지 바로 알 수 있는지, 방문자가 다음에 눌러야 할 곳이 눈에 띄는지, 원하는 정보를 메뉴에서 쉽게 찾을 수 있는지입니다. 큰 사진이나 움직이는 효과는 인상적이지만, 이 세 가지가 흐릿하면 실제 사용은 불편할 수 있어요.
예를 들어 병원 사이트라면 진료과목, 의료진, 예약 방법이 빨리 보여야 합니다. 여행 숙소 사이트라면 객실 사진도 중요하지만 날짜와 가격을 확인하는 길이 막히지 않아야 하죠. 같은 디자인 요소라도 방문 목적에 따라 좋은 선택이 달라집니다.
지디웹의 심사 항목에도 비주얼디자인뿐 아니라 정보구성, 사용성, 가독성 등이 포함돼 있습니다. 사례를 볼 때 색과 사진만 기록하지 말고 정보가 어떤 순서로 나오는지도 적어두면 좋아요. ‘첫 화면에서 서비스 설명 → 이용 사례 → 문의 버튼’처럼 흐름을 한 줄로 써보면 디자인이 맡은 역할이 보입니다.
움직임이 많은 사이트는 특히 실제로 눌러보는 게 좋습니다. 화면 전환이 자연스러운지, 글을 읽는 속도를 방해하지 않는지 확인해보세요. 보기에는 화려해도 중요한 버튼을 찾는 데 시간이 걸린다면 우리 사이트에는 덜어내는 편이 맞을 수 있습니다.
찾은 사례를 내 작업에 옮길 때는
마음에 드는 작품을 찾았다면 화면 전체를 복사하듯 가져오기보다 요소별로 나눠보세요. 첫 화면의 제목 길이, 사진과 글의 비율, 메뉴의 깊이, 문의 버튼의 위치처럼 관찰한 점을 적는 겁니다. 그러면 ‘이 느낌이 좋다’는 막연한 말이 실제로 바꿀 수 있는 항목으로 바뀝니다.
간단한 비교표를 만들어도 좋습니다. 후보마다 ‘좋았던 점’, ‘우리 사이트에 맞지 않는 점’, ‘적용해볼 부분’을 한 줄씩 채워보세요. 예를 들어 사진 배치는 참고하되, 작은 글씨나 복잡한 메뉴는 가져오지 않는 식입니다. 세 작품의 장점을 섞더라도 방문자가 해야 할 행동이 하나의 흐름으로 이어지는지 확인해야 해요.
제작을 맡길 업체를 찾는 중이라면 지디웹의 에이전시 검색도 참고할 수 있습니다. 마음에 든 작품의 제작사를 살펴보고 비슷한 분야의 작업 경험이 있는지 비교하는 거죠. 다만 수상 이력만으로 우리 프로젝트와 잘 맞는 업체라고 단정하기는 어렵습니다. 상담할 때 일정, 유지보수, 실제 작업 범위까지 함께 확인하는 편이 현실적이에요.
저는 지디웹을 볼 때 멋진 작품을 많이 모으는 것보다, 우리 방문자에게 필요한 이유를 설명할 수 있는 사례 몇 개를 고르는 쪽이 더 낫다고 느낍니다. 디자인 참고 자료는 눈을 즐겁게 하는 데서 끝나지 않고, 더 편하게 쓰는 사이트를 만드는 데 쓰일 때 가치가 커지니까요.
