저희 회사는 오픈소스 위키 프로그램인 모인모인(MoinMoin)을 확장해서 홈페이지로 쓰고 있습니다. 사내 인트라넷으로 위키를 저희처럼 활발하게 사용하면서 또 홈페이지로도 사용하는 곳은 많지 않을거에요. 외부에 공개되어야 할 정보들은 위키로 공개하고 또 내부 공유용 정보는 내부에서 관리하면서 벌써 전체 페이지수가 8405 페이지에 이르는 거대한 위키사이트가 되었답니다. 2007년부터 회사 이미지에 맞게 모인모인용 테마를 직접 만들어서 사용하였고 비쥬얼 영역만 변화를 주었었는데요, 드디어 올해초 당사 브랜드위원회의 안건에 따라 새봄맞이 대대적인 홈페이지 개편을 진행했습니다.

이번 개편을 위해 팀을 초월한 전사적인 노력이 있었습니다. 마케팅팀, 디싸인(Descign:
Design+Science+Management)팀, 개발팀이 함께 머리를 맞대고 고심했더랍니다. 일반 홈페이지와는 다르게 디자인이 입혀진 모인모인 테마를 개발하는 일이라 개발팀도 필요했고, 올해부터 본격적인 온라인 마케팅을 위해 마케팅팀이 진두에 섰습니다.

이번 개편에는 회사 홈페이지 모인모인 테마외에도 세가지 일이 더 있었는데요,

1. 공유 컨텐츠 강화: 홈페이지의 새로운 메뉴와 함께 컨텐츠를 보강해서 제공합니다.

2. 블로그 디자인 개선: 블로그 프로그램으로 텍스트큐브를 쓰고 있는데요, 홈페이지 개편 느낌에 맞춰 블로그 디자인도 개선했습니다.

3. 온라인 교육센터 홈페이지 오픈: 회사 제품에 대한 온라인 교육부분을 별도의 홈페이지로 분리하면서 새로운 사이트를 만들었어요. 당사 지식관리 플랫폼인 LabKM이 이용되었습니다. (온라인 교육센터는 다음 포스팅에 자세히 알려드릴껍니다.)

- Insilicogen homepage : www.insilicogen.com
- 人Co ACADEMY : edu.insilicogen.com
- 人Co BLOG : www.insilicogen.com/blog


이번 개편과 관련된 다양한 이야기들을 소개합니다.

SNS 실시간 내용을 가져오면서도 빠른 초기화면 제공
기존의 홈페이지에서는 모인모인의 첫페이지인 FrontPage에 대해서만 다른 디자인을 적용하는 방식이 사용되었는데, 이 방법은 디자이너의 혁신적인 느낌을 화면에 담기에 너무 제한적이였습니다. 초기화면의 경우 굳이 모인모인으로 연결할 필요가 없다는 판단하에 자유롭게 디자인하고 정적(static)으로 HTML을 서비스하도록 했습니다. 그랬더니, 훨씬 빠른 반응의 초기화면이 되었고, 이는 홈페이지 첫 느낌을 경쾌하게 하였습니다. 초기화면에 표시되는 블로그, 페이스북 최신글 등의 SNS 실시간 컨텐츠는 별도의 서버 프로그래밍을 통해 10분에 한번씩(cron) SNS 최신 컨텐츠를 미리 받아둔 다음 해당 내용을 표시하는 방법으로 느려지지 않도록 했습니다.




새로운 메뉴 구성과 다양한 컨텐츠 제공
전반적으로 변경된 사이트맵에 맞게 전체 메뉴를 한 번에 볼 수 있도록 전체보기 메뉴효과를 선택하였습니다. CI 메뉴를 추가하여 당사의 로고소개와 로고파일을 쉽게 다운로드 할 수 있도록 하였고, 보도자료에는 금년에 이데일리TV에 보도된 영상과 그동안의 당사관련 보도기사들을 업로드하였습니다. 그리고, 사람을 중시하는 기업 (주)인실리코젠의 가치체계에 맞게 대메뉴로 Recruit 메뉴가 추가되었습니다. 人Co CULTURE, 인재상 등을 통해 당사에 대한 정보를 더욱 친숙하게 접하고, 생물정보분야 인재양성과 채용에 중점을 두었습니다.

