M Line Studio

VR 솔루션 벤쳐 기업

엠라인 스튜디오

VR(가상현실) 하드웨어와 콘텐츠를 전문으로하는 (주)엠라인스튜디오 기업 웹사이트 리뉴얼 프로젝트 담당하여 웹사이트 컨셉 기획부터 디자인과 웹사이트 구축 및 퍼블리싱 전반에 이르는 업무를 수행하였습니다.

‘GD Web Award(굿디자인 웹 어워드)’에서 위너 프라이즈를 수상한 본 프로젝트는 UI와 페이지 디자인, 레이아웃을 비롯한 모든 요소들을 커스터마이징하여 여타 워드프레스 사이트들과 차별화되며, 기업의 아이덴티티가 잘 표현된 웹사이트 제작에 주력하였습니다.

제품 문의 솔루션 페이지는 방문 고객이 VR 소프트웨어와 하드웨어를 단계별 선택/조합하여 상세한 문의를 접수할 수 있는 솔루션으로 별도 개발을 진행하였습니다.

– Full Width Rolling Banner & Parallax Scrolling –

메인 페이지를 비롯한 모든 페이지들의 상단에는 패럴렉스 (Parallax) 효과가 가미된 풀 와이드 롤링(Full Width Rolling) 배너를 적용하였으며, 페이지의 중간 중간에도 패럴렉스 (Parallax) 효과를 가미하여 트렌드를 반영했습니다.

– Design Concept Planning –

VR(가상현실) 하드웨어와 콘텐츠를 전문으로하는 IT Tech 기업 (주)엠라인스튜디오의 아이덴티티를 고려하여 웹사이트에서 사용될 폰트들을 규정하였으며, 컬러 컨셉은 기업 로고의 컬러를 참고하여 최근 트랜드 컬러를 메인으로 설정하고 서브 컬러들을 규정하였습니다. 화이트와 블루 계열의 라이트 그레이 컬러, 블랙 컬러를 번갈아 배경에 사용하여 세련되고 고급스러운 톤앤매너를 의도하였습니다.

보다 젊은 기업 이미지와 웹사이트의 재미를 위해 중심적인 기술 설명을 위한 아이콘들은 동적인 애니메이션 아이콘으로 제작하여 적용하였습니다.

– UI Design, Header & Footer –

엠라인스튜디오 웹사이트 UI의 특징적인 부분은 드롭 다운 메가 메뉴(Drop down mega menu)로 구성 된 헤더(Header) 메뉴 입니다.
드롭 다운 메가 메뉴는 헤더 메인 메뉴에 마우스 오버시에 드롭 다운 되는 서브 메뉴가 전체 너비( Full Width)로 구현되며, 경우에 따라서 각 메인 메뉴 항목별로 다른 구성(썸네일 이미지 포함)을 보여줄 수도 있는 형식으로써 주로 사이트맵이 복잡한 대형 웹사이트에 사용되곤 합니다.

엠라인스튜디오 웹사이트의 푸터(Footer)는 사이트맵 없는 미니멀한 스타일로 기본 정보와 SNS 링크, 회사소개서 및 제품 카탈로그 다운로드 링크의 3컬럼 형식으로 구성하여 새련된 Tech 기업 이미지를 의도하였습니다.

– Video, Animation & Interactive –

About

엠라인스튜디오 소개

XR SOLUTION PLANNER

가치를 창출하는 제품

Product 01

SAFELINE

맞춤형 VR 안전 콘텐츠

‘세이프라인(SAFELINE) 시리즈’는 엠라인스튜디오가 자체 개발한 콘텐츠 브랜드입니다. 인증된 지적 재산권 및 저작권, 공동저작권을 보유하여 서비스하고 있습니다.

Product 02

VR Carrier

집체 교육용 무선 VR 패키지

‘VR 캐리어(VR CARRIER)’는 엠라인스튜디오의 무선 VR 교육 패키지 입니다. ‘VR 캐리어(VR CARRIER)’는 기존의 어렵고 번거롭던 VR 교육을 쉽고 편리하게 만들어줍니다.

