상세페이지 기획·디자인 전문 하오스튜디오

■ 핵심 요약 ① 음료 상세페이지의 청량감은 시원한 색과 물의 움직임을 함께 보여줄 때 생겨요. ② 물속 잠김컷·따르는 컷·용량 비교컷 3가지를 나눠 배치하면 화면이 시원해져요. ③ 촬영과 디자인을 한 곳에서 맡기면 색 톤이 페이지 끝까지 어긋나지 않아요. 안녕하세요, 하오스튜디오입니다. 음료 상세페이지에서 "시원해 보인다"는 인상은 감각이 아니라 배경 색·물의 상태·컷 배치를 미리 정해두는 설계에서 나와요. 오늘은 실제로 진행한 생수 상세페이지 제작 프로젝트로 청량감을 화면에 어떻게 옮겼는지 정리해볼게요. 음료 상세페이지에서 청량감은 무엇으로 만들어질까요? 음료 상세페이지의 청량감은 색·물의 상태·여백 세 가지가 겹쳐서 만들어지는 인상이에요. 제품만 예쁘게 찍는다고 생기지 않고, 화면 전체가 같은 온도로 보여야 그때 시원하다는 느낌이 붙거든요. 그래서 기획 단계에서 3가지를 먼저 정합니다. 하나는 배경 색의 범위예요. 파랑 계열 안에서도 옅은 하늘색부터 짙은 청색까지 폭을 정해두면, 페이지를 위에서 아래로 내릴 때 색이 튀지 않아요. 두 번째는 물을 어떤 상태로 보여줄지입니다. 잠긴 상태, 따르는 상태, 담긴 상태는 각각 주는 느낌이 다릅니다. 세 번째는 여백이에요. 시원한 인상은 요소를 채울수록 오히려 줄어들어서, 문구를 짧게 끊고 위아래 여백을 넉넉히 두는 편이 낫습니다. 이번에 제작한 생수 업종 상세페이지가 그 방식으로 짜인 페이지예요. 상단은 산과 하늘을 옅은 하늘색으로 깔고, 아래로 내려갈수록 청색을 진하게 가져갔습니다. 중간에는 물속에 병이 잠겨 기포가 올라오는 컷을 크게 배치했고, 수면 경계선을 화면 가로로 지나가게 잡아서 스크롤이 물속으로 들어가는 것처럼 읽히게 했어요. 다른 구간에는 유리잔에 물을 담아 병과 나란히 둔 컷을 넣어 마시는 장면까지 이어지도록 구성했습니다. 색으로 만드는 청량감 배경 파랑을 옅은 톤에서 짙은 톤까지 한 계열로 묶어요. 계열이 하나여야 스크롤 중간에 ...