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

기가비스 Website Design Review

2026-08-19·반도체 검사장비

반도체 장비 회사 홈페이지는 대개 제품 사양표로 시작한다. 기가비스는 대신 ‘완벽을 향해’라는 문장으로 시작한다.

홈페이지 제작 상담 보기

개요

핵심 요약

  • 기가비스는 반도체 자동 광학 검사·수리 장비를 만드는 기업으로, 히어로 문구는 ‘Beyond Inspection, Toward Perfection’이다.
  • 솔루션을 Device·AI·Mobility·Robotics 세 카드로 나눠 소개한 뒤, 제품 라인업으로 AOI·AOR·VRS·FA·Software/AI Platform을 배치한다.
  • ‘ANNOUNCING THE BRAND VALUE OF GIGAVIS’ GLOBAL NO.1 TO THE WORLD’라는 대형 타이포 구획 아래 주가 정보와 IR Contact를 함께 배치한다.
  • 윤리경영·안전보건경영·품질경영을 다루는 ESG 카드 섹션을 별도로 운영한다.
  • 한국어 화면 기준으로 일본어(日本語), 영어(/en/main) 버전 링크가 확인돼 다국어로 운영되고 있다.

기가비스는 반도체 자동 광학 검사(AOI)와 수리 장비를 만드는 기업이다. 첫 화면은 어두운 배경에 반쯤 흐릿하게 처리된 회로·데이터 이미지와 ‘Giga Vision Inspection System’ 문구로 시작하고, 이어 ‘Beyond Inspection, Toward Perfection’이라는 슬로건이 화면 중앙에 크게 배치된다.

스크롤을 내리면 Device·AI·Mobility·Robotics 세 솔루션 카드가 순서대로 등장하고, 각 카드마다 ‘사람의 눈이 닿지 않는 곳에서 반도체 산업의 변화와 함께 걸어왔습니다’처럼 짧은 문장이 붙는다. 이어 제품 라인업(AOI, AOR, VRS, FA, Software/AI Platform), ‘GLOBAL NO.1’ 대형 타이포와 주가·IR·고객지원·인재채용 카드, ESG 3카드, 뉴스룸 순서로 이어진다. 이번 리뷰에서는 다크 톤과 스크롤 연출로 제품 라인업과 투자정보·ESG라는 서로 다른 성격의 정보를 어떻게 한 화면에 묶었는지를 살펴본다.

기가비스 웹사이트 메인 화면 스크린샷

브랜드 & 메시지

브랜드 화법의 핵심은 ‘보이지 않는 곳의 기술력’이다. ‘사람의 눈이 닿지 않는 곳에서’라는 표현으로 검사 장비라는 업종 특성 — 반도체 공정의 미세한 결함을 대신 찾아내는 역할 — 을 문장으로 옮기고, ‘끊임없이 진화하는 AI 시대’, ‘더 나은 세상을 향한 도전’ 같은 문장으로 기술 기업으로서의 지향점을 덧붙인다.

시각 언어는 검정과 남색을 기본으로 한 다크 톤에 금색·파란색 포인트를 더한다. 반도체 회로 이미지를 배경으로 반복 사용해 업종을 시각적으로 각인시키고, GSAP과 ScrollTrigger를 이용한 스크롤 연출로 솔루션 카드가 순서대로 강조되도록 했다. ‘GLOBAL NO.1’ 구획에서는 배경을 흰색으로 전환해 투자정보·재무 데이터를 다루는 영역임을 톤 변화로 구분한다.

키워드: 보이지 않는 기술력, 다크 톤과 회로 이미지, GSAP 스크롤 연출, 톤 전환으로 영역 구분

UX/UI 관점

강점은 다섯 가지다. 첫째, Device·AI·Mobility·Robotics 세 카드로 사업 영역을 먼저 요약한 뒤 제품 라인업으로 내려가는 순서를 둬, 처음 방문한 사람도 회사가 다루는 범위를 빠르게 파악하게 한다. 둘째, 제품 라인업 구획에서 AOI·AOR·VRS·FA·Software/AI Platform을 동일한 카드 형태로 배열해, 제품군이 늘어나도 구조가 일관되게 유지되도록 설계했다.

셋째, 투자정보 구획에 주가·재무정보·공시정보·IR Contact를 한데 모아, 상장기업 사이트에서 투자자가 가장 자주 찾는 정보를 흩어놓지 않았다. 넷째, ESG를 윤리경영·안전보건경영·품질경영 세 카드로 나눠 제시해, 제조업 특성상 중요하게 다뤄지는 안전·품질 이슈를 투자정보와 나란히 배치했다. 다섯째, GSAP·ScrollTrigger 기반의 스크롤 연출을 제품 소개 구획에 적용해, 정적인 카드 나열 대신 스크롤에 반응하는 인터랙션으로 전문성을 표현한다. 여섯째, 화면 하단에 뉴스룸을 배치해 최신 소식을 확인할 수 있게 하고, 이 위치가 ESG·투자정보 다음이라는 점에서 정보 위계(제품→투자자정보→ESG→뉴스)가 뚜렷하다.

키워드: 3카드 사업 영역 요약, 통일된 제품 카드 구조, 투자정보 집약, ESG 3분류

IA·SEO 전략

