프로젝트 상담 신청 이스트소프트 - UX/UI 리뷰 | The Blue Canvas
UX/UI Review

이스트소프트 Website Design Review

2026-08-02·AI 기술 기업

AI 회사의 사이트는 기술을 설명하려다 길어진다. 이스트소프트는 그 길이를 인정하고, 대신 매 구간마다 결과물을 보여주는 쪽을 택했다.

홈페이지 제작 상담 보기

개요

핵심 요약

  • 이스트소프트의 AI 브랜드 사이트로, AI 휴먼 ‘페르소(Perso)’ 제품군을 중심으로 구성된다.
  • 대표 카피는 ‘the universal interface for human’이며, PC·모바일·웹·키오스크 등 적용 환경을 함께 명시한다.
  • 페르소 인터랙티브, 페르소 더빙, SDK, 스튜디오 페르소로 제품을 나눠 각각 사례 화면을 보여준다.
  • 글로벌 파트너 로고를 대규모로 노출해 도입 실적을 시각적으로 증명한다.
  • 홈 문서에 이미지 336장이 사용되며 지연 로딩과 WebP는 폭넓게 적용됐으나, 대체 텍스트가 없는 이미지가 270장을 넘는다.

이스트소프트의 AI 브랜드 사이트는 회사 소개보다 제품 소개에 가깝다. 첫 화면은 ‘Perso Dubbing’과 ‘the universal interface for human’으로 시작하고, 곧이어 ‘사람과 말하듯, 가장 편안한 모습으로, PC·Mobile·Web·Kiosk 등 다양한 상황에서 전 국민의 하루하루를 책임지는 AI’라는 문장이 나온다. 기술 설명이 아니라 사용 장면부터 제시하는 구성이다.

이후 화면은 매우 길다. 페르소 인터랙티브의 적용 사례, 도입 산업별 화면 모음, 글로벌 파트너 로고, SDK 안내, 페르소 더빙, 스튜디오 페르소, 서비스 표, 기술 소개, 뉴스, 그리고 문의 폼까지 한 페이지에 이어진다. 이번 리뷰에서는 이 긴 스크롤을 견디게 만드는 장치들과, 그 길이가 초래한 접근성·최적화 과제를 함께 살펴본다.

이스트소프트 웹사이트 메인 화면 스크린샷

브랜드 & 메시지

메시지는 ‘보편적 인터페이스’라는 한 문장에 걸려 있다. AI를 기술이 아니라 사람과 기계 사이의 대화 방식으로 규정하는 화법인데, AI 휴먼이라는 제품 성격과 정확히 맞물린다. 국문 카피 ‘AI로 인간을 위한 가장 보편적인 인터페이스를 만들어 갑니다’와 영문 ‘AI that warms and enriches our lives’가 나란히 놓이며, 따뜻함이라는 정서를 기술 서사에 섞는다.

흥미로운 것은 중간에 등장하는 자문형 구획이다. ‘우리는 왜 다양한 AI에 투자하고 집중하는가’라는 질문을 던지고, 흑백 도시 영상으로 화면을 채운다. 제품 나열이 이어지던 흐름에 회사의 관점을 끼워 넣는 자리인데, 긴 스크롤에서 톤을 바꾸는 쉼표 역할도 겸한다. 시각 언어는 화이트 기반에 제품 화면의 색을 그대로 살리는 방식이고, SDK 구획에서만 무지개 그라디언트를 써서 개발자 대상 영역을 시각적으로 구분한다.

키워드: 보편적 인터페이스 규정, 사용 장면 우선, 자문형 쉼표 구획, 대상별 색 구분

UX/UI 관점

강점은 여섯 가지다. 첫째, 제품을 인터랙티브·더빙·SDK·스튜디오 네 갈래로 나누고 각각에 독립 구획을 줬다. 한 페이지 안이지만 제품별 경계가 명확해, 특정 제품을 찾아온 방문자도 자기 구간을 인지할 수 있다. 둘째, 각 제품 구획을 설명이 아니라 화면 모음으로 채웠다. AI 휴먼처럼 결과를 봐야 이해되는 제품에서 이 방식은 문단 열 개보다 효율적이다.

셋째, 도입 사례를 산업별 격자로 배치해 ‘어디에 쓰이는가’를 한눈에 보여준다. 넷째, 글로벌 파트너 로고를 대규모로 노출했다. B2B 기술 제품에서 도입사 목록은 가장 강력한 신뢰 신호이며, 특히 자사 기술을 직접 검증할 수 없는 방문자에게 판단 근거가 된다. 다섯째, SDK 구획을 별도 색면으로 분리해 개발자 대상 정보와 의사결정자 대상 정보를 시각적으로 나눴다. 여섯째, 페이지 끝에 문의 폼을 두되 그 앞에 뉴스와 기술 구획을 배치해, 검토가 끝난 사람만 폼에 도달하도록 순서를 잡았다. 다만 이 정도로 긴 페이지라면 화면 우측에 구획 목차나 진행 표시를 상시 노출하는 편이 이탈을 더 줄일 수 있다.

키워드: 제품별 구획 경계, 화면으로 설명, 산업별 사례 격자, 파트너 로고의 신뢰 효과

IA·SEO 전략

메타 설정은 잘 되어 있다. 제목 ‘ESTsoft - The most universal interface for human’, 국문·영문이 함께 담긴 description, canonical, Open Graph, 그리고 3개 언어에 대한 hreflang 선언까지 확인된다. 글로벌 사업을 염두에 둔 구성이다.

