홈페이지의 대표 이미지가 어색하다는 문제에서 시작했어요. 더 세련된 사진으로 바꾸면 해결될 것처럼 보였지만, 이미지의 분위기와 그 이미지가 증명하는 사실은 다른 문제였어요. 실제 서비스 화면과 사람의 협업 장면을 함께 놓을 때는 그 차이를 더 분명히 해야 했어요.
서비스 화면은 실제로 무엇을 만들었는지 보여줄 수 있어요. 하지만 그 화면을 크게 놓는 것만으로 성과가 검증됐다고 말할 수는 없어요. 사람의 사진은 작업의 분위기를 전할 수 있지만, 생성한 장면이라면 실제 고객이나 실제 현장 기록처럼 읽히게 해서는 안 되고요.
이미지마다 맡는 일을 정했어요
첫 장면에는 실제 서비스 화면을 사용하고 다른 영역에는 작업의 분위기를 전하는 장면을 배치했어요. 이미지 두 장을 넣었다는 사실보다 각 장면을 어떤 근거로 읽어야 하는지를 구분한 것이 중요했어요. 방문자가 실제 제품과 그 제품을 설명하는 분위기를 같은 종류의 증거로 받아들이지 않도록 했어요.
대표 장면을 바꿀 때도 참고 사이트의 사진을 가져오지는 않았어요. 이미지를 몇 장으로 나누고 글과 어떤 순서로 이어지는지라는 구조만 참고했어요. 우리에게 있는 자료와 임시로 역할을 맡은 이미지를 구분하고, 후속에 실제 자료로 바꿀 수 있게 했어요.
다른 수정에서는 밝은 운영 화면을 첫 장면으로 돌려놓는 판단도 있었어요. 같은 이미지라도 위치에 따라 읽히는 의미가 달랐기 때문이에요. 뒤쪽에서 예시로 읽히는 화면이 맨 앞에 크게 놓이면 사이트의 대표 약속처럼 보일 수 있어요. 이미지의 품질만으로 위치를 결정할 수 없었어요.
이미지 선택은 본문 문장과도 연결되어 있었어요. 생성한 협업 장면 옆에 실제 현장의 경험처럼 읽히는 문장을 붙이면 이미지 자체를 구분했어도 전체 페이지가 다른 사실을 약속할 수 있어요. 장면의 분위기와 확인한 작업의 설명을 함께 맞춰야 했어요.
실제 서비스 화면 역시 어떤 화면인지 설명이 필요했어요. 시안인지, 운영 중인 화면인지, 그 화면에서 무엇을 확인했는지가 서로 다르기 때문이에요. 화면을 크게 보여 주는 것과 그 안의 모든 숫자가 실제 성과임을 증명하는 것은 같은 일이 아니었어요.
작은 화면의 배치를 확인할 때도 장면의 의미가 달라지지 않는지 보려 했어요. 설명이 이미지에서 멀어지거나 다음 영역의 문장과 섞이면 사용자는 다른 관계로 읽을 수 있어요. 여백과 줄바꿈을 다듬는 과정은 이미지를 더 돋보이게 하는 것뿐 아니라 그 설명의 위치를 유지하는 일이기도 했어요.
글자도 같은 장면에 속해야 했어요
이미지 주변의 보조 이름과 큰 제목, 버튼의 글자는 서로 다른 역할을 가졌어요. 모든 글자를 같은 방식으로 통일하면 작은 조작까지 대표 장면처럼 강조될 수 있어요. 첫 장면의 설명과 상단의 작은 유틸리티를 구분해 읽히도록 조정했어요.
언어를 바꾸는 작업도 문장 번역으로만 보지 않았어요. 글자의 길이와 줄바꿈이 달라지면 이미지 옆에서 읽는 순서와 균형도 바뀌어요. 큰 화면에서 보이던 메뉴가 작은 화면에서도 같은 역할을 하는지, 대표 장면과 다음 내용이 자연스럽게 이어지는지를 함께 확인했어요.
기록에는 로컬에서 여러 폭의 화면과 메뉴 이동을 확인한 결과가 있어요. 하지만 생성한 협업 장면은 실제 운영 성과의 증거가 아니었어요. 이미지가 그럴듯하다는 이유로 실제 사람과 일을 했다는 설명을 덧붙이지 않았어요. 사용 허가된 현장 자료를 확보하면 교체할 후속도 남겼어요.
이 범위에서는 시각 배치와 실제 연결을 다듬었어요. 방문자가 내용을 더 신뢰하게 됐는지 실험한 결과는 없었어요. 따라서 이미지의 설득력을 성과로 셀 수는 없어요. 확인한 것은 무엇을 보여주며 어디에서 실제 자료와 분위기를 구분할지였어요.
이번 수정은 더 멋진 사진을 찾는 일에서 시작해, 사진의 역할을 정하는 일로 바뀌었어요. 홈페이지가 현재 일을 보여주려면 장면이 아름다운 것과 장면이 사실을 증명하는 것을 함께 구분해야 했어요. 실제로 가진 자료의 범위를 넘어서는 이야기는 이미지 뒤에 붙이지 않았어요.
