새로 리뉴얼된 스타플. 우주여행, 새로운 위젯, 알림이 서비스 소개

스타플(http://starpl.com) 서비스가 일부 리뉴얼을 했다. 간단하게 리뉴얼 내용을 소개하고자 한다.

 

1. 별지도의 우주여행

 

스타플은 별지도를 주요 기반으로 삼는다. 기존에는 수억개의 별과 회원들의 별만을 보여주어서 다소 검은화면에 점이 있다는 느낌밖에 주지 못했다. 조금 더 우주의 느낌을 주기 위해 109개 먼하늘의 물체(성운, 성단, 은하)를 별지도에 담았다. 우측상단에 있는 미니맵의 우주여행 버튼을 눌러 안드로메다 은하, 플라이아데스 산개성단등 유명한 먼하늘 물체로의 여행을 할 수 있다. 첫번째 버전이라 대상도 그리 많지 않고 움직임도 부드럽지 못하긴 하다. 다음으로 태양계에 속한 태양, 달, 행성들(수성, 금성, 화성, 목성 등)도 표현할 것이다. 더욱더 나아가 혜성, 유성우와 같은 것도 표현하려고 계획중이다.

 

 

우주여행 개발이야기

서비스 초반에는 별지도에 성운,성단,은하등이 들어가면 너무 학술적인 프로그램으로 비춰질 것 같아 만들지 않았다.  대신 별지도에 SNS적인 느낌을 주기 위해 수많은 고민을 했다. 하지만 공간으로 표현하는 SNS는 말로만 쉽지 표현하는 것은 그리 쉽지 않았다. 표현할 수 있다고 해도 과연 사용자에게 편의성과 즐거움을 줄 수 있을까 미지수였다. 즉, 개발노력 대비 효과가 미비할 수 있다는 판단이 있었다.

 

별지도는 별지도가 되야한다는 생각이 들기 시작했다. 별지도는 밤하늘의 느낌을 줄 수 있어야 한다고 생각했고 그것이 사용자에게 더욱 자극제가 될 수 있을거라 여겨졌다. 결국 1차적으로 성운,성단,은하를 별지도에 보여줄 수 있도록 했다.  이러한 시도는 꽤 흥미롭고 사용자들에게도 좋은 경험을 줄 수 있을거라 생각한다.

앞으로 태양계와 더 많은 천체들을 보여주고 관련 정보까지 보여주기 위한 계획을 하고 있다. 또한 기존 별지도가 Flex로 개발되어 무거운데 더욱 가볍게 ActionScript 3.0 기반으로 제작하여 사용자들에게 더욱 좋은 퍼포먼스를 보일 수 있도록  준비할 것이다.

 

 

2. 새로운 위젯 : 시계, 최근이미지, 달력

스타플에서는 시계위젯, 최근이미지위젯, 달력위젯을 새로 추가했다. 스타플의 별마트에 가면 별가루(활동량에 따라 얻어지는 가상화폐)로 구입한 후 내 별에 꾸밀 수 있다.

 

 

시계 위젯은 아날로그와 디지털 시계로 구분된다. 자유롭게 디자인을 골라서 구입하면 되겠다.

 

 

최근이미지 위젯은 자신이 쓴 글의 사진들을 모아 자동으로 붙여주는 역할을 하며 카테고리를 선택하여 해당 카테고리내에 있는 사진만 선별해서 보여줄 수 있다. 사진을 클릭하면 해당 포스트로 이동한다.

 

달력은 일반달력과 월/일만 표시하는 달력, 일자로 보여지는 달력등이 있다.  앞으로 음력/양력, 해당포스트 연결 등의 기능도 들어가지 않을까 생각한다.

 

위 화면은 새로운 위젯을 적용한 필자의 별(http://starpl.com/jidolstar) 이다.

 

 

위젯시스템 개발이야기

 

위젯시스템은 예전 Flex Module을 이용한 것을 걷어내고 순수 ActionScript 3.0 기반으로 수정했다. 그 이유는 Flex Module는 Flex Application과 거의 동일한 용량을 가진다. Flex Module은 매우 유용하지만 스타플 별지도에는 Module로 만들어진 많은 위젯을 올려야하므로 매우 무거웠다. Module을 버리고 ActionScript 3.0 기반으로 제작한 결과 1/10~1/50배 이상의 위젯크기를 줄일 수 있었고 로드 실패율도 현격히 줄일 수 있게 되었다. 물론 로드속도도 크게 개선되었다.

 

앞으로 별꾸미기, 타임라인, 별지도도 Flex를 걷어내고 ActionScript 3.0기반으로 제작하여 더욱 가볍게 만들려고 한다.

 

 

3. 개편된 알림이 시스템 : 스타플(인기기록, 와글댓글, 새기록) 탭 추가

 

기존에는 스타플 메인화면에서만 인기기록, 와글댓글, 새기록을 볼 수 있었다. 이 기능을 알림이 시스템에 포함시킴으로써 더욱더 스타플 컨텐츠를 접근하기 편하도록 꾸몄다. 더욱이 로그인하지 않아도 볼 수 있게 되었다. 또한 이전에 말풍선만 여러개 나와 복잡했던 UI를 깔끔하게 리스트 형태로 볼 수 있게 되었다.

 

보여지는 말풍선도 긴 제목이 잘리는 어색함을 극복하도록 여러줄로 제목표시할 수 있게 UI개선이 있었다.

 

 

위처럼 알림이를 통해 로그인을 할 수 있도록 기능을 개선했다. 이로써 스타플 사용자는 이전보다 더욱 편하게 스타플을 이용할 수 있게 되었다.

 

 

알림이 서비스 개발 이야기

필자는 알림이 서비스 개발에 별지도에 표현되는 말풍선 부분 및 서버사이드 통신 부분에만 참여했다. 스타플이 정식 오픈한 것은 2008년 12월 2일이였다. 그전에는 close베타로 여러시도를 했었다. 그중에 이 알림이 기능은 스타플에서 내놓은 매우 훌륭한 기능이라 생각한다. 처음부터 알림이가 좋은 기능을 갖춘 것은 아니였다. UI편의성, 속도, 디자인등 고민을 여러번 거듭한 끝에 만들어진 결과물이다. 이번에 인기기록, 와글댓글, 새기록이 알림이에 추가함으로써 그 완성도를 높힐 수 있게 되었다고 여겨진다.

 

4. 별바로가기 기능 : 친구별과 관심별에 직접 찾아가요.

기존에 없었던 기능으로 로그인을 하면 우측상단 네비게이션바에 “별바로가기”가 보여진다. 이것으로 기존 별친구나 관심별로 쉽게 찾아갈 수 있으며 친구찾기, 친구초대도 한두번의 클릭만으로도 쉽게 할 수 있게 되었다.

스타플 개발이야기

스타플(http://starpl.com)의 독특한 UI구조(Flash가 전체로 깔려있고 그 위에 HTML DIV가 올라옴)는 개발에 많은 어려움을 주었다. 특히나 속도문제는 지금도 중요한 이슈이다. 보통 RIA사이트의 경우 Flex로 만들어졌다고 할때 그 위에 HTML이 올라오는 경우는 거의 없다. Flash/Flex 애플리케이션을 브라우저에 Embed할때 wmode라는 것을 지정한다. 크게 투명(transparent)와 불투명(opaque)로 지정할 수 있다. wmode를 불투명으로 지정하는 경우 Flash/Flex 애플리케이션 위에 HTML DIV를 올릴 수 없다. 반대로 wmode를 투명(transparent)으로 지정하면 Flex/Flash 애플리케이션 위에 HTML문서를 올릴 수 있다. 투명처리했다는 것은 Flash Player가 그림을 그리기 위해 자신의 SWF컨텐츠를 렌더링하는 것외에도 SWF위에 다른 무언가가 가려지는 것도 고려한다는 것을 의미한다. 당연히 이로 인해 전체적인 퍼포먼스가 떨어질 수 밖에 없다. 이 때문에 그냥 단순한 더하기가 아닌 곱하기 단위로 퍼포먼스 하락을 보인다.

 

스타플의 구조는 wmode를 투명으로 지정할 수 밖에 없는 구조이다.  앞서 설명한 이유 때문에 순수 Ajax 또는 순수 Flash로 만들어진 다른 서비스에 비해 더 느려진다. 이를 극복하는 방법은  별지도, 타임라인을 더욱 가볍고 빠르게 동작하도록 만들 수 밖에 없다. 메모리와 CPU연산을 최대로 아끼도록 최적화 해야한다. 그래서 Flex를 걷어내고 순수하게 ActionScript 3.0으로만 제작하려고 계획중이다. 개발의 편의성을 제공하는 Flex SDK의 프레임워크를 버린다는 것은 필자에게 큰 부담감으로 작용한다. 왜냐하면 Flex 프레임워크에서 제공하는 데이터 통신, 컴포넌트, 이펙트, MXML의 편의성, CSS, RSL등의 기능을 전부 쓰지 못하기 때문이다.

 

스타플 홍보 동영상

 

정리하며

스타플은 아직도 배고프다. 지금도 시도해보지 못한 기획이 많다. 이제 우리가 생각할 수 있는 것의 10% 했는가? 아직 완성된 서비스가 아니라는 것이다. 비록 많은 사람이 참여해서 만든 서비스는 아니지만 천천히 완성도를 높여가는 모습을 보면서 서비스의 성공을 더욱 확신하게 된다.

 

별을 메타포(상징)으로 삼는 스타플은 앞으로 우주 기반 대한민국 대표 SNS가 될 것이라 생각하고 계속 정진해 나갈 것이다.

 

관련글

• 스타플이 새로워 졌어요 : http://starpl.com/wecon/10095895
• 새로운 위젯 추가 : http://starpl.com/wecon/10095906