이번 홈페이지 개편을 기획하면서 마케팅적인 부분에서 가장 중점을 둔 부분은 "메인화면에서 고객들이 관심 갖고자하는 정보를 많이 보여주자!" 였습니다. 여러 홈페이지의 메인 화면들을 벤치마킹하면서 핫 트렌드를 반영하고자 하였고, 마케팅팀의 기획 의견과 설계된 많은 컨텐츠들을 단순하고 심플하게 보여주기 위하여 디싸인팀과 개발팀에서 짧은 시간안에 고생 많으셨어요.

메인 컨텐츠는 (주)인실리코젠의 人Co 브랜드와 사업분야를 전반적으로 소개할 수 있도록 선정 하였습니다. 물론 메인 메뉴에서도 더 자세한 정보를 볼 수 있긴 하지만 우리의 브랜드와 생물정보 컨설팅을 위한 비지니스 전략을 한눈에 보여주고자 새로운 메인 컨텐츠를 제작하였습니다. 또한 기존 홈페이지에 존재하던 뉴스 게시판과 프로모션 배너 외에 새로 오픈한 人Co ACADEMY(온라인교육센터) 배너, 채용공고 및 보도 자료 배너를 메인컨텐츠로 추가하였고 블로그, 페이스북을 활용하여 고객과 소통할 수 있는 또 다른 컨텐츠들도 함께 보여주도록 기획하여 홈페이지 구경 오시는 분들께 한 번에 더 많은 정보를 얻으실 수 있도록 하였습니다.

디자인 컨셉 - Simplicity & Minimalism
이번 개편된 홈페이지는 심플하고 미니멀한 박스형 레이아웃으로, 기업의 세가지 컬러인 그린&블루, 그레이톤을 유지하여 사용자들의 컨텐츠 접근성을 높였습니다. (주)인실리코젠의 로고를 모티브로 당사가 보유한 각 사이트에 적용되는 검색창과 버튼 등에 일관적으로 포인트를 주었습니다. 메인 페이지에서는 당사의 다섯가지 人Co BUSINESS를 메인 비쥬얼로 표현하여 슬라이드 전환효과를 줌으로써, 방문자의 시선을 유도하였습니다. 빠르게 접해야 하는 컨텐츠들은 박스형 오브젝트로 구분하였으며, 소통을 위한 블로그와 SNS의 최근 게시글을 노출시킴으로써 사용자들이 더 많은 이슈와 정보를 접할 수 있도록 하였습니다.

홈페이지의 개편과 동시에 블로그 역시 홈페이지의 아이덴티티로 일관성있게 디자인 하였습니다. 오랫동안 사용해왔던 Quipu Story라는 블로그의 네임도 당사 브랜드 재정립을 위해 人Co BLOG 로 변경하였습니다. 블로그의 일반형태에서 벗어나지 않은 익숙한 레이아웃으로 상단, 우측부분, 폰트컬러 등의 변화를 통해 편안하고 친숙한 느낌을 줄 수 있도록 하였습니다.

금번 홈페이지 개선 프로젝트에서의 디자인은 당사의 플랫폼을 활용하여 디자인 적용상의 제약사항이 많고, 타 브랜드 홈페이지처럼 화려하진 않지만, 일관성있는 기업 이미지를 정립하고 보다 빠른 정보제공을 통해 (주)인실리코젠만의 기업문화를 알리고자 고민한 결과물이라 보람있었습니다.

에필로그

이번 개편은 지시에 의한 것이 아닌, 구성원들이 자발적으로 필요성을 느끼고 직접 나서서 작업했다는데 큰 의의가 있었습니다. 기획, 개발, 디자인이 각각의 맡은 부분과 전체 작업을 잘 조율하여 크게 어렵지 않게 작업할 수 있었으며 그만큼 보람도 충분히 느끼고 있습니다. 마지막으로, 프로젝트 회고모임은 3Fs(Fact-Feelling-Finding)방법으로 진행하였습니다.
더 나은 다음 프로젝트를 위해~

2013 홈페이지 개편을 통해 전문적인 지식을 공유하고 고객에게 신뢰받는 기업으로,
고객과의 소통이 원활한 (주)인실리코젠이 되겠습니다.

작성자 :
Codes사업부 Development팀 김형용 팀장 /
Marketing팀 김경윤 주임 / Descign팀 이지혜 주임

Posted by 人Co