[웹 사이트 제작분석] 함께 발전하는 기업, 포스코O&M

 

안녕하세요~!! 소프트랩스입니다.

2022년 검은호랑이의 해 모두 새해 복 많이 받으셨나요??

새해를 맞이하여 모두가 부자되길 바라며 부동산, 건축 관련된 기업의 웹 사이트를 소개해드리겠습니다!

저희가 이번에 소개해드릴 웹 사이트는 포스코 O&M 인데요!!

다같이 들어가 보시죠~!

 

 

 

https://www.poscoonm.com/

포스코O&M - 포스코오앤엠

믿고 맡기는 회사, 함께 하고 싶은 회사

www.poscoonm.com

 

이름에서 부터 알 수 있듯이 포스코 그룹에 속해있는 회사로서 예전에는 다른 이름이었다가

합병 되면서 바뀌었다고 하죠!

 

주요 업무는 포스코 건설 안에서 포스코그룹 회사들의 사옥관리와 부동산 자산관리 등을 담당한다고 합니다.

건물의 시설관리 및 프로젝트까지 부동산 가치를 상승시켜준다고 하네요.

그리고 또 다른 사업요소는 환경 관련 하수처리와 지역 난방 등 다방면으로 이로운 일을 하는 기업인것 같습니다.

기업 소개 홈페이지인 만큼 기능 보다는 정보를 전달하는데 중점을 준 사이트라는게 딱 느껴지네요.

자 그럼 기업 소개는 이정도로 하고 웹 사이트의 디자인과 기능 등을 분석해 볼까요~?

 

 

먼저 메인 홈페이지 입니다.

큰 국영기업을 모회사로 둔 만큼 차분한 인상의 index 페이지를 보실 수 있습니다.

그 차분함 중에 편집 느낌으로 분할된 메인 베너의 디자인은 고급스러움을 느끼게 해주는 중요한 요소로 보여지네요.

 

1. header부분에 GNB 호버 시 화면 위에서 내려오는 서브 내비의 디자인은 posco의 시그니처 컬러 파란색을 이용해

밋밋해 보일 수 있는 메인 홈페이지에 기업의 정체성과 강약 조절을 살려 주었습니다.

 

2. 구 형태의 메뉴창을 만들어 autoGallery 효과를 추가하여 해당 메뉴가 active 상태일 때 사이드에 돌아가는 라인으로

재밌는 효과를 만들어 냈습니다.

 

 

홈페이지에 메인 섹션은 5개로 전체적으로 편집 느낌이 강한 느낌을 줬군요.

오토겔러리 형식에 라인을 적절하게 사용하여 오토갤러리 효과를 주는게 인상적입니다.

라인이 원을 따라 타이머처럼 움직이는 애니메이션으로 앞으로 일어날 이벤트를 잘 설명해주는 느낌입니다.

전체적으로 사진 이미지의 크기가 압도적이라 시원시원해 보이고 답답한 기분이 뻥 뚤리는 느끼이지 않나요?

하지만 자세히보기 버튼을 호버했을 때 가상태그를 이용한 애니메이션을 넣어주었는데 글자를 순간 가려지는 순간이

있는데 조금은 신경 쓰이네요.

 

 

상단의 사이드 메뉴를 눌러보면 전부다 회사소개를 해주는 메뉴 버튼들입니다.

좌측 이미지 background 부분에 숲을 집어넣어 편안한 분위기와 친환경적 느낌을 살리고 좌우 메뉴 버튼들의 배열은

가로 배열에 안정적인 느낌을 자아냅니다.

 

 

header에 기업 시민 버튼를 누르니 새로운 페이지로 넘어가는군요.

main 전체는 swiper 효과로 섹션이 넘어가는데

귀여운 사이드 페이지네이션도 호버하니 색깔이 변하고 귀엽습니다.

역시나 첫번째를 차지하는 것은 꽉찬 베너 오토 갤러리로 포스코는 fullscroll을 사랑하는 그룹이구나 느꼈습니다.ㅋㅋ

분명히 꽉찬 화면이 화면을 압도하고 이미지적으로 정보를 전달하는데 있어 효과적이겠죠?

마우스 스크롤 이벤트로 넘기기도 편하니 꽉찬 화면에 꼭 필요한 이벤트인것 같습니다.

 

홍보센터에서 아무거나 클릭해보면 각자 타이틀에 맞는 상세페이지로 이동하게 됩니다.

특별할 것 없지만 무심히 툭 던진것처럼 있는 상단 타이틀 박스는 간단한 background 이미지와 폰트뿐이지만 시선은

확실히 뺏는것이 효과적이고 괜찮은 것 같습니다. 전 심플하고 매력있어 보이는 데 여러분은 어떠신가요?

이미지를 잘 쓰면 더 좋은 효과를 볼것 같죠?

 

 

오늘은 부동산 관련해서 포스팅하려다 포스코 O&M에 대해 알게 되었습니다. 기업을 소개하는 사이트라

구매나 상담 등 기능적인 부분은 없지만 뭔가 굵직굵직하고 정보들도 많은데 편집적인 느낌과 소소한 디테일로

잘 마케팅하고 있다는 느낌이 들었습니다. 그래서 이건 한번 쯤 분석해 볼 필요가 있다고 생각이 되어 이렇게

포스팅하게 되었습니다. 많은 정보량을 담다보면 흘러내리거나 시각적으로 예쁘게 만드는 것은 어렵습니다.

그것을 잘 표현하는 것이 디자이너의 역량이겠지요.

넓은 면의 이미지와 움직이는 라인이 살아나며 포스코 O&M 사이트에 생명이 불어넣어지는 느낌이었습니다.

여러분들은 어떠셨나요?

 

 

 

 

 

이상으로 포스코 O&M의 사이트 제작 분석을 마치며,,

포스코 O&M 사이트는 여러 사업분야가 있는 만큼 여러 정보들이 있는 사이트였습니다.

많은 메뉴와 긴 폰트들 커다란 이미지 그 안에서 어떻게든 여백을 만들어 보려는 웹 디자이너들의 노력이 보이는 사이트

였습니다. 이 사이트가 정보를 효과적으로 잘 전달했느냐 저에게 물어보신다면 저는 잘했다고 말할 수있을것 같습니다.

여러분 날씨가 많이 추워졌으니 모두 감기 조심하시고 2022년 임인년 모두 행복한 한해 되셨으면 좋겠습니다.

모두 모두 건강하시고 다음에 포스팅에서 찾아뵐게요~~!!!!!!