B2B 사이트제작, 개발보다 기획이 먼저인 이유 (ft. 실패하지 않는 프레임워크)

안녕하세요. 풀링포레스트 시니어 프로덕트 매니저(PM) 최PM입니다.

"PM님, 이번에 우리 서비스 랜딩 페이지랑 소개 사이트 새로 만들어야 하는데, 디자인이랑 개발 일정 얼마나 잡으면 될까요?"

신규 프로젝트 킥오프 미팅에서 꽤 자주 듣는 질문입니다. 보통 이런 질문을 받으면 저는 잠시 침묵합니다. 질문하신 분은 '개발 기간 2주, 디자인 1주' 같은 산술적인 답변을 원하셨겠지만, 제 머릿속에는 훨씬 복잡한 계산이 돌아가기 때문입니다. 사실 솔직히 말씀드리자면, 과거의 저도 똑같았습니다. "빨리 만드는 게 장땡이지"라며 개발사 견적부터 알아보고, 워드프레스 테마부터 뒤적거렸던 시절이 있었습니다. 그리고 그 결과는 처참했습니다.

오늘은 제가 수많은 B2B 사이트제작 프로젝트를 진행하며 겪었던 뼈아픈 시행착오와, 그 과정에서 정립하게 된 '실패하지 않는 기획 프레임워크'에 대해 이야기해 보려 합니다. 단순히 예쁜 웹사이트를 만드는 것이 아니라, 진짜 비즈니스 성과를 내는 사이트를 만들고 싶은 실무자분들에게 도움이 되었으면 합니다.

화려한 껍데기, 텅 빈 알맹이

몇 년 전, 제가 담당했던 B2B SaaS 제품의 리뉴얼 사이트 제작 프로젝트였습니다. 당시 팀의 목표는 명확했습니다. "경쟁사보다 더 세련되고, 더 있어 보이게 만들자." 우리는 최신 디자인 트렌드인 인터랙티브 웹 기술을 대거 도입했습니다. 스크롤을 내리면 요소들이 화려하게 날아오고, 마우스 커서에 따라 배경이 움직이는 멋진 사이트가 탄생했습니다. 개발팀도 최신 프론트엔드 스택을 사용하며 기술적 챌린지를 즐겼습니다.

결과는 어땠을까요? 오픈 첫 달, 이탈률이 무려 80%를 넘었습니다. 화려한 애니메이션 때문에 로딩 속도는 느려졌고, 정작 고객이 가장 궁금해하는 '요금제'와 '기능 명세'는 복잡한 인터랙션 뒤에 숨어 찾기 힘들었기 때문입니다. 고객은 우리의 기술력을 보러 온 게 아니라, 자신의 문제를 해결해 줄 솔루션을 찾으러 온 것이라는 본질을 놓친 것입니다. "사이트가 예쁘긴 한데, 뭘 파는 건지 모르겠어요"라는 피드백을 들었을 때의 그 당혹감은 지금도 잊히지가 않습니다.

개발 전에 물어야 할 3가지 질문

이 실패를 통해 저는 사이트제작의 핵심은 '어떻게(How)' 만들지가 아니라 '왜(Why)'와 '누구에게(Who)' 보여줄지 정의하는 것에 있음을 절실히 깨달았습니다. 코드를 한 줄이라도 짜기 전에, 피그마(Figma)를 켜기 전에, 반드시 답해야 할 질문들이 있습니다.

첫째, "우리의 진짜 고객은 누구이며, 그들은 어떤 언어를 쓰는가?"

B2B 제품이라면 의사결정권자와 실무자의 언어가 다릅니다. 실무자는 '기능의 편의성'을 보지만, 임원급은 '비용 절감'과 '보안'을 봅니다. 타겟이 명확하지 않으면 카피라이팅은 붕 뜨게 됩니다.

둘째, "고객이 사이트에서 얻어가야 할 단 하나의 가치는 무엇인가?"

모든 기능을 나열하지 마세요. 우리 제품이 해결해 주는 가장 고통스러운 문제(Pain Point) 하나에 집중해야 합니다. 백화점식 나열은 고객의 인지 부하만 높일 뿐입니다.

셋째, "고객이 결국 어떤 행동을 하길 원하는가(CTA)?"

'무료 체험 시작하기'인지, '도입 문의하기'인지, 아니면 '백서 다운로드'인지 목표 행동을 하나로 좁혀야 합니다. 이 목표에 따라 UX 설계가 완전히 달라집니다.

기획의 뼈대를 세우는 정보 구조(IA) 설계

앞선 질문들에 대한 답이 나왔다면, 이제 본격적으로 구조를 잡아야 합니다. 저는 이 단계에서 개발팀이나 디자인팀과 소통할 때 반드시 '와이어프레임' 이전에 '정보 구조도(IA)'부터 확정 짓습니다.

많은 분이 사이트제작을 의뢰하거나 시작할 때 레퍼런스 사이트의 비주얼부터 캡처해 옵니다. 하지만 그건 집을 지을 때 벽지 색깔부터 고르는 격입니다. 어떤 방이 필요하고, 동선은 어떻게 짤지 설계도부터 그려야 합니다.

제가 풀링포레스트에서 사용하는 간단한 구조화 팁을 공유합니다.

1. GNB(Global Navigation Bar) 다이어트: 메뉴는 5개를 넘기지 않습니다. 사용자가 고민하게 만들지 마세요.

2. 섹션별 목표 정의: 각 스크롤 섹션마다 전달하고 싶은 메시지를 한 문장으로 정리합니다. 예를 들어, "첫 번째 섹션: 신뢰도 확보(고객사 로고 노출)", "두 번째 섹션: 문제 제기(당신의 업무가 비효율적인 이유)" 처럼요.

3. 모바일 퍼스트 관점: B2B라도 모바일 유입이 상당합니다. 좁은 화면에서 정보의 위계가 어떻게 보일지 텍스트 위주로 먼저 정리합니다.

개발은 그 다음입니다

이렇게 기획이 단단하게 잡혀 있으면, 실제 개발 단계는 놀라울 정도로 빨라집니다. 개발자는 기획서의 빈틈을 메우느라 시간을 낭비할 필요가 없고, 디자이너는 명확한 메시지를 시각화하는 데에만 집중할 수 있습니다.

특히 최근에는 노코드 툴이나 헤드리스 CMS 같은 기술들이 발전해서, 기획만 명확하다면 사이트제작 자체의 기술적 장벽은 많이 낮아졌습니다. 결국 승부는 '누가 더 코드를 잘 짜느냐'가 아니라 '누가 더 고객을 잘 이해하고 설득력 있게 구조화했느냐'에서 갈립니다.

마치며

사이트를 만든다는 것은 단순히 웹페이지를 띄우는 작업이 아닙니다. 우리 제품의 가치를 고객에게 전달하는 가장 최전선의 영업 사원을 채용하고 교육하는 과정과 같습니다.

지금 만약 사이트 리뉴얼이나 신규 제작을 앞두고 계신다면, 잠시 개발 툴을 내려놓고 화이트보드 앞으로 가시길 권합니다. "우리는 왜 이 사이트를 만드는가?" 이 질문에 대한 답이 명쾌해질 때, 비로소 성공적인 프로젝트가 시작될 것입니다. 탄탄한 기획 위에서 흔들리지 않는 제품을 만들어가시길 응원합니다.