편리하고 안전한 일상을 만들다.수퍼게이트
일상 속 보이는 곳과 보이지 않는 모든 곳에는 시스템 칩이 있습니다. 수퍼게이트는 시스템 칩을 통해 편리하고 안전한 우리의 일상을 만들고 미래를 설계합니다. 수퍼게이트는 고객의 일상과 밀접하게 맞닿아있는 그들의 연구와 기술을 사이트를 통해 소개하고 있습니다.
Client
수퍼게이트
Type
워드프레스 사이트
Scope
5개 메뉴 x 50개 콘텐츠 블록
요청사항
수퍼게이트는 기업 브랜드 인지도를 향상시키기 위해 사이트를 기획하였습니다. 시스템 칩 설계를 필요로하는 기업을 위한, 명확한 비즈니스 모델을 필요로하는 투자 기업을 위한, 그리고 일하고 싶은 일터를 찾고있는 유능한 개발 인재를 위한 사이트가 필요했습니다.
환경분석
수퍼게이트의 니즈를 파악하기 위해 실무자의 의견을 들어보았습니다. 콘텐츠 자체의 낮은 디자인 퀼리티에 대한 언급과 기업 브랜드 강화에 대한 기대도 있었습니다. 기존 사이트에 대해 아쉬웠던 부분은 아래와 같이 정리할 수 있었습니다.
-
- 디자인이 마음에 안들어요.
- 우리가 하는 일이 명확해보이지 않아요.
- 수퍼게이트만의 색깔이 부족해보여요.
제작방향
1. 디자인
기업 브랜드 가치와 아이덴터티를 담은 디자인을 지향합니다. 컬러와 폰트, 그리고 UI 요소들까지 조화롭고 일관된 디자인 시스템이 필요합니다.
2. 사용성
디지털 콘텐츠를 잘 보여줄 수 있는 유형별 레이아웃 시스템이 필요합니다. 모니터, 휴대폰, 태블릿과 같은 다양한 디바이스 환경을 고려해야 합니다.
3. 유지관리
콘텐츠와 데이터를 지속적으로 관리할 수 있는 사이트가 되어야 합니다. 콘텐츠를 유형별로 블록화하여 누구나 쉽게 사이트를 관리할 수 있어야 합니다.
디자인
사이트를 구성하는 제목, 텍스트, 이미지, 배경색 등 유형별로 색상 체계를 정립하였습니다. 콘텐츠의 중요도와 글의 강약에 따라 텍스트 종류를 체계화 하였으며, UI 디자인 아이템들과 유기적이며 조화롭게 보일 수 있도록 디자인 하였습니다.
Background
R25 G42 B61
C90 M76 Y50 K53
#192a3d
Text
R58 G79 B102
C82 M65 Y41 K24
#3a4f66
Links
R21 G89 B237
C83 M67 Y0 K0
#1559ed
사용성
사이트 개발 환경에서 기본적으로 제공되는 반응형 디자인 이외에도 별도의 섬세한 레이아웃 디자인 기준을 마련하였습니다.
유지관리
수퍼게이트 사이트의 관리자 페이지는 ‘콘텐츠 블록’ 별로 템플릿 디자인을 제공하고 있습니다. 모듈화된 블록 디자인을 통해 누구나 쉽게 사이트 콘텐츠를 편집할 수 있습니다.
카테고리 기업 웹사이트 컬러 다크 그레이, 와인, 그레이, 화이트 태그 #회사소개 #브랜딩 #에이전시 #스튜디오 #크리에이티브 #포트폴리오 #워드프레스 #코딩 프리 스타일 모던, 컨템포러리, 크리에이티브, 미니멀 플러그인 컨택 폼 7, WP 베이커리 페이지 빌더, 레볼루션 슬라이더, 우커머스
사이트 주요 기능
워드프레스
워드프레스는 편리하고 쉽게 사이트를 운영할 수 있도록 다양한 웹사이트 환경을 지원합니다.
반응형
PC, 모바일, 태블릿 어느 디바이스에서도 최적의 화면 레이아웃을 제공합니다.
페이지 빌더
엘리멘터 (Elementor) 페이지 빌더로 드래그 앤 드롭만으로 멋진 웹페이지를 만들 수 있습니다.
콘텐츠 블록
최신의 UI 디자인을 복사, 붙여놓기만으로 쉽게 웹페이지에 적용시킬 수 있습니다.
다이내믹 슬라이더
프라임 슬라이더(Prime Slider)를 활용하여 다이내믹한 웹페이지를 구현하였습니다.
폼 메일
문의하기, 뉴스레터 구독, 설문지 조사에 필요한 폼을 원하는 형식으로 쉽게 만들 수 있습니다.
CDN
가장 가까운 서버로부터 컨텐츠를 전송받기 때문에 사이트를 빠르게 접속할 수 있습니다.
웹 캐시 관리
WP 로켓 (WP Rocket) 플러그인으로 빠른 로딩 속도로 웹페이지를 확인할 수 있습니다.
제작 지원 항목
- 사이트 구조 설계
- 화면 설계도 작성 및 지원
- 웹 콘텐츠 카피라이팅
- 화면 디자인 시안 제공
- 웹 환경 (도메인, 호스팅) 설정
- 워드프레스 환경 설정
- 유료 테마, 플러그인 지원
- SEO 설정 및 관리교육
- 헤더 디자인 10종
- 콘텐츠 블록 디자인 50종
- 컬리, 폰트 시스템 최적화
- 국문 웹폰트 최적화
- 모바일 환경 최적화
- 이미지, 동영상 임베드 최적화
- API 연동 최적화
- UI 애니메이션 최적화