과제는 두 가지다. 하나는 h1이 세 개 존재하고 모두 같은 문구라는 점이다. 반응형 레이아웃마다 별도 마크업을 두면서 생긴 것으로 보이는데, 화면 폭에 따라 하나만 노출되더라도 문서 구조 상으로는 제목이 셋인 셈이다. 다른 하나는 원페이지 구조 자체다. 페르소 인터랙티브, 페르소 더빙, 스튜디오 페르소는 각각 독립된 검색 수요를 가진 제품인데, 지금은 모두 하나의 URL 안에 있다. 제품별 페이지를 열고 각각에 고유한 제목·설명과 SoftwareApplication·Product 구조화 데이터를 부여하면 ‘AI 더빙 솔루션’, ‘AI 휴먼 키오스크’ 같은 검색을 직접 받을 수 있다. AI 분야는 검색어가 빠르게 늘어나는 영역이라, 페이지 단위를 잘게 나눠둘수록 유리하다.

성능·접근성

홈 문서 크기가 1.9MB에 이르고 이미지가 336장 사용된다. 다행히 지연 로딩이 248장에 적용돼 있고 WebP도 117건 확인되어, 규모에 비해 관리가 되고 있는 편이다. 다음으로 볼 것은 문서 자체의 무게다. 원페이지에 모든 제품 구획을 담다 보니 초기 HTML이 커졌는데, 제품별 페이지 분리는 검색뿐 아니라 성능 측면에서도 이득이다. 페이지 빌더 기반으로 제작된 사이트에서는 자동 생성되는 래퍼 요소가 누적되기 쉬우므로, 주기적인 정리가 필요하다.

접근성에서 가장 큰 문제는 대체 텍스트다. 336장 중 274장에 대체 텍스트가 없다. 제품 화면 캡처와 사례 이미지가 정보의 상당 부분을 담고 있는 사이트에서, 이 이미지들이 보조기기 사용자에게는 존재하지 않는 것과 같다. 장식용과 정보용을 구분해, 정보용에는 설명을 넣고 장식용은 명시적으로 감추는 정리가 필요하다. h1 중복 정리, 그리고 긴 페이지에서의 건너뛰기 링크 제공도 함께 검토할 만하다.

자주 묻는 질문

AI 기술 기업의 홈페이지는 무엇을 먼저 보여줘야 하나요?

기술 설명보다 사용 장면입니다. 이스트소프트처럼 ‘PC·모바일·키오스크에서 이렇게 쓰인다’를 화면으로 먼저 보여주면, 기술 배경이 없는 의사결정자도 도입 후 모습을 상상할 수 있습니다.

제품이 여러 개인 회사가 원페이지 사이트를 쓰면 어떤 손해가 있나요?

제품별 검색 수요를 받지 못합니다. 각 제품이 독립된 검색어를 갖는데 URL이 하나뿐이면 노출될 페이지가 없습니다. 제품별 페이지를 열고 고유한 제목·설명과 구조화 데이터를 부여하는 것이 기본입니다.

이미지에 대체 텍스트가 없으면 어떤 문제가 생기나요?

스크린리더 사용자에게 그 이미지의 정보가 전달되지 않고, 검색엔진도 이미지의 맥락을 파악하지 못합니다. 제품 화면처럼 정보를 담은 이미지라면 손실이 특히 큽니다. 장식용 이미지는 명시적으로 감추고 정보용에는 설명을 다는 구분이 필요합니다.

스크롤이 매우 긴 페이지의 이탈을 줄이려면 무엇이 필요한가요?

현재 위치를 알려주는 장치입니다. 우측 고정 목차나 진행 표시줄을 두면 남은 분량이 예측되어 이탈이 줄고, 특정 구획으로 바로 이동하려는 사용자의 탐색 비용도 사라집니다.

디지털 파트너 더블루캔버스

기술 기업의 사이트는 설명해야 할 것이 많다. 그래서 페이지가 길어지고, 길어질수록 검색에는 불리해진다. 모든 제품이 하나의 URL 안에 들어가면 어떤 제품명으로도 상위 노출되기 어렵기 때문이다. 화면의 완성도와 검색 성과가 반비례하는 전형적인 구조다.

The Blue Canvas(더블루캔버스)는 이런 사이트에서 페이지 단위를 다시 나누는 일부터 시작한다. 어떤 제품을 독립 URL로 열지, 홈에는 무엇을 남길지, 각 페이지에 어떤 구조화 데이터를 붙일지를 정한다. 홈페이지 제작과 SEO 검색엔진 최적화를 나누지 않고 하나의 설계로 다루는 이유다.

The Blue Canvas 홈페이지 제작 문의

마무리와 다음 스텝

이스트소프트의 AI 사이트는 보여줄 것이 많은 회사가 그 많음을 어떻게 다룰지 고민한 흔적이 뚜렷하다. 사용 장면을 먼저 제시하고, 제품별로 구획을 나누고, 파트너 로고로 도입 실적을 증명하고, 중간에 관점을 끼워 넣어 톤을 환기한다. 규모에 비해 지연 로딩과 이미지 포맷 관리도 잘 되어 있다.

실행 제안은 셋이다. 첫째, 이미지 대체 텍스트를 정리한다. 274장이라는 수치는 접근성뿐 아니라 검색 측면에서도 큰 손실이다. 둘째, 제품별 독립 페이지를 열고 구조화 데이터를 부여해 제품명 검색을 받는다. 셋째, h1 중복을 정리하고 긴 페이지에 위치 표시 장치를 추가한다. 콘텐츠의 밀도가 높은 사이트인 만큼, 구조를 나누는 것만으로 얻을 것이 많다.