아이폰용도 나왔습니다. ^^ 

http://itunes.apple.com/app/id446340438
  



스타플(http://starpl.com)에서 친구들과 함께 하는 SNS형 다마고치 '스타펫' 어플을 출시했습니다. 

지금 바로! 안드로이드 마켓에서 다운로드 받을 수 있어요.(아이폰용도 조만간 오픈할 것입니다.)

스타펫받기 : https://market.android.com/details?id=com.starpl.android.starpet


 


귀여운 스타펫과 함께 보내신다면 여러분의 하루가 더 즐겁지 않을까요? ^^












*** [스타펫]으로 작성한 글/댓글은 스타플(starpl.com) 웹서비스에도 자동 업로드됩니다. 
PC에서 www.Starpl.com으로 접속하시면 더욱 다양한 기능의 스타플 서비스를 이용하실 수 있습니다.


*** 다양한 스타플 연동 어플리스트

(안드로이드)바른생활
(안드로이드)책을읽자!
- (안드로이드)아이돌배틀
- (안드로이드)자랑질

(아이폰)책을읽자!
(아이폰)바른생활
(아이폰)신조어능력시험
(아이폰)어플지름신
(아이폰)타임라인 
(아이폰)오픈배경화면

- (아이폰)자랑질 

글쓴이 : 지돌스타(http://blog.jidolstar.com)


회사에서 제작한 안드로이드용 무료 어플인 "책을읽자!"를 소개합니다. (아이폰용도 있습니다.)


★★★★★ 책을읽자! ★★★★★ 

책 읽는 습관을 길러주는 최고의 어플! 책을읽자!
 

■ 책 등록하기 ■

내가 지금 읽고 있는 책을 쉽고 간편하게 등록할 수 있습니다. 
네이버/구글/다음 등 다양한 도서DB를 검색하여 쉽게 나의 서재를 만들어보세요!


 나의 서재 ■

지금 내가 가진 책을 한눈에 볼 수 있으며, 얼마나 읽었는지 상태를 알려줍니다. 
게다가 같은 책을 읽고있는 다른 사람의 서재에서 쉽게 책을 등록 할 수도 있어요!


■ 북스토리 ■

같은 책을 보고 있는 사람들과 커뮤니티를 제공합니다. 
내가 보고 있는 책을 주제로 사람들과 이야기를 나눠보세요!


■ 북카페 ■

북스토리에서 오가는 책추천, 후기, 서평들을 모아모아 북카페가 만들어집니다. 
북카페에서 수많은 최신 도서 정보를 만나보세요!


■ 푸시알림 ■

읽다가 중단한 책, 아직 읽지 않은 책이 있으면 푸시 알림을 보내드립니다. 
책 읽는 습관을 길러주는 나의 독서 동반자, 책을읽자!
 

■ 다운로드 ■

http://goo.gl/GWaZI



아래주소는 아이폰용입니다.
http://goo.gl/9sxw0



■ 참고사항 ■

*** [책을읽자!]로 작성한 글/댓글은 스타플(starpl.com) 웹서비스에도 자동 업로드됩니다. 
PC에서 www.Starpl.com으로 접속하시면 더욱 다양한 기능의 스타플 서비스를 이용하실 수 있습니다.


*** 다양한 스타플 연동 어플리스트

(안드로이드)바른생활
- (안드로이드)책을읽자!

(아이폰)책을읽자!
(아이폰)바른생활
(아이폰)신조어능력시험
(아이폰)어플지름신
(아이폰)타임라인 
- (아이폰)오픈배경화면


■ 스크린샷 ■











글쓴이 : 지돌스타(http://blog.jidolstar.com/760


 

저번주 2009년 5월 23일 서울 서초동 비트컴퓨터 멀티미디어관 지하 2층에서 OKGosu.net 세미나가 있었습니다. 저는 "스타플(starpl.com) 서비스에 이용된 Flex 기술" 이라는 제목으로 발표를 했습니다.

 

스타플 홍보도 하고 싶고 함께 기술도 공유하고 싶어서 그랬는지 주제 자체가 너무 커져서 많은 것을 전달하지 못해 약간 아쉬움이 남는 시간이였던 것 같습니다.

 

이번 세미나로 제가 말씀드리고 싶었던 것은 아래 내용이였습니다.

 

1. 스타플 소개

2. Flex를 도입할 때 고려해야할 사항

3. 개발 방법 소개

4. 모듈 개발시 최적화 방법

5. Flex 학습방법

 

한가지만 해도 30분 이상씩 잡아야 제대로 설명이 가능한 건데 너무 많은 주제를 놓고 이 모든 것은 40분 내에 말할려고 했네요. ^^;;

 

약간 보충해서 설명드릴께요.

 

1. 스타플 소개

스타플 구경을 못드렸네요. http://starpl.com 에 가시면 구경하실 수 있답니다.

홍보 동영상을 다시한번 보고 싶으시다면 "홍보영상보기"를 눌러주세요.

스타플에 대해서 더 알고 싶다면 제 블로그에서 스타플로 검색해보세요.

 

2. Flex를 도입할 때 고려해야할 사항

발표시 말씀드렸던 것은 Flex/Flash 중 도입 선택에 대한 문제였습니다. 어떤 경우에는 Flex를 도입하는 것이 맞는 반면 경우에 따라서는 Flex를 쓰는 것이 오히려 문제가 될 수 있습니다. 가령, Flex Framework에서 제공하는 컴포넌트를 거의 사용하지 않는데 Flex를 도입하는 것은 무리입니다. 또한 Flex를 도입하면 쉽게 해결될 것을 Flash로 만들면 그것 또한 문제지요. 이 점을 잘 생각하시고 선택하시길 바래요.

 

3. 개발 방법 소개

제 개인적인 개발 방법을 소개했습니다.

분석-설계-제작-테스트-배포 형태로 된다는 것을 설명드렸죠.

말씀 드리고 싶었던 것은 "기획자, 디자이너간에 커뮤니케이션 중요하다. 서로 존중하면서 대화에 임하라."라는 것과 제작환경 구성시 "ANT, SVN은 꼭 잘 활용해라"라는 것이였습니다. 더불어 통신관련 도식화와 애플리케이션 도식화, 그리고 UML 제작을 개발하기 전에 꼭 해보라는 것이였습니다. 이러한 작업은 앞으로 문서화에도 도움이 되며 다른 사람에게 인수인계할때도 좋고요. 나중에 그 프로그램을 다시 보더라도 내가 짠 것 내가 이해 못하는 꼴이 발생하지 않습니다. ^^

 

4. 모듈 개발시 최적화 방법

SWF가 다른 SWF를 로드하고 Class를 서로 참조하는 일이 발생하는 개발을 하게 되면 모듈 프로그래밍을 한다고 할 수 있습니다. 중요한 것은 다른 SWF간에 정의된 Class중복을 어떻게 해결할 것인가였습니다. 중복 자체가 크게 문제를 일으키는 것은 아니지만 필요없는 Class를 가지고 있기 때문에 프로그램 용량이 그만큼 커집니다. 그래서 중복된 Class를 없애기 위해 RSL도 이용해보고 mxmlc 컴파일러 옵션에 -include-libraries, -load-externs, -link-report 등의 옵션을 사용하는 예도 보여드렸습니다.

 

Main애플리케이션과 모듈이 서로 같은 Class를 담고 있는 경우 그대로 로드하면 어느 한쪽의 클래스를 사용하게 되겠지요. 이때 중요한 개념이 ApplicationDomain인데 제가 이 설명을 빠뜨렸습니다.

 

이 이야기는 다음 링크를 참고하세요.

Flex 모듈 프로그래밍의 기초 - Application domain의 이해 1부

Flex 모듈 프로그래밍의 기초 - Application domain의 이해 2부

 

 

5. Flex 학습법

이 부분은 시간관계상 설명 못드렸네요.

어떻게 보면 매우 중요한 부분인데 ㅎㅎ

제가 말씀 드리고 싶었던 것은 Flex 낚는 어부가 되시라는 거였습니다. Flex라는 물고기만 계속 받아먹기만 하면 발전이 없잖아요. 그래서 Flex 낚는 어부가 되기 위해 이것만은 했으면 좋겠다는 내용이였죠. 설명 못드려 아쉽네요. 시간조정을 못한 제 불찰입니다. ㅜㅜ

 

 

아무튼 짧았지만 좋은 시간이였던 것 같습니다. 제가 발표했던 자료는 아래 링크를 통해 받아가세요.

 

 

다른 분의 자료는 [여기]에서 받아가세요.

 

이번 세미나를 개최하시느라 고생하신 옥상훈(http://okgosu.tistory.com)님 수고 많으셨고요.

주최에 도움을 줬던 데브멘토(http://devmento.co.kr) 관계자 분들도 수고 많으셨습니다.

 

발표자였던 오창훈(http://lovedev.tistory.com/), 이정웅(http://bluemetal.tistory.com/)님도 수고했어요.

 

저는 항상 열려있습니다.

저처럼 바보같은 질문도 괜찮습니다. 반대로 제가 답변 못하더라도 전 부끄럽지 않습니다.

오히려 몰랐던 것을 알게 되니 좋은 것이지요. ^^

대한민국 개발자들이 서로 소통하는데 힘써주셨으면 합니다.

 

 

 

 

 

스타플(starpl.com)에서 별에서 키우는 애완동물 아이템인 스타펫을 출시했습니다. 별에서 키우는 애완동물인 만큼 외계생물이겠군요. ^^;

 

밥은 별가루예요. 별가루는 열심히 활동하는 사람에게 준답니다. 별가루로 각종 아이템, 위젯, 별스킨 등도 구입할 수 있습니다.

 

성장과정에서 별가루를 안주면 스타펫이 배고파 죽어 유령이 되요. 성인이 될 때까지 잘 키워주셔야합니다.

 

 

 

스타펫의 알의 종류는 3가지입니다. 같은 모양의 알이더라도 별가루를 어떤 식으로 주냐에 따라 성장과정이 달라집니다.

 

그럼 스타펫을 구입하러 가볼까요?

 

스타펫 구입하기

 

 

 

아이구 우리 아가들... 배고프다고 하네요. 빨랑 별가루 줘야지~ 아빠가 이쁘게 키워줄께~ ^^

 

관련글

 

홍보동영상

 

스타플

 

 

스타플(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)에서 제공하는 위젯중에 아래와 같은 “내별정보위젯”이 있다.

 


 

마우스를 올리면 내 별에 방문하거나 별받기를 할 수 있다.

 

스타플의 방문페이지와 별받기페이지에 접속시키기 위해 ExternalInterface.call()과 navigateToURL()을 아래와 같이 사용했다.

 

 

새창띄워 방문하기

ExternalInterface.call("window.open", 경로, "_blank", ""); 

 

방문하기

var request:URLRequest = new URLRequest( 경로 );
flash.net.navigateToURL( request, "_parent");

 

하지만 이러한 것들도 flash 컨텐츠를 웹페이지에 추가할때 쓰는 <object>태그와 <embed> 태그의 allowScriptAccess 속성과 allowNetworking 속성을 어떻게 지정하느냐에 따라 사용가능여부가 달라진다.

 

가령 이들 속성은 아래와 같은 방법으로 쓰여질 수 있다.

 

<object width="425" height="344">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="swf경로"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="swf경로"
    invokeURLs="false"
    autostart="false"
    allowScriptAccess="never"
    allowNetworking="internal"
    type="application/x-shockwave-flash"
    allowfullscreen="true"
    width="425"
    height="344"></embed>
</object>

 

각 속성에 대해서 자세히 설명하자면 다음과 같다.

 

 

allowScriptAccess 속성

 

이 속성은 SWF의 ExternalInterface을 통해 Javascript와 통신가능여부를 결정지어주는 속성이다. 이 속성은 다음 3가지 값중 하나가 된다.

  • never : SWF에서 ExternalInterface를 이용해 Javascript통신을 할 수 없다.
  • always : SWF에서 ExternalInterface를 이용해 Javascript통신이 언제든지 가능하다.
  • sameDomain : 같은 도메인에 있는 SWF일때 Javascript 통신이 가능하다.(기본)

 

allowNetworking 속성 

 

이 속성은 SWF에서 네트워크 기능 API 사용을 제한하는 옵션이다. 다음과 같은 3가지 값중 하나를 가진다.

  • all : 모든 네트워크 API 허용(기본)
  • internal : 브라우저 네비게시션이나 브라우저 상호작용 API 사용 제한
  • none : 모든 네크워크 API 제한

internal인 경우 제한 API

  • navigateToURL()
  • fscommand()
  • ExternalInterface.call()

none인 경우 제한 API (internal 포함)

  • sendToURL()
  • FileReference.download()
  • FileReference.upload()
  • Loader.load()
  • LocalConnection.connect()
  • LocalConnection.send()
  • NetConnection.connect()
  • NetStream.play()
  • Security.loadPolicyFile()
  • SharedObject.getLocal()
  • SharedObject.getRemote()
  • Socket.connect()
  • Sound.load()
  • URLLoader.load()
  • URLStream.load()
  • XMLSocket.connect()

 

이제 네이버에서 스타플 위젯을 통해 스타플에 방문할 수 없는 이유를 보자.

 

<EMBED
    invokeURLs="false"
    autostart="false"
    allowScriptAccess="never"
    allowNetworking="internal"
    src="경로"
    width="54"
    height="96"
    type="application/x-shockwave-flash"
    allowfullscreen="true">
</EMBED>

 

몇몇 분들이 이런 제한정책때문에 네이버 블로그에 있기를 꺼려하시는 분들이 계시다. 물론 보안상 어떻게 할 수 없다고는 할 수 있지만…


참고글

2008년 11월 30일 오후 1시 13분 KST
새로운 스타플(http://starpl.com)을 드디어 오픈했다.

사용자 삽입 이미지

새로 오픈한 스타플(starpl.com)의 메인화면



몇달간 밤샘작업하면서 만든 결과물을 이제 오픈했다고 하니 감회가 새로웠다.
아래 동영상은 스타플을 사용하는 모습을 일부 담았다.




새롭게 리뉴얼된 스타플은 SNS를 더욱 잘 표현하기 위해 업그레이드 했다. 또한 개인 컨텐츠 생산 활성화를 위해 몇가지 기능을 더욱 추가했으며, 더욱 미려한 디자인 도입으로 사용자로 하여금 하고 내 별을 가지고 싶다는 느낌을 주려고 많이 노력을 했다. 기존 초대제로만 운영했던 방식에서 누구나 가입할 수 있도록 했다.

이제 스타플에서 추가되고 발전된 기능에 대해서 소개하겠다.
본인은 스타플의 개발자중 한명이기 때문에 본인이 관여한 부분이 중심이 되어 스타플을 소개할 것이다.



별지도 (star map) - 메타센터로서의 별지도  

스타플에서 사용된 가장 큰 메타포(metaphor,상징)는 바로 별(star, 恒星)이다.

스타플은 가상의 별이 아닌 실제 관측을 통해 만들어진 천체목록에 등록되어 있는 별을 사용하고 있으며 이 별을 사람들에게 나눠준다는데서 출발한다. 거기에 감성을 더하여 자신이 이 별을 소유했고 별을 꾸밀 수 있다는 개념을 도입했으며 별에 자신의 인생을 담는다는 의미를 주기 위해 타임라인을 도입했다. 또한 별과 별을 친구로 맺게 해주고 관심별에 찾아갈 수 있게 하는 SNS(Social Network Service) 개념을 도입시켰다.

별은 우주 공간에 있다. 그렇기 때문에 Text위주의 사이트로는 별을 표현하기에 역부족이다. 그래서 도입한 것이 바로 별지도(star map, 星圖)이다. 스타플의 별지도는 2차원 공간에 별을 그려주고 일반 지도와 비슷하게 이동 및 확대/축소가 가능하게 만들어졌다. 별지도의 이러한 표현이 가능하게 하기 위해 Adobe Flash/Flex 기술을 도입했다. Adobe 기술을 도입된데는 단순히 UI 표현만을 위한 것을 뜻하지 않는다. 수억개의 별을 별지도에 표현하기 위해 데이타 베이스 작업이 필요하며 그 데이터를 별지도에 전송하고 별지도는 그 데이터를 가지고 렌더링(그림을 그려줌)해준다. 서버-클라이언트 간에 통신의 최적화를 위해 Adobe Flash/Flex 기술은 크게 도움이 되었다고 생각한다.

별지도는 외관상 전과 달라진 점은 많이 없다. 하지만 내부적 재설계를 통해 확대/축소등을 할때 예전 보다 더욱 사실감 있게 보여질 수 있도록 했으며 별자리 그림을 추가하여 좀 더 감성적으로 보여지도록 했다.

사용자 삽입 이미지

새롭게 리뉴얼된 별지도 http://starpl.com/meta


별지도에는 가입한 사람들의 별을 볼 수 있다. 사용자별(가입을 통해 받은 별)은 활동량, 분야에 따라서 별 주변의 후광의 크기와 색, 그리고 노출빈도에 영향을 준다. 새롭게 도입된 것은 바로 개인 글의 분야에 따라서 후광색이 달라진다는 점이다. 스타플은 이번 리뉴얼을 통해 RSS 발행 및 스타플 메타 센터에 글을 발행하여 공개할 수 있는 시스템을 도입했다. 그래서 전체검색등을 통해 자신의 별에 방문 유입이 가능하도록 제작되었다.


사용자 삽입 이미지

글쓰기후 분야별로 발행할 수 있다.



사용자 삽입 이미지

활동량, 분야에 따른 사용자 별지도에서 별의 후광 표현방법



사용자 삽입 이미지

발행한 글은 검색에 노출되며 별지도 상에 말풍선의 형태로 표현된다



발행된 개인 글은 스타플의 별지도의 메타센터에 노출된다. 인기글 및 추천글 등이 메인에도 노출되지만 위 화면처럼 별지도상에 보여질 수 있다. 기존 와글댓글도 별지도에 나타낼 수 있게 한 것이 이번 스타플 별지도에 변화된 점이다.

앞으로 별지도의 메타센터는 좀 더 쉽게 사용성을 높이기 위한 UI작업을 수행할 것이다. 또한 연관된 기록을 찾아갈 수 있는 기능도 추가될 예정이다.



타임라인(Time Line) - 더욱 쉬워진 인터페이스


스타플은 국내 최초로 SNS서비스에 타임라인을 도입했다. 하지만 사용하기에 불필요한 기능이 있었고 단추형태로 되어 있는 UI로 사용자의 컨텐츠가 직접 노출이 안된다는 단점이 존재했다. 이러한 단점을 극복하고 사용자에게 더욱 친숙한 타임라인을 다시 제작하게 되었다.

사용자 삽입 이미지

스타플의 새로운 타임라인



위 화면처럼 타임라인은 개인 컨텐츠가 바로 노출될 수 있도록 UI를 개편했다. 또한 카테고리 별로 자신의 컨텐츠를 볼 수 있도록 만들어 편의성을 더욱 강화시켰다.

사용자 삽입 이미지

스타플 타임라인은 스킨을 변경할 수 있다.


스타플 타임라인에서 크게 달라진 또 한가지는 바로 타임라인에 스킨를 적용할 수 있도록 한 것이다. 타임라인의 상단에 보면 원하는 색으로 입혀진 타임라인으로 자신의 별과 어울리게 스킨을 정할 수 있도록 만들었다.

타임라인도 별지도와 함께 Adobe Flex를 이용해 개발했다. 스킨기능 및 각종 데이터 통신의 편의성을 위해 Flex 기술의 도입은 디자인 적용 및 개발에 도움이 되었다.


별꾸미기 - 나만의 별을 꾸며봐요.


별꾸미기의 겉모습은 기존과 달라진 점이 많이 없다. 하지만 더욱 빨라지고 사용성을 증대시켰다.
기존에는 꾸미기 상단 패널은 Javascript, 꾸미기 영역은 Flex로 개발했지만 이번에는 전체 Adobe Flex로 개발하여 더욱 세밀해지고 확장가능한 꾸미기가 가능해지도록 제작되었다.

사용자 삽입 이미지

꾸며진 내 별의 모습



사용자 삽입 이미지

스타플에서 내 별 꾸미기하는 장면


이번 리뉴얼을 통해 또 한가지 크게 달라진 점은 별을 아이템화 했다는 것이다. 즉, 기존에는 별의 크기와 회전, 레이어 변경등을 할 수 없었지만 이번에는 위치 조정을 빼놓고 모두 가능해지도록 만들었다. 결국 더욱 다양한 방식으로 별을 꾸밀 수 있게 되었다.



별마트 - 더욱 다양해지고 이뻐진 아이템들


웹사이트는 아무리 기술이 좋고 전문적이다 하더라도 세련되고 이쁜 디자인이 없다면 사용자들에게 외면당하기 쉽다. 이번에 새롭게 추가 것중에 하나가 바로 테마별이다.

사용자 삽입 이미지

스타플에서 제공하는 다양한 테마별



별마트(http://starpl.com/mart/main) 에 방문해 "테마" 메뉴에 보면 위와 같이 다양한 테마별을 볼 수 있다. 테마별은 별스킨과 함께 아이템을 일부만 구입하거나 한꺼번에 구입할 수 있다. 스타플에서는 테마별을 별가루라는 가상의 화폐 시스템을 이용해 구입할 수 있다. 참고로 별가루는 스타플 활동량으로 벌어들일 수 있다.


사용자 삽입 이미지

테마별 중 하나




알림이 - 친구들과 관심별의 소식을 알려줘요


기존 스타플부터 유지해온 알림이 서비스이다. 알림이 서비스는 자신의 친구별 및 관심별의 소식을 보는데 유용하게 쓰여질 수 있다.

사용자 삽입 이미지

스타플 알림이 서비스

이번 리뉴얼을 통해 동작이 더욱 부드러워졌으며 데이타 베이스 개편으로 로딩속도를 향상시켰다. 이번 알림이 서비스에서 가장 주요하게 추가된 점은 관심별 이다. 관심별은 관심법으로 다루는 별인가? ㅎㅎ 그런것은 아니고 별친구는 아니지만 개인적으로 유용한 자료가 많거나 관심 분야를 가진 별이 있을때 지속적으로 방문하고 싶은 별을 관심별이라고 한다. 블로그 RSS 구독을 하는 것처럼 관심별을 등록하여 그 별의 소식을 알림이를 통해 볼 수 있다.

알림이 서비스는 친구들의 소식 뿐아니라 자신의 포스트에 쓰여진 댓글, 방명록 글등을 거의 실시간으로 알려준다.
앞으로 알림이 서비스는 데스크탑 영역으로 확장되어질 수 있으며 메신저 서비스와도 연동되어 질 수 있다고 생각한다.


내별위젯(My Star Widget) - 자신의 블로그에 내별위젯을 달아봐요.




위 위젯이 바로 내별위젯이다. object, embed 태그로 구성되어 있기 때문에 HTML 형태로 붙일 수 있는 게시판이나 자신의 블로그에 얼마든지 붙힐 수 있다. 본인 블로그 우측에도 내별위젯을 붙였다.

내별위젯은 실제 별지도 위에 내별의 위치, 별을 받은 날을 보여주고 자신의 별에 바로 갈 수 있도록 만들어졌다. 첫번째 버전이기 때문에 별 기능은 없지만 개인적으로 디자인이 이뻐서 마음에 든다.

내별위젯은 스타플에 가입한 사람에게만 유효하며 http://starpl.com/main/banner/down 에서 직접 복사해서 사용할 수 있다.

사용자 삽입 이미지

Starpl 배너 페이지. 여기서 스타플 위젯과 Link 배너를 다운로드 받을 수 있다.



외부 블로그 등록 기능 - 자신의 블로그를 스타플 타임라인에 담아봐요.

스타플 리뉴얼에서 추가된 유용한 기능중 하나가 바로 기존에 사용하고 있는 자신의 블로그의 RSS를 타임라인에 담을 수 있는 것이다. 컨텐츠를 스타플에 직접 유입한다기보다 타임라인을 통해 자신의 블로그에 방문을 유도할 수 있도록 하며, 스타플 메타센터에 노출될 수 있게 하는데 유용하게 쓰일 수 있는 기능이다.


사용자 삽입 이미지

메인화면의 블로그 등록하기 버튼


스타플 메인화면(http://starpl.com/)에서 좌측부분을 보면 블로그 등록하기 버튼이 있다. 로그인후 이 버튼을 눌러보면 아래와 같은 화면이 나온다.

사용자 삽입 이미지

타임라인에 내 블로그 등록하기


본인은 타임라인에 지돌스타 블로그라는 카테고리를 등록하여 여기에 RSS를 등록했다.

사용자 삽입 이미지

등록된 블로그가 타임라인에 들어간 모습

[Blog]단추에 붙은 제목을 클릭하면 아래와 같은 화면이 뜬다.

사용자 삽입 이미지

타임라인을 통해 자신의 블로그로 이동한 모습. 아래에 추천 버튼이 있다.



스타플 메타센터에 추천이 들어가기 때문에 추천이 많이 된 블로그 포스트는 방문유입을 유도할 수 있다.



정리하며...

스타플은 이제 시작하는 것과 같다. 개인적으로 스타플에서 보여줄 수 있는 것중 10%도 안보여줬다고 생각한다. 스타플은 앞으로 국외서비스를 위해서 한발짝 다가갈 것이다. 우주를 배경으로 시작했다는 것, 별은 국내뿐 아니라 국외에도 통용될 수 있다는 점은 스타플의 가장 큰 경쟁력이다. 한국 SNS 서비스의 파워를 스타플을 통해 보여주고 싶다.

사용자 삽입 이미지




관련 사이트 및 글

스타플(http://starpl.com)
실제 별을 이용한 위치기반 감성 SNS, 스타플
스타플(starpl.com)에 사용된 Adobe Flex 기술
지돌스타의 별


글쓴이 : 지돌스타(http://blog.jidolstar.com/413)
사용자 삽입 이미지

오늘 드디어 새로운 스타플(http://starpl.com)을 선보입니다.
기존 초대제 방식에서 누구나 가입해서 별을 받을 수 있는 시스템으로 전환했습니다.

스타플은 실제 별을 가입하는 사람에게 주고 그 별을 꾸미고 별친구를 사귈 수 있도록 한 SNS(Social Network Service)입니다. 밤하늘을 연상케 하는 별지도와 자신의 인생을 담은 타임라인, 친구와 관심분야에 쉽게 다가갈 수 있도록 한 알림이, 그리고 나의 별을 꾸밀 수 있는 기능들이 마련되어 있습니다.

별지도 
 - 메타센터(검색기능)가 도입되어 스타플내 다양한 별들의 기록을 별지도상에서 볼 수 있습니다.(계속 기능이 추가될 예정입니다.)
 - 더욱 빨라지고 미려해진 에니메이션을 보여줍니다.

타임라인
 - 기존과는 UI가 완전히 달라졌습니다. 자신의 기록을 타임라인에 담을 수 있습니다.
 - 스킨을 설정할 수 있도록 수정되었습니다.

내 블로그 담기
 - 기존 블로그에서 발행한 RSS를 자신의 타임라인에 담을 수 있습니다.
 - 타임라인에 담근 블로그 글은 별지도의 메타센터 및 검색에 노출되어 더욱 많은 사람이 자신의 별 및 블로그에 올 수 있도록 할 수 있습니다.

나의 별 꾸미기
 - 기존 평면적인 별을 꾸몄다면 공간느낌이 더해진 나만의 별을 꾸밀 수 있도록 만들어졌습니다.
 - 기존 꾸미기보다 더욱 빨라지고 편하게 꾸밀 수 있습니다.

별마트
 - 더욱 풍성해진 이쁜 아이템을 구입할 수 있습니다. 별마트에서 판매되는 아이템은 현재까지는 자신의 활동량에 따라 쌓여지는 별가루로 구입할 수 있습니다. 열심히 쓰시는 만큼 더욱 예쁜 별을 꾸밀 수 있답니다. 한번 도전해보세요. ^^

나의 별 위젯
 - 외부 블로그 및 개인홈페이지에 나의 별을 보여주는 예쁜 위젯을 달 수 있습니다. 앞으로 스타플은 서비스내에서 제공하는 모든 컨텐츠에 대해 위젯화 하여 더욱 풍성한 서비스를 제공하도록 노력할 것입니다.

알림이
 - 스타플의 또하나의 특징은 나의 친구별와 관심별의 새로운 기록, 이벤트등을 알림이를 통해 한번에 볼 수 있다는 것입니다. 더욱 빨라지고 쓰기 편해진 알림이로 친구들과 더욱 친해지고 관심분야 사람들을 많이 만나보세요. ^^

스타플에 놀러오세요~~~
http://starpl.com


글쓴이 : 지돌스타(http://blog.jidolstar.com/412)

+ Recent posts