프로젝트 무료 상담 신청 이노컴즈 - UX/UI 리뷰 | The Blue Canvas
UX/UI Review

이노컴즈 Website Design Review

2026-01-15·브랜드/웹 리뷰

블랙과 네온 그린의 대비로 IT 전문성을 각인시키는 이노컴즈 웹사이트를 분석합니다. 키링 모티프 히어로와 MES·AI·클라우드로 나뉜 OUR CORE 구조, 제조 현장 포트폴리오의 정보 설계와 전환 흐름을 UX/UI 관점에서 짚습니다.

협업 문의 및 자세히 보기

개요

이노컴즈(INOCOMS)는 웹·앱·플랫폼 구축부터 AI 전환, 그리고 공장 현장을 겨냥한 스마트팩토리 솔루션까지 다루는 IT 전문 기업이다. 홈페이지는 첫 화면에서 그 정체성을 곧장 드러낸다. 짙은 블랙 배경 한가운데에 금속 키링이 걸려 있고, 그 고리에 APPLICATION·AI Transformation·Architecture 세 개의 태그가 매달려 흔들린다. 회사가 쥐고 있는 세 개의 열쇠를 은유한 히어로다. 바로 아래로 ‘비즈니스 성장을 돕는 IT 전문 기업’이라는 한 줄과 SINCE 2001, PROJECT 1000+라는 숫자가 이어진다.

이번 리뷰는 이 웹사이트가 B2B IT 서비스의 신뢰를 어떻게 시각화하는지, OUR CORE에서 OUR WORKS로 흐르는 서사가 방문자를 문의까지 끌고 가는지, 그리고 홈페이지 제작 관점에서 손볼 지점은 어디인지를 화면에 실제로 보이는 근거만으로 따라간다.

이노컴즈 웹사이트 메인 스크린샷

브랜드 & 메시지

브랜드가 고른 색은 사실상 두 가지다. 화면의 대부분을 삼키는 블랙, 그리고 푸터와 페이지 맨 아래 거대한 INOCOMS 워드마크에서 한 번에 터지는 네온 그린. 이 절제된 대비가 ‘기술 회사’라는 인상을 군더더기 없이 만든다. 헤드라인 ‘비즈니스 성장을 돕는 IT 전문 기업’은 대상 고객(기업)과 약속(성장)을 한 문장에 담아 가치 제안이 분명하다.

상단 내비게이션은 ABOUT·PORTFOLIO·CONTACT 세 항목에 문의하기 버튼 하나로 단출하다. 방문 목적이 명확한 B2B 사이트에 어울리는 절제다. 하단에서는 ‘ALWAYS INTERESTED IN HEARING ABOUT NEW PROJECTS’라는 굵은 영문 헤드라인과 CONTACT US 버튼이 강한 마침표를 찍고, 파란 블롭과 붉은 캐릭터 마스코트가 딱딱해지기 쉬운 IT 이미지를 부드럽게 눌러 준다. 웹디자인의 온도를 조절하는 작지만 영리한 장치다.

키워드: 블랙 × 네온 그린 대비, 키링 은유, 절제된 3항목 내비게이션, 마스코트로 완화한 톤

UX/UI 관점

화면을 훑으면 이 사이트가 잘 짜인 강점을 여럿 갖고 있음이 보인다.

첫째, OUR CORE의 카드 4종(Application Development, AI Transformation, Enterprise Solutions, Cloud Infrastructure)은 왼쪽 설명, 가운데 Technique 태그, 오른쪽 이미지라는 동일한 리듬을 반복해 스캔이 편하다. 둘째, 각 카드의 Technique 필(Platform, LLM, Smart Factory, Kubernetes 등)이 추상적 역량을 구체 키워드로 번역해 신뢰를 준다. 셋째, OUR WORKS에서 생산물류 PDA App, 플로포밍 모니터링, 자재 관리, 주조 생산정보 모니터링 시스템 같은 실제 프로젝트 썸네일을 그대로 노출해 ‘말’ 대신 ‘결과물’로 설득한다. 넷째, DOOSAN·HYUNDAI·SAMSUNG·HD현대중공업 로고 벨트가 사회적 증거로 작동한다. 다섯째, SINCE 2001과 PROJECT 1000+라는 숫자가 연차와 실적을 한눈에 압축한다. 여기에 영문 대문자 헤딩과 한글 서브카피를 겹친 이중 위계까지 더하면, 정보 밀도를 낮추면서도 전문성을 유지하는 UX/UI 감각이 읽힌다.