title은 ‘기가비스 – GigaVis’, meta description은 ‘반도체 자동 광학 검사 및 수리 분야의 글로벌 리더’로 업종과 제품군(AOI, AOR, VRS)을 명시한다. 다만 페이지 소스에서 canonical 태그와 JSON-LD 구조화 데이터는 확인되지 않았다. 한국어(kr) 화면 기준으로 일본어(日本語), 영어(/en/main) 버전 링크는 확인되지만, hreflang 선언 역시 소스에서 보이지 않는다.

og:image는 절대 URL로 제공돼 있지만, canonical 부재와 다국어 hreflang 미선언은 상장기업 사이트로서는 아쉬운 지점이다. 여러 언어 버전이 존재하는 만큼 hreflang을 선언하면 각 언어권 검색 결과에서 올바른 버전이 노출되고, Organization과 제품 관련 구조화 데이터를 더하면 ‘반도체 AOI 장비’, ‘반도체 검사 수리 솔루션’ 같은 업종 키워드 검색과 AI 답변 인용 모두에 유리해진다.

성능·접근성

배경에 반도체 회로·기판 이미지를 반복 사용하고 GSAP·ScrollTrigger, Swiper, Chart.js 등 다수의 스크립트를 불러온다. 다크 톤 배경에 고해상도 이미지가 여러 장 겹쳐 쓰이는 구성이라, 제품 라인업과 뉴스룸처럼 이미지가 몰린 구획부터 다음 세대 포맷과 지연 로딩 적용 여부를 점검할 필요가 있다. 주가 정보처럼 실시간성이 필요한 데이터는 초기 HTML에 포함되지 않고 스크립트로 채워지는 것으로 보여, 이 영역의 로딩 시점도 함께 확인할 만하다.

접근성 측면에서는 검정·남색 배경 위 회색조 보조 텍스트의 대비를 확인할 필요가 있다. 투자자와 협력사 담당자가 재무정보·공시정보를 빠르게 찾아야 하는 상황을 고려하면, 표 형태 데이터의 키보드 탐색과 스크린리더 대응도 점검 대상이다.

자주 묻는 질문

반도체 검사장비 기업 홈페이지에는 어떤 정보가 꼭 있어야 하나요?

제품 라인업, 투자정보(IR), ESG 활동 세 가지가 기본입니다. 기가비스처럼 이 세 정보를 별도 구획으로 나눠 제공하면 고객사, 투자자, 협력사가 각자 필요한 정보를 빠르게 찾을 수 있습니다.

상장기업 홈페이지에 canonical 태그가 없으면 어떤 문제가 생기나요?

검색엔진이 어떤 URL을 대표 페이지로 인식해야 할지 판단하기 어려워질 수 있습니다. 특히 다국어 버전이 함께 운영되는 사이트라면 canonical과 hreflang을 함께 선언해 언어별 페이지가 서로 충돌하지 않게 하는 것이 안전합니다.

제조업 기업 홈페이지에서 ESG 정보는 왜 중요한가요?

투자자와 거래처 모두 ESG 활동을 평가 기준으로 삼는 경우가 늘고 있기 때문입니다. 윤리경영, 안전보건경영, 품질경영처럼 항목을 나눠 제시하면 어떤 기준으로 활동하는지 구체적으로 전달할 수 있습니다.

제조업 홈페이지에 GSAP 같은 스크롤 애니메이션을 쓰면 실제로 효과가 있나요?

제품이나 기술을 시각적으로 설명하기 어려운 업종에서는 스크롤에 반응하는 연출이 전문성을 전달하는 데 도움이 됩니다. 다만 과도하게 쓰면 로딩과 접근성에 부담을 줄 수 있어 핵심 구획에 절제해 적용하는 편이 좋습니다.

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

제조·장비 기업의 홈페이지는 고객사·투자자·구직자처럼 서로 다른 방문 목적을 한 사이트에서 동시에 감당해야 한다. 제품을 설명하는 언어와 투자정보를 설명하는 언어, ESG를 설명하는 언어가 모두 달라서, 이 세 축을 하나의 구조 안에 정리하지 못하면 방문자마다 원하는 정보를 찾는 데 시간이 걸린다.

The Blue Canvas(더블루캔버스)는 제조·기술 기업 홈페이지에서 제품, 투자정보, ESG처럼 성격이 다른 정보군을 명확한 구획과 내비게이션으로 분리하고, 여기에 다국어 hreflang과 구조화 데이터를 더해 검색과 AI 답변 양쪽에서 발견되도록 설계한다.

The Blue Canvas 홈페이지 제작 문의

마무리와 다음 스텝

기가비스의 사이트는 다크 톤과 스크롤 연출로 ‘완벽을 향한 기술력’이라는 인상을 만들면서도, 제품 라인업·투자정보·ESG라는 서로 다른 정보군을 뚜렷한 구획으로 분리해 상장 제조기업 사이트로서 갖춰야 할 구조를 대체로 갖췄다. 다국어로 운영되는 점도 글로벌 고객사·투자자를 함께 상대하는 업종 특성에 맞는 선택이다.

실행 제안은 셋이다. 첫째, canonical과 hreflang을 선언해 다국어 버전 간 검색 노출을 명확히 정리한다. 둘째, Organization과 제품 관련 구조화 데이터를 추가해 업종 키워드 검색과 AI 답변 인용 범위를 넓힌다. 셋째, 이미지가 몰린 제품·뉴스 구획부터 로딩 최적화를 점검해 다크 톤 특유의 고해상도 이미지 부담을 줄인다.

함께 보면 좋은 리뷰

리뷰 전체 보기