서비스의 친절함을 옮긴 디지털 경험의 순서
보호자를 대신하는 병원 동행 서비스의 따뜻함과 믿음을 첫 화면부터 문의하는 순간까지 느낄 수 있도록 홈페이지의 말과 순서를 만들었습니다.
앱 · 웹 제작
화면은 예뻐졌는데
문의는 그대로라면.
방문자는 메뉴를 읽지 않고 자기 질문의 답을 찾습니다. 무엇을 먼저 보여줄지 정하는 일이 디자인보다 앞섭니다. 기획부터 디자인과 개발까지 한 흐름으로 만듭니다.
한눈에 보기
홈페이지와 앱은 어떤 방식으로 만드나요?
데이브스톤은 화면을 먼저 그리지 않고 사용자가 실제로 필요한 기능부터 정합니다. 그 뒤 브랜드 메시지와 같은 기준으로 구조를 잡고 실제 운영할 수 있는 앱과 웹으로 만듭니다.
- 자체 서비스 KDramaCue, MacKeys, UtiliZest를 직접 만들고 지금도 운영하고 있습니다
- Next.js·React 기반으로 만들어 운영·수정 비용을 낮춥니다
- 홈페이지가 브랜드 메시지와 다른 말을 하고 있으면 메시지 정리부터 제안합니다
이런 고민이 있다면
- 홈페이지는 있는데 문의로 이어지지 않습니다.
- 처음 온 방문자가 무슨 서비스인지 이해하지 못합니다.
- 광고로 들어온 사람이 첫 화면에서 그냥 나갑니다.
- 기능은 많은데 무엇부터 보여줘야 할지 모르겠습니다.
- 만들어야 할 서비스는 있는데 어디서부터 시작할지 막막합니다.
- 외주를 맡겼더니 요구한 화면만 나오고 설득은 없었습니다.
화면을 만들 때 지키는 것
메뉴가 아니라 질문으로 설계합니다
사이트맵을 그리기 전에 화면마다 누구에게 무엇을 얻으려는지 적습니다. 목표가 정해진 다음에야 콘텐츠와 버튼을 붙입니다.
할 수 있는 일보다 줄어드는 일을 먼저
기능을 길게 나열하면 아무것도 남지 않습니다. 이 서비스를 쓰면 무엇이 없어지는지를 첫 화면에 놓습니다.
읽는 도중 언제든 움직일 수 있게
긴 페이지에서 결심하는 지점은 사람마다 다릅니다. 행동 지점을 한곳에만 두지 않고 구간마다 나눠 배치합니다.
글과 화면을 같은 사람이 만듭니다
카피를 따로 받아 화면에 넣으면 설득의 순서가 끊깁니다. 메시지 정리부터 디자인과 구현까지 한 흐름으로 진행합니다.
처음 온 사람이 로그인 화면을 만나던 서비스
광고로 들어온 사람이 서비스가 무엇인지 알기도 전에 로그인 화면을 만나던 구조를 바꿔, 태양광 발전 업무가 얼마나 줄어드는지부터 보여주는 랜딩페이지를 만들었습니다.
기능이 많은 서비스일수록 첫 화면에서 무엇을 말할지가 어렵습니다. 모니터링과 청구, 세무까지 하는 일을 나열하는 대신 발전 사업자의 일이 얼마나 줄어드는지를 먼저 보여줬습니다.
오솔라 랜딩페이지 케이스 자세히 보기 →서비스 성격에 따라 화면의 순서도 달라집니다
한 홈페이지에서 학부모와 예비 원장을 함께 만나기
학부모와 예비 원장이라는 서로 다른 두 방문자가 한 홈페이지에서 각자 필요한 답을 찾고 문의까지 이어지도록 사이트맵을 설계했습니다.
어디까지 필요한지 정한 뒤 견적을 드립니다.
페이지 수와 기능의 범위, 개발까지 필요한지에 따라 크게 달라집니다. 지금 있는 화면을 먼저 보고 다시 만들 곳과 그대로 둘 곳을 나눈 뒤 견적을 드립니다.
자주 묻는 질문
- 기획만, 또는 디자인만 맡길 수 있나요?
- 가능합니다. 이미 개발팀이 있는 경우 기획과 디자인까지만 맡기시는 경우가 많습니다. 반대로 아이디어만 있는 단계라면 메시지 정리부터 구현까지 이어서 진행합니다.
- 홈페이지와 랜딩페이지는 무엇이 다른가요?
- 홈페이지는 브랜드를 설명하고 여러 방문자를 상대합니다. 랜딩페이지는 하나의 행동을 목표로 삼습니다. 광고를 집행할 계획이라면 홈페이지와 별도로 랜딩페이지가 필요한 경우가 많습니다.
- 이미 있는 사이트를 고치는 것도 되나요?
- 됩니다. 전체를 다시 만드는 대신 첫 화면과 설명의 순서만 바꿔도 달라지는 경우가 있습니다. 먼저 지금 화면에서 어디가 끊기는지 보고 범위를 정합니다.
- 유지보수도 해주시나요?
- 운영 중 콘텐츠 수정과 개선은 이어서 진행할 수 있습니다. 다만 대규모 기능 개발이 계속 필요한 서비스라면 내부 개발 인력을 두시는 편이 낫다고 솔직하게 말씀드립니다.
상담