IA·SEO 전략

구조는 단정하지만 검색 관점에서는 아쉬움이 남는다. OUR CORE, OUR WORKS 같은 영문 헤딩은 시각적으로는 멋지되 검색 엔진에 전달되는 한글 키워드가 얇다. ‘스마트팩토리 구축’, ‘주조 MES’, ‘물류 모니터링 시스템’처럼 이노컴즈가 실제로 강한 산업 용어를 H2·본문에 한글로 심으면 유입의 폭이 넓어진다.

포트폴리오도 지금은 이미지 그리드에 가깝다. 생산물류 PDA App, 주조 생산정보 모니터링 같은 사례마다 고유 상세 페이지를 두고 각기 다른 title과 meta description, 도입 배경·적용 기술·성과를 서술형으로 담으면, 제조 IT를 검색하는 담당자에게 그대로 랜딩 페이지가 된다. Organization 구조화 데이터(대표번호 1544-8310, service@inocoms.net, 사업자 정보)를 정비하는 것도 브랜드 검색 결과의 완성도를 높이는 확실한 한 수다.

성능·접근성

비주얼이 화려한 만큼 무게 관리가 관건이다. 히어로의 금속 키링 렌더, 코드 화면·AI 두뇌 같은 OUR CORE 카드 이미지, 고객사 로고와 주조·물류 현장이 담긴 포트폴리오 썸네일이 겹겹이 쌓인다. 첫 화면 히어로는 지연 로딩을 피해 곧장 띄우되 원본 용량을 최적화하고, 스크롤 아래 이미지는 WebP/AVIF와 지연 로딩으로 초기 LCP 부담을 덜어야 한다.

접근성에서는 대비를 챙길 지점이 있다. 푸터의 네온 그린 배경 위 어두운 텍스트, 그리고 카드 위 작은 필 태그의 명도 대비가 기준을 만족하는지 점검이 필요하다. 영문 대문자 헤딩은 스크린리더에서 철자 단위로 읽힐 수 있으니 의미 있는 대체 텍스트와 시맨틱 태그를 병행하는 편이 안전하다. 마스코트처럼 장식 목적의 이미지는 대체 텍스트를 비워 스크린리더의 잡음을 줄이면 된다.

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

제조와 IT 솔루션을 다루는 기업의 홈페이지는 ‘멋진 화면’만으로 끝나지 않는다. 검색으로 발견되고, 사례로 신뢰를 쌓고, 문의로 이어지는 한 흐름이 설계되어야 한다. The Blue Canvas는 바로 그 연결을 만든다. 이노컴즈처럼 산업 전문성을 가진 기업을 위해, 브랜드 톤을 살린 웹사이트 제작과 웹디자인부터 산업 키워드를 겨냥한 SEO 검색엔진최적화, 그리고 유입을 문의로 바꾸는 퍼포먼스 마케팅까지 하나의 로드맵으로 엮는다. 포트폴리오를 검색 자산으로 바꾸는 정보 설계, 전환을 겨냥한 UX/UI 개선이 필요한 시점이라면 논의를 시작할 가치가 있다.

The Blue Canvas 바로가기

마무리와 다음 스텝

이노컴즈 웹사이트는 블랙과 네온 그린이라는 절제된 색, 키링 은유의 히어로, 실제 프로젝트를 앞세운 구성으로 B2B IT 기업의 신뢰를 설득력 있게 그려낸다. 여기에 세 가지를 더하면 완성도가 올라간다. 첫째, OUR WORKS 사례마다 고유 상세 페이지와 한글 메타데이터를 붙여 포트폴리오를 검색 유입 자산으로 전환한다. 둘째, 스마트팩토리·MES 같은 산업 키워드를 본문에 명시해 검색 노출을 넓힌다. 셋째, 스크롤 하단 이미지의 포맷·지연 로딩과 네온 그린 대비를 점검해 성능과 접근성의 바닥을 다진다. 이 세 걸음이면 지금의 좋은 인상이 실제 문의로 이어지는 홈페이지 제작의 다음 단계에 도달한다.