교육의 본질에 집중

효과적인 교육을 위해서는 실제와 같은 작업 수행, 반복 학습, 맥락이 고려된 시나리오, 그리고 즉각적인 평가가 필수입니다. 우리는 이 4요소를 완벽하게 반영합니다.

종합적인 접근

우리는 장비 선정, 커리큘럼 설계, UI 디자인 , 공간 구현까지, 운영자와 교육생 모두에게 가장 친화적인 방식으로 시스템을 구축합니다. 결과물은 언제나 고객의 기대를 뛰어넘습니다.

퀄리티 보장

실제와 가까운 그래픽은 사용자 몰입도를 증대시키고 프레임율의 향상은 멀미를 방지합니다. 수많은 시행착오를 거치며 형성된 기술 노하우로 업계 최고의 퀄리티를 보장합니다.

(주)엠라인스튜디오 기업 웹사이트 리뉴얼 프로젝트에서 중점을 두었던 또한가지 포인트는 다채로운 움직임이 있는 웹사이트 입니다.

미리보기 동영상이 루프되는 풀 와이드 동영상 배너, 미니멀한 애니메이션이 있는 아이콘들, 페이지 스크롤링에 따라 인터렉티브하게 등장하는 이미지와 텍스트 그리고 버튼 등 전반적인 웹사이트의 구성 요소들이 정적인 레이아웃으로 고정되어 잇지 않고 방문 고객의 페이지 탐색에 따라 흥미진진하게 움직임을 보여주는 웹사이트로 구현하기 위해 많은 요소들에 섬세한 기획과 작업 공정을 거쳐 완성되었습니다.

– Product Solution Development –

< 영상 출처 : 엠라인스튜디오 웹사이트 https://m-line.tv >

엠라인스튜디오 웹사이트 리뉴얼 프로젝트에는 “제품 조합 문의 솔루션”의 개발이 포함되었습니다.
방문 고객이 구매 상담을 원하는 복수의 소프트웨어와 하드웨어, 그리고 체험 공간 형태 등을 실시간 조합 이미지를 참조로 선택하여 제품 패키지를 조합한 뒤 완성된 상담 문의 내용을 담당자에게 제출하면 담당자가 이메일로 확인하는 프로세스의 솔루션 입니다.

– Portfolio Gallery & Portfolio Post Template –

새로운 엠라인스튜디오 기업 웹사이트의 포트폴리오 갤러리는 카테고리 필터 아래에 카테고리별 대표(최신) 포트폴리오 롤링 배너가 있고 그 아래에 3컬럼 포트폴리오 갤러리가 있는 독특한 레이아웃을 구현하여 획일화 된 포트폴리오 갤러리의 포맷에서 탈피했습니다.

또한, 디자인 작업과 컨폼을 거쳐 포트폴리오 싱글 포스트의 템플릿을 작성하여 클라이언트사에 제공해드리고, 매뉴얼을 작성/제공해드림으로써 웹사이트 완성 이후 직접 업데이트가 가능하시도록 지원해드렸습니다.

– Product Post Template –

리뉴얼 엠라인스튜디오 웹사이트는 포트폴리오 싱글 포스트 뿐만 아니라 소프트웨어와 하드웨어 제품 상세 페이지도 각각 디자인 작업과 컨폼을 거쳐 템플릿 페이지를 작성하여 클라이언트사에 제공해드리고, 매뉴얼을 작성/제공해드림으로써 웹사이트 완성 이후 직접 업데이트가 가능하시도록 지원해드렸습니다.

– Contact & Job Offer –

엠라인스튜디오 웹사이트의 컨택(Contact) 페이지에는 “견적문의”와 “채용지원”의 두가지 서브 메뉴가 있으며, 토글로 전환되는 구성 입니다.
두가지 폼 모두 디자인 커스터마이징하여 전체적인 웹사이트의 디자인 컨셉을 적용시켰으며, 채용지원(Job Offer)의 경우 “입사지원” 버튼 클릭을 통해 반응형 입사지원 폼이 팝업되는 독특한 스타일을 구현하였습니다.