이년전 쯤 산요에서 나온 캠코더인 작티를 구매하고려 알아보았던 적이 있었다. 휴대하기 적당한 크기에 핸드폰 두개정도의 가벼운 무게. 당시 디지털 카메라와 캠코더중 고민을 하고 있었는데, 디카 못지않은 휴대성에 끌려 많은 고민이 있었다. 그래도 당시에는 좀 더 선명한 사진을 얻고 싶어 디카를 선택했지만.


UCC 열풍으로 캠코더의 수요가 부쩍 늘었다. 이러는 와중에 제작사들은 고성능의 제품들을 속속 출시하기 시작했다. 하지만 올라간 성능만큼 가격도 올라갔다.

일상생활을 남기고, 추억을 기록하는데, Full HD이든 SD이든 무슨 상관이랴, 물론 화질은 SD보다는 HD가 좋은 것이 사실이고, 480p보다 1080i가 , 1080i 보다 1080p가 더 좋은것이 사실이다. 하지만 20인치 미만의 일반 모니터와 SD 티비를 갖고 있는 사람들에게 이게 다 무슨 소용인가. 괜히 용량만 두배 세배 차지하고, 중요한 순간에 녹화시간이 부족하다는 메시지를 보는 것보다는 저렴한 가격의 SD 캠코더가 낫지 않은가.

동영상 촬영이 뛰어나면서도 기존의 카메라 성능도 결코 떨어지지 않는 캠코더의 가장 큰 걸림돌은 바로 휴대성이다. 크기와 무게가 기존의 카메라 시장을 넘보는데 가장 큰 걸림돌이었지만, 이제는 서서히 그 걸림돌이 빠지려 하고 있다.


얼마전 삼성에서 출시한 SMX-C14는 담배갑 만한 높이에, 휴대폰 한개만한 무게로 충분한 휴대성을 자랑하는 포켓 캠코더이다. (삼성 햅틱: 102g, C14: 162g)


어른 남자 손바닥 만한 크기로 휴대성을 높였지만, 성능또한 떨어지지 않는다. 캠코더 자체 성능에 충실하여 광학 10배줌에 디지털 12배줌이 가능하고, 16GB의 내장 메모리를 채택하여 SD 화질로 최대 380분에서 620분 까지 녹화가 가능하다. 물론 베터리는 저정도로 길게 지원하지 않는다.

또한 촬영한 동영상을 별도의 인코딩을 거치지 않아도 유튜브에 바로 업로드가 가능하여, UCC 공유가 쉽게 가능해진다. 찍고, 바로 올리는 진정한 UCC용 캠코더이다.

그 외에도 다양한 특수효과 기능과, 다양한 상황에서도 최적의 화면을 잡아주는 iSCENE모드, 손떨림 보정등. 없으면 아쉬운 유용한 기능들이 많이 있다.

섬네일 기능을 활용하여 영상을 검색하고, 컴퓨터로 영상을 옮긴 뒤 편집하지 않아도 캠코더 자체에서 동영상을 간단하게 편집할 수 있기 때문에 쉽게 편집하여 유튜브등 업로드가 가능하다.


소중한 추억을 저렴한 가격으로 평생 남겨보자.


이 블로그 게시물은 삼성 캠코더 카페(http://cafe.naver.com/samsungucccam) 의 체험단 신청을 목적으로 작성되었습니다.

Posted by onionmen

댓글을 달아 주세요

오늘의 던파 라는게 있습니다.
던전앤파이터 라는 온라인 게임을 하신다면 한번쯤은 들어보셨을 오늘의 던파.

게임에서 이슈가 되는 사항이나, 열혈 유저들이 올린 컨텐츠를 노출시켜 정보를 공유 할 수 있게 만든 메뉴입니다.
게임을 하는 사람들에겐 꽤 유용하고 재미있는 정보 입니다.


저어기 오늘의 던파 라고 보이시나요.

IE8 정식 출시 기념으로 오던을 구독할 수 있게 웹슬라이스를 이용하여 만들어보았습니다.
웹슬라이스를 이용하면 좀 더 쉽게 오던을 즐기실 수 있습니다.

보이시나요. 웹서핑 도중에도 즐겨찾기 처럼 한눈에 확인할 수 있습니다.


덤으로 이벤트도 만들어 보았어요.

IE8의 웹슬라이스를 사용하여 오던과 이벤트를 한눈에 확인해보세요.

[ IE8 에서만 가능합니다. ]

http://ottd.iruis.net/~onionmen/dnf/slices_todaydnf.php
http://ottd.iruis.net/~onionmen/dnf/slices_event.php

위 링크에 접속하시면 여러분도 쉽게 오던과 이벤트를 확인하실 수 있어요.

2008/11/14 - [Review/IT] - [IE8] 엑셀러레이터, 비쥬얼 서치 (1)
2008/08/12 - [Review/IT] - [ IE8 ] 웹슬라이스를 적용한 미투데이 최근 댓글 구독.
2008/08/11 - [Review/IT] - [ IE8 ] 웹슬라이스(webslices) 적용했습니다.



Posted by onionmen

댓글을 달아 주세요

디지털로 저장되어 있는 사진을 실물 사진으로 인화하기 시작한건 2004년도 쯤입니다. 당시 친구의 추천으로 찍스(zzixx) 라는 사이트를 이용했는데, 품질을 비롯해 전체적으로 나쁘지 않아서 지금까지도 계속 이용 중입니다.

아직까지 다른 사이트를 검색하거나, 일부러 찾으려고 노력하지 않았었는데, 얼마전 레뷰(링크) 에서 진행하는 프론티어에 선정이 되어 처음으로 다른 인화 사이트를 가입해 이용해보았습니다.

이 리뷰는 아래 보이시는 차례로 진행되며 추후 내용 수정이 있을 수 있습니다.

1. 사이트 소개

2. 메뉴 소개

3. 구매 가이드

4. 비교

5. 상품 리뷰

6. 그 외에..


Posted by onionmen

댓글을 달아 주세요

2009.03.26 14:49 Review/IT

위젯들.


위자드팩토리에 등록된 위젯으로 Han Lee 님 이라는 분이 제작하신 위젯입니다. 홈페이지가 상당히 인상적입니다. 설명대로 초단위로 플립되기 때문에 중독성이 있습니다. 색이 튀지 않아 어느 블로그에나 잘 어울릴거라는 생각이 듭니다.
까만 배경에 하얀 글씨로 되어 깔끔하고, 세련된 느낌을 주어 좋습니다만 하얀배경에 까만 글씨도 지원되었으면 하는 아쉬움이 있습니다.


코리아 스파클링은 외국인에게 한국을 알리기 위해 개발된 위젯으로 홍보용이기는 하지만 상당히 흥미있는 위젯입니다.
한국소식과, 날씨, 한국어배우기 등의 정보를 제공하고, 이를 랜덤으로 플레이 시킬 수 있습니다. 다음에 어떤상황이 나올지 한동안 보고 있으면 나도 모르게 빠져듭니다. 유니클로만큼은 아니지만 좋네요.

다만 한국문화 배우기의 컨텐츠가 좀 많아졌으면 좋겠네요. 한 1~2분 보고 있으면 별 특별한게 없어서 흥미를 잃게 됩니다.

그리고 랜덤으로 설정 할 경우 블로그 글을 읽는데 방해가 될 수도 있겟습니다. 이는 사용자가 움직임을 종료하거나 위젯의 동작을 끌 수 있는 기능을 넣음으로 해서 해결할 수 있을텐데 말입니다.


영단어 위젯입니다. 5초간격으로 한번씩 영어와 그 뜻을 알려줍니다. 난이도는 한글 뜻 상단의 별로 표시됩니다. 단어 난이도는 쉽지않은 수준으로 영어단어 하나를 보게 되면 이게 무슨 뜻인지, 혹은 내가 생각한 뜻이 맞는지 알기 위해 계속 쳐다보게 됩니다. 내가 생각한 뜻이 맞으면 역시. 라는 생각을 하며 훗 하고 웃어넘기게 되지요. 특히 별 세개짜리를 맞췄을 때는 ㅎㅎㅎ 친구와 뜻 맞추기 내기 해도 되겠네요.

개선할 점은 없는거 같지만, 굳이 뽑으라 한다면 내가 원하는 단어를 뭐 CSV포멧같은 표준화 포멧으로 만들어서 넣으면 랜덤으로 출력되는 정도가 될까요. 그리고 이 위젯도 역시 코리아 스파클링처럼 사용자가 끄거나 켤 수 있도록 제어할 수 있으면 더할나위 없겠네요.


올블로그 위젯입니다. 보시면 아실만큼 직관적인 UI를 채용하고 있습니다. 한 페이지당 표시할 글 수를 조정할 수 있고, 제목을 길게 표시할지 자를지 설정할 수 있습니다. 위젯은 iframe으로 구현이 되어 있습니다. 플래시가 아니라 접근성면에서는 여타 위젯들 보다 뛰어납니다.

전 개인적으로 전체글 말고 추천글만을 보고 싶은데, 탭을 변경하거나, 원하는 탭만 생성할 수 있다면 최고겠네요. ^^








여기까지는 위자드팩토리의 위젯들 입니다. 이 위젯들은 대부분 가로사이즈를 조절 할 수 있도록 해 놓아서 블로그에 넣을 때 디자인을 고려해넣기가 좋습니다. 정말 가로 사이즈 조절이 안되는 위젯들은 잘못 넣으면 너무 조잡해 보이죠. 아니, 제대로 잘 넣지 않으면 평범하게 넣었다고 해도 조잡하고 지저분해 보입니다.




WEZET 의 랭킹 위젯입니다. 전체랭킹과 오늘의 랭킹을 보여줍니다. 등록된 블로그들의 랭킹을 산출하여 비쥬얼하게 보여줍니다. 높은 순위의 블로거들에게는 만족감을 줍니다만 그보다 통계를 좋아하는 사람들의 심리를 잘 이용했다고 생각합니다. 다만 이 위젯은 어떤 유용함이 없다는 것이 큰 문제이겠죠.

중간중간 화면 전환이 되는 때에 어떤 유용한 정보나 재미요소를 제공해준다면 좋겠습니다.

위자드팩토리는 따로 위젯 설정 페이지를 제공하는 반면, 이 위젯은 퍼가기 버튼 옆에 관리메뉴를 두어 위젯을 관리할 수 있습니다. 위젯의 크기라든지, 스킨변경 등과 이 랭킹 위젯에서는 블로그 등록 설정을 변경 할 수 있습니다. 별다른 페이지 이동 없이 위젯의 설정을 변경 할 수 있다는 것은 매우 중요한 요소라 생각됩니다.



예스맨 이라는 영화정보를 보여주는 위젯입니다. 홍보용으로 제작된 것이 100% 확실하고, 저도 홍보용으로 넣었습니다만 이 아이디어를 활용할 수 있겠습니다.

보고싶은 영화나 감명깊게 본 영화의 제목을 넣으면 어떠한 포멧에 맞추어(이 영화 포멧처럼) 정보가 제공되는 위젯이 개발된다면 정말 유용할 듯 싶습니다. 일종의 템플릿으로 개발된다면 홍보용으로 쓰일 때 별다른 비용이 들어가지 않으니 더 좋겠군요. 굳이 영화에 한정하지 않아도, 책이나 기타 다른 것으로 확장 할 수도 있겠지요.








WoC 라는 행사의 홍보 배너입니다. 일종의 위젯이죠. 제가 학생일 때 이런 행사가 있고, 또 알았었다면 정말 좋았을텐데 말이죠. ㅠㅠ

참 서울은 기회와 정보, 그리고 사람이 많은 곳 같습니다.
대학생 여러분들 화이팅 입니다.





믹시와 On20의 배너입니다.
믹시는 어느새인가 블로그에 달려서 떨어질 생각을 안하는군요. 심플한 UI가 제 마음에 들었었나 봅니다.

On20은 제 글이 잡지에 몇 번 실렸기 때문에 고마움의 표시로 달아놨습니다. 그리고 스무살이 되고싶은 마음도 간절하기에.. ㅎㅎ






ethankyou 라는 관광사이트 입니다. 뭐 일종의 서포터즈로 선정 되어서 한달동안 게제하기로 하였습니다. 상황에 따라서 그 이상 게제될 수도 있겠네요.
경기도로 여행하실 생각이라면 이 사이트에서 정보를 얻으셔도 좋을 것 같습니다. 제 고향이 경기도 이기도 하여 고향집 주변을 둘러보니 가격정보 및 주변 사진은 얻을만 합니다. ^^



Posted by onionmen

댓글을 달아 주세요

  1. 섹시녀 2008.12.01 15:15 신고  댓글주소  수정/삭제  댓글쓰기

    양파맨님~ 퍼가요~~~

    (이런거 해보고 싶었어요^^)

이 글을 보고 계시는 분 들 중 유니클로에서 제공하는 UNIQLOCK 을 모르시는 분은 많지 않으실겁니다. 5초 간격으로 여자 몇명이 나와서 동작을 맞춰서 움직이는 그 것입니다. (잘 모르시면 클릭)


정말 선풍적인 인기를 끌었던 것으로 기억합니다.  5초 뒤에 어떤 영상이 나올지 궁금하여 30분 넘도록 보고있었다는 분도 계셨고, 그 이상의 시간동안 넋놓고 바라보신 분들도 계실거라 믿습니다.

이제 블로그가 마케팅 수단의 한 영역을 차지한다고 해도 이상하지 않을 정도가 되었습니다. "블로그좀 한다.(^^)" 하는 사람들이면 블로그 마케팅이라는 단어를 모르는 사람이 없을 정도 입니다. 이 블로그 마케팅을 위해서 위젯의 역할이 정말 중요합니다. 이 유니클락(UNIQLOCK)속에 나오는 여자들은 모두 유니클로의 옷을 입고 있습니다. 이것도 역시 마케팅인 것이죠.


이미 몇 년 전에 구글과 MS에서 가젯(이것도 위젯)을 선보여 일반 유저들에게 좀 더 편리한 사용성을 제공했는데요, 기간에 비해 커다란 발전은 없는 듯 보입니다만 앞으로의 큰 수요가 예상됩니다.
왼쪽에 보이는 위젯은 대우증권에서 제공하는 증권위젯입니다. 비스타 사이드바 에서 사용할 수 있고, XP에서도 설치할 수 있는 것으로 알고 있습니다. 구글데스크탑에서도 사용할 수 있는지는 잘 모르겠습니다. 현재 국내 증시가 어떻게 되어 가고 있는지 한눈에 확인 가능하고, 그 외 주목하고 있는 종목 한개를 추가하여 볼 수 있습니다. (코스피 지수에 눈물이 나는군요.ㅠㅠ )

이는 도움되는 정보를 주면서 덤으로 광고도 하는 효과적인 위젯마케팅의 한 사례입니다.


마케팅 위주로써의 위젯 말고도 재미와 기능을 위한 위젯도 많이 있습니다. 코리아스파클링위젯은 한국을 알리기 위한 마케팅 도구이기도 하지만, 서양과 동양(한국)문화의 차이점을 잘 집어내어 유머러스하게 표현하여서, 보는 이에게 재미를 줍니다. 더불어 한국어 및 박물관 정보와 같은 유용한 정보도 제공하고 있어 한국을 공부하거나 여행하려는 외국인에게 좋은 정보를 제공합니다.

이러한 유용한 정보 및 재미는 위젯을 설치하는 사용자에게 설치에 대한 일종의 동기부여를 제공해줍니다. 설치의 주체가 되는 사람들이 광고인 것을 알면서도 설치하고, 또 특별한 보상이 없는데도 불구하고 설치하게 만드는 것 입니다.

이런 코리아스파클링이나 유니클락처럼 재미와 마케팅을 합한 위젯이 성공할 수 있다고 봅니다. W위젯서울문화꽃위젯은 앞서 이야기한 재미 외에 성취감 또한 안겨줄 수 있어 좀 더 설치에 대한 강한 동기부여를 제공해줍니다.

이러한 위젯들을 좀 더 쉽게 얻고, 또 (어쩌면 올해안에)직접 만들 수도 있는 사이트인 WZDFACTORY 에 대해 이야기 해보도록 하죠.




about WZDfactory.

위자드닷컴으로 거슬러 올라갑니다. 꽤 오래전입니다. 공식적인 일정으로 구글에서 igoogle을 내놓기 전인지, 그 후인지는 잘 기억나지 않습니다. 단지 igoogle.com 이라는 와닿지 않는 긴 주소보다 짧지만 느낌이 있는 wzd.com을 발견한것은 점점 더 커가고 있는 웹 속의 또다른 재미 였습니다.

그 뒤에 이 마법사들이 내놓은 서비스는 귀엽게도 oz 였습니다. 오즈. 오즈의 마법사라니. 맙소사. 이들의 네이밍 센스에 다시한번 감탄하지 않을 수 없었지요. 그리고 꽤 오랜 시간이 흐른 뒤 이 마법사들이 내놓은 서비스는 바로 위자드팩토리 라는 위젯제공 서비스입니다. 솔직히 이번 네이밍은 그다지 감탄할 만한 네이밍은 아니었지만, 나름대로의 철학이 담겨있을테니 제가 뭐라 하는것은 예의가 아니겠지요.

위자드팩토리(WZDFACTORY.COM)예쁘고, 재미있고, 유익한 정보 라는 세가지 모토로 여러 종류의 위젯을 제공하고 있습니다.

  • 예쁘고
  • 위젯 : 블로그를 예쁘게 만들어주는 악세사리 위젯들입니다. 시계, 날씨와 같은 위젯을 제공해 주고 있습니다. 물론 이 예쁘게 라는 것은 위젯 설치자가 스킨과 얼마나 잘 어울리게 위젯을 설치하느냐에 따라서 많이 달라지겠지만, 위젯 자체만 놓고 보면 상당히 아기자기하게 디자인 되어 있어, 잘만 맞춰 놓는다면 큰 힘 들이지 않고도 예쁘게 블로그를 꾸밀 수 있을 것 같습니다. 물론 굳이 시계, 날씨같은 위젯만 아니라 다른 여러 위젯들도 잘만 배치한다면 상당히 깔끔하고 예쁜 모습으로 만들 수 있죠.

    팩토리 : 팩토리의 홈페이지는 예쁩니다. 전체적으로 갈색톤이어서 건조하고 무거워보여서 세련된 느낌을 주기 때문에 뭔가 아기자기하고 통통튀는 위젯들이 모여있는 곳의 집으로 보기엔 다소 부조화스러운 점도 있습니다만 이러한 색감 덕분에 따뜻하고 안정적인 느낌을 줍니다. 그러니까 결론은 팩토리가 예쁩니다.


  • 재미있고

  • 위젯 : 재미있는 위젯들은 우선 아기를 키우는 W위젯이나 꽃을 키우는 서울문화꽃 과 같은 위젯으로 포진되어 있습니다. 뭐 더 고르라고 해도 위자드팩토리 내에서는 딱히 재미있는 위젯 이라고 불릴만한 컨텐츠가 얼마 없습니다. 아직 팩토리를 오픈한지 얼마 되지 않은 것도 있겠지만, 사실 이 작은 박스안에 재미요소를 넣어 뭔가를 만드는 것이 그리 쉽지는 않은 일이지요.

    팩토리 : 팩토리는 재미 있습니다. WZDAPI를 통해서 즐거운 위젯개발이 가능합니다. 개발문서를 참고하면 누구나 쉽게 위젯 개발이 가능합니다. 재미없으십니까? 어려우시다구요. 그럼 곧 오픈할 예정인 위젯만들기 메뉴를 기다려주세요. 아직 오픈도 안했고 이것도 어려우시겠다구요. 그럼 팩토리에 있는 위젯들을 즐겨주세요. 그러니까 결론은 팩토리는 재미 있습니다.


  • 유용한

  • 위젯 : 유익한 정보를 제공해주는 위젯은 상당히 많이 있습니다. 환율, 영단어, 지하철노선도, 올블추천글, 날씨, RSS리더, 시계, 명언, 그 외 각종 추천블로그들의 정보창 등등. 어쩌면 위젯의 가장 충실한 역할을 하는 기능일지도 모르겠습니다. 이를 반영하기라도 하듯 위젯의 종류도 다양합니다.

    팩토리 : 팩토리는 유용 합니다. 도움말 을 보시면 그 유용함을 한눈에 알 수 있습니다. 유용함은 원초적인 것인데, 바로 블로그에 위젯을 설치 할 수 있도록 해주는 것 입니다. 개인블로그에 무료로, 유용한 위젯을 설치할 수 있도록 위젯을 제공하고, 트래픽을 보장해줍니다. 그리고 API를 사용하여 위젯을 쉽게 제작하도록 도와줍니다. 여기에 이미 설치한 위젯을 새로 설치할 필요 없도록 위젯관리 기능을 지원하여 간단한 편집후 바로 적용이 가능 하게 만들어져 있습니다. 그러니까 결론은 팩토리는 유용 합니다.


위젯들중에 구분한다는 것 자체가 모호한 것들이 있습니다. 유용하지만 예쁘고, 재밌지만 유용한 위젯들이 많이 있습니다. 위자드팩토리 또한 위젯을 카테고리로 나누어 놓았지만, 이들이 궁극적으로 추구하는 것은 카테고리의 분류로 잘 구분되는 위젯들이 아니라, 위 세가지가 잘 융합되어 있는 위젯들의 천국이 아닐까 생각합니다.


about WZDfactory.

별로 흠잡을 곳 없는 위자드팩토리이지만 그래도 약간의 아쉬운 점들이 있습니다. 아쉬운점들 찾아내느라 애먹었습니다.

RSS
위젯 겔러리를 사용자가 검색하기 편하게 만들어 두고 범주별로 구분해둔 것은 당연한 것이지만 참 좋았습니다. 다만 위젯 겔러리에 RSS가 지원 되지 않는 점이 아쉬움으로 남네요. RSS에 대한 사용자들의 인지도가 아직까지도 낮은것은 인정하지만, 위젯의 주 타겟이 블로거들이고, 이 블로거들이 RSS를 사용하지 않는다고는 생각할 수 없습니다. 정확한 통계는 없지만 적어도 열에 일곱은 사용하고 있지 않을까요. 추가되는 신규 위젯에 관한 내용을 확인하기 위해서 재방문을 어떻게 유도할 것인지 따로 기획된 부분이 있다면 모르겠지만 그럼에도, RSS의 지원이 시급하다고 생각합니다.

위젯종류
좀 더 다양한 위젯이 추가되었으면 하는 바램이 있습니다. 아직 한달 조금 넘은 상태라 앞으로 많은 위젯이 추가될 것으로 생각되지만, 그래도 위젯이 적은데에는 반론의 여지가 없습니다. 위젯겔러리에 페이지는 25페이지로 각 페이지당 10개의 위젯이 노출된다고 하면 250개입니다. 하지만 이 중에 추천블로거의 추천글 위젯을 빼고, 시계등의 중복되는 위젯을 제외하면, 식상한 날씨등의 위젯을 포함한다고 해도 50개정도에 범주도 3~4개 정도로 한정됩니다. 좀 더 폭넓은 층의 위젯의 추가가 되었으면 좋겠습니다.

위젯관리
음, 이건 약간 애매한 문제인데요, 사용하고 있는 위젯관리 화면에 들어가면 실수로 발급받은 위젯의 리스트도 나오고 있습니다. 어떤 경우냐 하면 위젯 발급을 받다가 실수로 같은 위젯을 두개 받았습니다. 올블로그 위젯같은 경우는 세개를 받았습니다. 이러면 관리하기 조금 힘들지 않나요? 물론 삭제가 있지만 뭘 삭제 해야 하는지 몰라서 지금 현재 블로그에 달고 있는 것을 삭제해버리면 새로 블로그에 등록을 해야 하고 말입니다. 물론 동일한 블로그에 두개의 위젯을 설치하는 경우도 있을것이지만, 관리하는데 좀 힘이 드는 것은 사실입니다. 그나마 다행인 것은 설정을 변경할 일이 그리 많지 않다는 점. 정도겠네요.



이미지로 보는 추천 위젯도 매우 괜찮은 위젯이라고 생각하는데, 왜 이 위젯은 따로 제공하지 않는것인지 궁금합니다.(혹 제가 못찾는건가요 ㅠㅠ)
공개하는데 별다른 문제가 없다면 이 위젯도 꼭 공개되었으면 좋겠습니다.

11월에 오픈할 예정이라 써있는 위젯 만들기는 언제쯤 오픈 할 것인지 궁금합니다. 이제 11월도 5일이 채 남지 않았는데 시간약속을 잘 지킬 수 있을지, 설사 지킨다고 해도 39900원 짜리 옷을 3만원대라고 하는것과 크게 다르지 않겠지만 말입니다.

하지만 현재 서비스 중인 WZDAPI 와 차별화가 있을 것도 같고, 그렇다면 누구나 쉽게 위젯을 만들 수 도 있을만큼의 쉬운 서비스가 나오지 않을까 하는데, 이는 매우 기대되는 점 입니다.

속도 문제를 빼놓을 수 없는데, 위젯서버의 문제로 속도가 느려진다거나, 아예 로딩에 실패 했을 때 블로그로의 접속 불가에 대해서 어떠한 조치가 있을지 의문입니다. 예전 오픈마루의 레몬펜 서비스는 이러한 문제로 인해서 꽤나 고생을 했던 것으로 알고 있습니다. 단 한개의 위젯을 설치했다고 해도, 로딩에 실패한다면 그 응답속도에 따른 블로그 접속 장애가 발생 할 수 있는데, 이를 해결할 수 있나요? 블로그가 모두 로딩된 후에 위젯을 로딩하거나 뭐 그런식으로 라도요.

마지막으로 현재 위자드팩토리의 위젯들은 설치형 블로그나, 스킨편집의 자유도가 높은 서비스에 대하여 설치가 제한되는데, 이 진입 장벽을 낮출 수 있는 방법은 없을까요? 위젯을 설치할 수 없는 블로그에 위젯을 설치하는 것. 어렵겠지요?


위자드분들, 멋진 마법과 함께 팩토리 풀가동 해서 좀 더 멋진 위젯들을 뽑아주셨으면 좋겠습니다. 너무 좋아서 위젯 품절사태가 일어날 정도로요!!!!!


WISH WIDGET List.

  • 지하철 시간검색 위젯

  • 지하철역과 시간을 입력하면 그 시간에 맞는 지하철 정차 분(minute) 이 검색 되는 것이에요. 지하철 노선도 같은 것들은 이제 대부분의 핸드폰에는 내장되어 있잖아요. 하지만 언제 역에 도착하는지에 대한 정보는 찾기 힘들어요. 웹에서도 분단위 정차 시간은 찾기 그리 쉬운편도 아니고, 찾는다 해도 귀찮잖아요. 약속 계획을 짜기 위해서 시간 관리는 필수죠. 아이팟터치 쓸 때, 지하철 노선도와, 각 역의 정차시간을 써놓은 프로그램을 사용했었는데, 너무너무 편리했어요. ㅠㅠ 지하철 노선도 위젯도 있으니, 좀 더 상세한 정보를 제공해주는 위젯을 추가해보는건 어떨까요.
    2008/11/26 - [Review/IT] - 검색창에서 지하철 시간을 검색해보자. (IE7이상, FF2이상)


  • 사전 위젯

  • 이미 있을지 모르겠지만, 적어도 위자드팩토리에는 없는듯 하네요. 영/한/전문용어 정도를 탭으로 구분하여 검색할 수 있도록 하면 좋겠네요. 지금 Korea Sparkling 위젯도 홍보중인데, 한국 블로그를 찾는 외국인이 모르는 단어를 검색할 수 있도록 블로그에 위젯으로 설치해 놓는다면 시너지 효과가 발하지 않을까요. 물론 그 반대의 경우도 마찬가지이구요. 전문용어 사전은 WIKI 검색 정도로 하여 기술블로그를 읽을 때, 모르는 단어를 바로바로 검색할 수 있도록 위젯을 설치한다면, 방문객에게 좀 더 도움이 되지 않을까요.

  • 번역기 위젯

  • 물론 좀 더 편하게 번역기를 사용하시는 분들도 계시겠지만 언젠가 많은 블로그에 검색기 위젯이 달려있다면 블로깅이 좀 더 편해지지 않을까요. 특히 일본어 번역기의 경우 매우 우수한 번역퀄리티를 보여주니 말이에요.

  • 기름값 검색 위젯

  • 요즘 실시간으로 지역별 기름값을 검색할 수 있잖아요. 이 공개된 정보들을 가지고 지역별 기름값을 검색하게 하는거에요. 검색이 어렵다면 전국 평균 기름값의 표시만이라도 가능할것 같은데요. 요즘 환율, 날씨, 이런건 너무 많고 식상하잖아요. 기름값 검색 위젯. 만들기만 한다면 매우 유용하지 않을까요?

  • 전광판 위젯

  • 내가 하고싶은 말을 써서 표현해줄 수 있는 위젯은 어떨까요. 전광판이나, 네온사인간판, 현수막 등의 스킨을 제공해주고, 언제나 쉽게 내용을 변경 할 수 있는 전광판 위젯. 기분좋게 출근했는데, 출근하자마자 잔소리 하는 직장 상사에게 하는말. 어제 싸운 친구에게 미안하다는 사과의 메시지. 올해로 30번째 생일을 맞은 노처녀 누나에게 전하는 생일축하 메시지. 너무 좋은 기분을 표현할 길이 없을때 쉽게 자랑할 수 있는 전광판 위젯. 괜찮지 않을까요?

    • 위 위젯들의 가장 큰 문제는 데이터를 어떻게 받아오느냐인데, 사전이나 번역기는 공개API를 사용하면 되지만 지하철 시간검색과 기름값은 약간 문제가 될 수 도 있겠네요. 만들자고 한다면 데이터 추출도 그리 큰 문제는 안되겠지만, 그 후가 문제겠군요. 데이터에 대한 법적문제도 생각 안할 수 없고말이죠.
Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://webdew.tistory.com BlogIcon 재서기 2008.11.26 21:52 신고  댓글주소  수정/삭제  댓글쓰기

    안녕하세요 위자드웍스 재서기입니다. :D
    이렇게 정성이 담긴 리뷰를 써주시다니요! ㅎㅎ

    아쉬운점을 찾느라 애를 쓰셨다면서 왜이렇게 많은 거에욧!! ㅋㅋㅋ
    정말 읽으면서 끄덕끄덕하지 않을 수 없는 주옥같은 내용들이네요 ㅎㅎ
    위시 위젯 리스트도 좋고요 조만간 저희 공돌이 공순이 열심히 돌려야겠네요! 훗! ㅋㅋ

    앞으로도 좋은 의견 많이 주시고요. 너무너무너무너무 감사합니다. :D

    • Favicon of http://onionmen.kr BlogIcon onionmen 2008.11.26 23:37 신고  댓글주소  수정/삭제

      ^^ 들러주셔서 감사합니다. 아쉬운점 찾느라 애먹었어요. 도저히 쓸게 있어야 말이죠. 그만큼 잘만들었으니말이에요.(분위기 이상해지고있다 ㅎㅎ) 위자드분들 열심히 마나포션 드시고, 애써주세요 ㅎㅎ

  2. Favicon of http://ozhey.tistory.com BlogIcon 로로롱 2008.11.27 03:54 신고  댓글주소  수정/삭제  댓글쓰기

    좋은 글 읽고 가용 ^^ 트랙백 걸어요 ㅋ

  3. Favicon of http://hanseongmin.com BlogIcon 한성민 2008.11.27 22:22 신고  댓글주소  수정/삭제  댓글쓰기

    우와~~~ 너무 잘 쓰는 것 같아요...
    감탄이 절로 나옵니다.....
    잘 보고 가요..^^

얼마전 다음에서도 지도 Open API를 오픈했습니다.
상관있을지는 모르겠지만, 다음이 지도서비스를 점점 확대해 나가고 있는 추세여서 API의 확장이 주목됩니다.

지도 API의 오픈 기념으로 다음에서 Wii를 경품으로 걸고 공모전을 열었습니다.
저도 한번 시도해 볼까 하고 준비를 했는데, 아무래도 시간내 뭔가 개발하기엔 무리일것 같네요.

뭔가 장난감을 만들려고 다음 지도 API 레퍼런스를 찬찬히 살펴봤는데, 이거 원하는 위치를 검색하여 좌표값을 얻어내는 부분이 아무리 찾아봐도 없는거 아니겠습니까. (혹시 있나요? ㅠㅠ)

어떻게 해야 할까 고민하다가 네이버(Naver) 지도의 geocode.php 를 사용해서 좌표값을 얻어와 사용하기로 했습니다.

2008-11-20 야후 POI로 수정하였습니다. (링크)

우선 네이버 지도에서 좌표값을 얻어 오는 것은 그리 어려운 일이 아닙니다.


으로 쿼리를 날리면 XML로 해당 지역에 대한 정보를 리턴해줍니다.
http://maps.naver.com/api/geocode.php?key=121e2df395922dbf590500128ee788fe&query=%C0%E1%BD%C7
위 링크대로 잠실로 검색하여 주소창에 입력하면 아래와 같은 결과값을 보여줍니다.


이제 이 XML을 갖고 요리를 하면 되는겁니다.

이렇게 얻어낸 좌표값은 ktm 좌표체계를 사용합니다. 반면 다음의 기본 좌표체계는 wgs84를 사용합니다. 따라서 이에 컨버팅을 해 줘야 하는데, 다음지도에서는 ktm 좌표체계도 지원하기 때문에 기본 좌표체계를 ktm으로 변경해주면 해결됩니다.

  var map = new DMap("map"); 
  map.setCoordinateType("ktm");

위 코드와 같이 맵을 생성하고, 맵의 기본 좌표체계를 ktm으로 변경해주시면 별다른 컨버팅 없이 바로 네이버의 geocode를 사용할 수 있습니다.

이 페이지에서 직접 테스트가 가능합니다.
혹 아래 화면에 지도가 보이지 않는 분들은 아래 링크에서 테스트해보시면 됩니다. (원하신다면 ^^)
http://ottd.iruis.net/~onionmen/daum/

그래도 안보이시는 분들은 문자 인코딩을 아래 이미지와 같이 UTF-8로 변경해 주세요.




Posted by onionmen

댓글을 달아 주세요

  1. 2008.11.23 21:11  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

레뷰 프론티어에서 진행하는 이번 리뷰주제는 V3 365 이쩜영 버전 입니다.

리뷰할 서비스는 V3 365 스탠다드 버전과 PC 주치의 버전입니다.
이 포스트는 스탠다드 버전을 리뷰 하였습니다.

총 네개의 구성으로 되어있습니다.

  1. 설치편 : 구성요소의 설치과정 및 첫인상.
  2. 사용편 : 사용성에 중점을 두어 각 메뉴들의 간략한 리뷰.
  3. 옵션편 : 각 구성요소들의 세부메뉴에 대한 간략한 리뷰.
  4. 비교편 : 카스퍼스키와 비교가능한 기능들을 비교한 간략한 리뷰.
  5. 총   평 : 말그대로 총평.



설치편 보기



사용편 보기



옵션편 보기



비교편 보기



총평 보기


Posted by onionmen

댓글을 달아 주세요

  1. avgn 2008.11.08 23:28 신고  댓글주소  수정/삭제  댓글쓰기

    리뷰 잘 봤습니다. 특히 총평부분에서 타사 제품과의 성능 및 시장성에 대한 부분을 알기 쉽게 정리해 주셔서 백신에 대해 잘 모르는 제겐 도움이 많이되네요 감사합니다 ^^

  2. 2008.12.10 19:19  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  3. Favicon of http://www.naver.com/ BlogIcon ijh8898 2008.12.10 19:19 신고  댓글주소  수정/삭제  댓글쓰기

    비밀 댓글 이라고요?

비단 휴대폰 뿐 아니라 휴대용 기기에까지 터치 바람이 불고있는 가운데 새로운 개념의 휴대폰이 등장했다.  스카이만의 different 한 아이디어로 내놓은 바람인식 폰이다.


세가지 컬러로 선택의 폭도 넓고, 대형화면에 지상파 DMB도 지원한다. 입김을 불어줌으로써 사진도 넘길 수 있고, 입김을 통한 이모티콘이나, 전용 대기화면에서는 입김을 불어 잎사귀등을 떨어뜨리는 등의 재미있는 컨텐츠가 있다.

바람 인식기능은 아이디어 구현의 시작이기 때문에, 이를 활용할 수 있는 컨텐츠가 부족한 상황이지만, 처음이라는 것에 그 의미가 크다.

브랜드화 라는 것의 성공을 보여준 스카이.
고등학생 때만 하더라도, 학생들 선망의 대상이었던 SKY가, 주춤하던 모습을 버리고 다시 예전의 명성을 되찾을 수 있는 날이 가까워 오고 있는 듯 하다.



현재 http://isky.co.kr 에서 SKY WHooo~~ 의 체험단을 모집하고 있으니, 관심있는 사람들은 한번 도전해 보길 바란다.

불어라. 떨어지리라.
Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://lambshyun.onionmen.kr BlogIcon 셔니냥 2009.02.16 15:26 신고  댓글주소  수정/삭제  댓글쓰기

    오아.ㅋㅋ 저도이거해봐야겠어요~

지하철의 시간표가 궁금할 때가 있습니다. 약속시간을 맞추기 위해서라든지, 뭐 각각의 이유가 있겠죠. 좀 전에 위젯팩토리에 대한 글을 쓰면서(2008/11/24 - [Review/IT] - 예쁜, 재미있는, 유익한 위젯을 만나자 - 위젯팩토리) 지하철 시간표 검색 이라는 위젯을 제안한 바 있습니다.

내가 한번 만들어 볼까 라는 생각에 WZDAPI를 사용하여 시도하다가 (어려움 때문에)잠시 보류하고, 좀 더 쉬운 검색창에서 검색하기를 만들어 보았습니다.

subway <-- 클릭 해보시면 아래 이미지와 같은 화면이 나타납니다.


그러면 아무런 반응이 없는데, 브라우저의 검색창을 눌러보면 아래 사진과 같은 메뉴를 발견하실 수 있습니다.


여기서 subway timetable 을 선택 한 후 검색창에 다음과 같이 입력합니다.

노선번호 공백 역이름 (ex) 8 문정

그리고 엔터를 치시면 타임테이블이 검색되어 나옵니다.


어때요, 참 쉽죠? 타임테이블은 서울메트로 에서 가져왔고 현재 제가 만든 검색창은 8호선까지 지원합니다. 추후에 분당선 및 다른 노선도를 추가해볼께요.


유용하게 사용하셨으면 좋겠네요. (문제의 소지가 있어서 조만간 사라질지도 모릅니다.)
아래 링크를 방문하여 검색창을 설치하세요. ^^


Posted by onionmen

댓글을 달아 주세요

  1. 2008.11.27 10:03  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  2. Favicon of http://ozhey.tistory.com BlogIcon 로로롱 2008.11.27 10:23 신고  댓글주소  수정/삭제  댓글쓰기

    힝 ㅠ 저는 서브웨이가 클릭 안되여;;

  3. 섹시녀 2008.11.28 16:33 신고  댓글주소  수정/삭제  댓글쓰기

    양파맨님 눈먼자들의 도시 영화 같이 보자고 하니까 벌써 가셨네요..
    섹시녀는 슬픕니다..ㅠㅠㅠㅠㅠ

작년 3월 이후 아직까지 미투데이에서 떨어질 줄 모르고 있습니다. 요즘엔 활동이 뜸하지만, 한때는 아주 살다시피 했었죠. 신규 회원분들도 많이 들어왔을텐데, 새로한 친구신청이 올들어 손가락에 꼽을 수 있을 정도니 큰일입니다.

미투데이를 하다보면 많은 사람들이 한번씩 경험하는게 있는데 바로 번개입니다. 대규모, 혹은 소규모로 사람들이 모여서 먹고 마시고 떠들죠. ^^ 개인적으로는 커뮤니티들의 정모와는 살짝 분위기가 다르다 생각해요. 만나면 처음엔 어색해도 어느샌가 오래된 친구들 처럼 편하게 대하는 자신을 발견하게 되죠.

뜬금 없지만, 얼마 전에 다음지도 OpenAPI가 오픈했습니다. 이걸로 뭔가 재밌는걸 만들어볼게 없을가 고민하던 중에 우리 미투데이의 특성을 살려서 지도와도 부합하는 번개도우미를 만들어보면 어떨까 생각했습니다. 사실 이 아이템은 작년에 생각한건데, 그 때는 지도대신 지하철 노선도를 만들어서 지하철역을 중심으로 하는 번개도우미였습니다. 

지도로 만들자고 결정했을 때만 해도, 지하철노선도로 만들고 싶은 생각이 간절했으나. 상황에 조금 타협했습니다. 하지만 만들고 보니까 지하철노선도 보다는 좀 더 쓸모있겠다 싶네요.

Daum API는 지역검색을 지원하지 않아서, 원하는 지명의 좌표값을 받기 위해서는 다른 API를 사용해서 좌표값을 얻어와야 했습니다. 처음엔 네이버 geocode 로 그 작업을 진행했는데, 네이버는 단순히 지역만 리턴해주고, 지하철역이나 좀 더 세부적은 곳은 검색해내지 못하는 문제가 있어서 야후 POI로 급 노선 변경하였습니다.

2008/11/18 - [Review/IT] - 네이버(Naver) 를 통해 다음(Daum) 지도를 검색하자.


우선 개발상태는 다음과 같습니다. 이게 좀 직관적이지 못한것도 같네요. 뭐 설명도 하나 없어서 당황스러운것도 사실입니다. ㅎㅎ


뭐 보면 검색어를 입력할 수 있는 검색창이 있고, 검색된 상태에서 클릭하면 그 지역으로 지도가 이동합니다.

검색어를 입력하면 위 이미지와 같이 검색된 내용이 출력됩니다. 참 쉽죠?
이제 원하는 곳의 근방을 클릭해서 지도를 이동합니다.


위치 이동후 원하는 지역을 더블클릭 합니다.(한번클릭으로 변경 되었습니다.) 더블클릭하면 클립이미지가 뜨고, ( <-- 이런 이미지 입니다.) 거기에 한번 더 클릭을 하게 되면 위에 보이는 작은 레이어창이 뜹니다. 여기에 번개정보를 입력하고 등록을 누르면 완료입니다.

어때요, 참 쉽죠?

등록을 위해서 날짜, 미투아이디만날 장소는 필수입력이고, 사용자키를 입력하면 자신은 자동으로 참여 됩니다. 그리고 이 번개 내용을 자신의 미투에 알리고 싶다면 사용자키를 입력하셔야 합니다. 사용자키. 뭔지 아시죠? ^^

등록이 완료되면 아래와 같이 등록된 내역이 보입니다.

여기서 빨간색 부분을 클릭하면 지도에서 바로 이동하고, X명 으로 표시된 부분을 누르면 이 번개의 현재까지의 참가자를 볼 수 있습니다. 그리고 참여하기를 누르시면 이 번개에 참여가 되지요.(로그인 필요합니다.)
** 참여하기는 버튼을 누를 경우 사용자키를 입력받아서 별도의 수고를 들이지 않도록 개발할 예정입니다.


리스트에서 선택한 부분으로 지도가 이동하면 클립이 나타나는데, 이 클립을 한번 클릭하면 등록자가 어떤 번개를 생성하였는지 확인할 수 있습니다.

마지막으로 Me2Meet은 IE8의 최신 기중 중 webslices 를 지원합니다.
2008/08/12 - [Review/IT] - [ IE8 ] 웹슬라이스를 적용한 미투데이 최근 댓글 구독.
2008/08/11 - [Review/IT] - [ IE8 ] 웹슬라이스(webslices) 적용했습니다.

http://ottd.iruis.net/~onionmen/me2/meet/meet_list.php 이 주소로 들어가시면 IE8이나 FF with webchunks 사용자는 다음과 같은 표시를 볼 수 있습니다.

웹슬라이스를 등록 하면 지도에서 확인하는것과 같은 것은 무리일지 몰라도 어떤 번개가 어디서 열리는지는 쉽게 확인 할 수 있습니다.


Me2Meet 을 사용한 모든 번개정보는 http://me2day.net/me2meet 이라는 계정에 기록됩니다. 이 계정의 RSS(http://me2day.net/me2meet/rss)를 등록해놓으면 번개정보를 바로바로 확인 할 수 가 있지요. 번개에 목마른 미투인들. 이참에 한번 번개 호스트가 되어 보는게 어떠신가요?

관심Tag로 me2meet 을 등록해 놓으면 이 역시 바로바로 번개글 확인이 가능합니다. 참고하세요!

Me2Meet 의 주소는 http://ottd.iruis.net/~onionmen/me2/meet/  이곳 입니다. :-)

아쉽지만 해외는 지원하지 않아요!

  • 08년 11월 30일  미투데이 쉬운웹인증을 추가했습니다. 좀 더 사용하기 편리할 거 에요.
  • 08년 11월 30일  등록 후 모임등록하기 창을 꺼버리는데 성공했습니다. 정확히 얘기하면 끄는건 아니지만 어쨋든 사용성면에서 프러스가 되겠네요. 
  • 08년 11월 30일  등록 후 번개리스트가 자동갱신 되도록 수정하였습니다. 역시 사용성 향상에 도움을 줄 수 있겠네요.

이렇게 대충 개발을 마치긴 했는데, 아직 미흡한 것이, 장소를 등록하고, 등록창을 끄지 못하고 있습니다. 어떻게 창을 없애야 하는지 좀 감이 잡히지 않네요. 또, 등록을 완료하면 아래 창에 자동 갱신이 되게 하고 싶은데, 이거 쉽지가 않네요. 계속 Failed to open POST stream 이 뜨는데, 정확한 원인은 모르겠네요.
-> mark 를 두개 만들어서 새로 호출하는 방식으로 해결했습니다.
-> 해결했습니다. ajax.request 에서 onSuccess 부분에 parent.parent. 넣어주니 되는군요. -_-

디자인도 좀 입히고 싶은데, 디자인하기 너무 힘드네요. 디자인 하는게 PPT만드는거만큼만 쉬웠어도, 좀 더 이쁜놈이 나왔을텐데 살짝 아쉽습니다.

마지막으로 IE6에서 어떻게 나올지 모르겠네요. 미투사용자중에 IE6를 사용하는 사람은 많이 없겠지만, 간혹가다 있을지 모르니..
처음이랑 인터페이스가 변경 되었는데, IE6에서 깨지는 문제로 하루종일 작업했습니다. ㅠㅠ IE6싫어요! 뭐 그렇다고 파이어폭스3이나 IE7,8 에서 이쁘게 나온다거나 그런건 아니에요.

이 서비스는 Daum 지도 OpenAPI, Yahoo POI API, Me2day OpenAPI 그리고 Me2PHP를 사용하여 개발되었습니다.
API를 제공해주신 분들께 감사드리고, 특히 me2php를 제작해주신 홍민희 님께 너무너무 감사드려요~!!

Posted by onionmen

댓글을 달아 주세요

  1. 김복정씨 2008.11.24 00:18 신고  댓글주소  수정/삭제  댓글쓰기

    간지나는데? ㅋㄷㅋㄷㅋㄷㅋㄷ

  2. Favicon of http://www.annonce-su.com/ BlogIcon Suisse 2009.01.13 09:08 신고  댓글주소  수정/삭제  댓글쓰기

    마지막으로 Me2Meet은 IE8의 최신 기중 중 webslices 를 지원합니다?

    • Favicon of http://onionmen.kr BlogIcon onionmen 2009.01.13 23:45 신고  댓글주소  수정/삭제

      네, 곧 출시할 마이크로소프트의 익스플로러8.0이 지원하는 웹슬라이스를 지원합니다. ^^
      http://onionmen.kr/255 여기 참고하세요


블로그 칵테일의 새로운 웹서비스인 위드블로그에 가입하였습니다. 첫느낌은 심플함이네요. 아직 클로즈베타라 몇몇 메뉴들은 공개가 되어있지 않은듯 싶습니다. (이 공개안된 몇몇 기능들 중에 도움말은 좀 빨리 오픈했으면 좋겠습니다.)

블로그마케팅과 관련한 곳이지만, 건강한 블로깅을 표방하고 있습니다. 클로즈베타 단계라 많은 내용을 알려드릴 수는 없을것 같습니다만, 알려드릴수 있다고 해도 아는게 별로 없네요. ^^;;

테터엔미디어나 블로그뉴스룸같은 서비스와 비슷한 웹서비스가 될 것 같은데, 아직 슬로건 말고는 특별한 점이 보이지 않습니다.

이러 웹서비스의 가장 큰 문제점은 파워블로거 위주로 흘러가게 된다는 것입니다. 마치 몇몇 기업들이 직원채용할때 특정대학출신을 선호하는 것 처럼 말이죠. 이는 서비스제공업체의 문제라기보다 역시 광고주가 파워블로거를 원한다는 점이 가장 크겠지요. 이런 서비스는 광고주의 힘이 좀 크게 작용하니 말이죠.
이러한 점들을 어떻게 풀어갈지 앞으로의 행보에 관심이 가네요.

한달간의 베타서비스 동안 열심히 써봐야 하겠습니다.
Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://cruseed.tistory.com/ BlogIcon Cruseed 2008.11.18 12:31 신고  댓글주소  수정/삭제  댓글쓰기

    테스트 후기가 기다려지네요...^^

  2. Favicon of http://echoya.com BlogIcon 에코 2008.11.18 14:36 신고  댓글주소  수정/삭제  댓글쓰기

    이거 베타 기간이 한달이였음?ㅋ

    • Favicon of http://onionmen.kr BlogIcon onionmen 2008.11.18 14:58 신고  댓글주소  수정/삭제

      넹, "이번 테스트는 총 한달간 진행합니다." 라는 문구가 있어염. 한달 후에 기존 테스터들이 어떻게 될른지는 잘 모르겠어요. ㅎㅎ

  3. 안녕 2008.11.20 11:27 신고  댓글주소  수정/삭제  댓글쓰기

    이건 또 뭥미 뭥미.ㅋㅋㅋㅋ

IE8 beta2 세미나가 지난 9월 건국대 새천년 기념관에서 열렸었습니다.

세미나 이전에 IE8용 웹슬라이스 관련 게시물을 작성한적이 있었습니다. 세미나 후에 제 블로그에 IE8과 웹슬라이스로 검색하여 들어오시는 분이 꽤 되었던걸 보면 이슈가 되긴 했었나 봅니다.

[관련글]
2008/08/12 - [Etc..] - [ IE8 ] 웹슬라이스를 적용한 미투데이 최근 댓글 구독.
2008/08/11 - [Etc..] - [ IE8 ] 웹슬라이스(webslices) 적용했습니다.

세미나에선 총 3가지의 기능을 소개했었는데, 그 중 하나가 이전에 소개드린 웹슬라이스고, 나머지 둘이 엑셀러레이터와 비쥬얼서치 입니다.

음, IE8이 선행되어야 한다는 단점 때문에 아직까지는 많은 분들이 이용하지 않고, 그만큼 관심도 상대적으로 적지만 사용자층이 두터워 진다면 재미있는 것들이 많이 나올 것으로 예상됩니다.

웹슬라이스에 이어서 나머지 두개 기능도 한번 만들어봐야지 생각했었는데, 이제야 시도를 해 보았습니다.
막상 해보고 나니 큰 어려움 없이 적용할 수 있었습니다. 아니 큰 어려움도 아닙니다. 정말 쉽더군요. 

딱이죠?

비쥬얼 서치에 적용하면 검색어 추천에, 사진자료까지 딱인듯한 아이템이라 바로 적용해보았습니다.  
위 검색창에 검색어를 입력하러 가지 않아도, 쉽게 검색을 할 수 있도록 만들어보겠습니다.

여기 검색어를 입력해보세요.


바로 익스플로러의 검색어 창에 검색 공급자를 등록하는 것인데요, 이게 생각보다 그리 어렵지 않습니다.


우선 XML 을 만들어야 하는데, 틀은 다음과 같습니다.

 

<?xml version="1.0" encoding="euc-kr"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/"> 
    <ShortName>DNF item</ShortName> 
    <Description>DNF item search</Description> 
        <Url type="text/html" template="http://www.d-fighter.com/?GO=dictionary|item&amp;clickSV=dnf&amp;search_text={searchTerms}" /> 
        <Url type="application/x-suggestions+xml" template="http://ottd.iruis.net/~onionmen/dic_test.xml" /> 
    <Language>ko-kr</Language> 
    <OutputEncoding>euc-kr</OutputEncoding> 
    <InputEncoding>euc-kr</InputEncoding>
</OpenSearchDescription> 

 여기서 중요한 부분은 붉은색으로 표시되어 있는 Url 입니다.

Type

   

Text/html

Request

검색어를 입력했을 때 실제 처리하는 부분

Application/x-suggestions+xml (+json)

optional

검색어 제안등의 부가기능을 제공

첫번째 type이 text/html 으로 되어 있는 부분은 검색어를 넘겼을 때 실제 검색을 처리하는 부분입니다.
바로 검색창에 검색어를 입력하고, 돋보기 아이콘을 클릭했을 때 실제 검색어를 처리하는 부분이죠.

중요한것은 get 방식으로 넘길 때 인자를 구분하는 &의 값을 &amp; 로 써주셔야 합니다.
그 아래 type이 application 으로 되어 있는 부분은 option 입니다. (제가 지금 IE7 이라서 이미지는 주말이 지나서 추가해야 할 듯 싶습니다.)

이미지와 함께 제공되는 검색어 추천을 사용하고 싶다면 저 부분을 따로 개발하여 넣으면 됩니다. +xml 이라고 되어 있으면 xml 타입으로 개발을 해야 하고, +json 으로 표기를 하면 json 으로 출력되도록 개발하시면 됩니다. 나머지 부분은 굳이 신경쓰지 않으셔도 되고, 한번 보시면 다 아실 내용이라 생각됩니다.

이 XML을 서버에 올려놓고 이제 XML을 추가할 수 있도록 "무엇인가" 를 만들어야 겠지요.

뭐 이 "무엇인가" 를 만드는 것은 일도 아닙니다.

<a href="#" onclick="window.external.AddSearchProvider('http://ottd.iruis.net/~onionmen/dnf_item_search.xml')">Add Search Provider Example</a>

위와 같이 window.external.AddSearchProvider() 라는 프로퍼티에 xml위치에 해당하는 인자값 하나만 넣어주면 완성이고, 이 링크를 클릭하면 검색공급자 등록을 할 수 있습니다.

위와 같은 메시지가 뜨면, 공급자 추가를 선택하여 검색공급자를 등록할 수 있습니다.

이제 검색공급자가 추가된 것을 확인하실 수 있습니다.


공급자를 DNF item 으로 변경하고, 검색어를 입력하면 이제 검색된 내용을 볼 수 있게 됩니다.

어때요, 참 쉽죠?

이건 단순한 검색공급자 를 만드는 것이었고, 이제 핵심기능인 비쥬얼서치를 살펴볼까요?

이것또한 별것 없습니다.

<Url type="application/x-suggestions+xml" template="http://ottd.iruis.net/~onionmen/dic_test.xml" /> 

이 부분 기억 하시나요. 여기 들어있는 dic_test.xml 이라는 부분이 바로 비쥬얼서치에 사용될 부분입니다. 지금은 예제로 간단한 xml을 만들었는데, 이부분은 프로그래밍이 들어가야 하는 부분입니다. 검색어에 의해서 관련된 xml이 생성되도록 해야 하지요.

아래 xml은 역전 이라는 검색어를 입력하면 그와 관련된 추천검색어와 비쥬얼서치의 모습을 보여주는 xml 입니다.

<?xml version="1.0" encoding="euc-kr"?>
<SearchSuggestion version="2.0" xmlns="http://opensearch.org/searchsuggest2">
  <Query>역전</Query>
  <Section>
    <Item>
      <Text>역전</Text>
      <Url>http://www.d-fighter.com/?GO=dictionary|item&amp;clickSV=dnf&amp;search_text=역전</Url>
    </Item>
    <Separator title="Finding in DNF" />
    <Item>
      <Text>역전의 월록</Text>
      <Description>거너용 무기</Description>
      <Url>http://www.d-fighter.com/?GO=dictionary|item&amp;TO=&amp;clickSV=dnf&amp;mode=view&amp;search_text=역전&amp;se=&amp;category=&amp;position=1&amp;it_no=31107</Url>
      <Image source="http://img.d-fighter.com/img/item_img/revolver/00037.png" width="28" height="28" />
    </Item>
  </Section>
</SearchSuggestion>


위와 같이 xml을 작성하여 서버에 업로드 하면, 이제 단순한 검색창에서 벗어나 한눈에 검색결과를 볼 수 있게 됩니다.



어때요. 참 쉽죠?

던파 관련 자료는 아래 링크에서 찾으실 수 있습니다.
http://ottd.iruis.net/~onionmen/dnf/


한번 재미있는 분야에 응용해보아요~~~ ^^

자주가는 me2day 의 검색창을 만들어봤습니다.
me2day 계정이 있으신분은 아래 링크로 가셔서 테스트 해보세요.

http://ottd.iruis.net/~onionmen/me2/test.php?me2id=자신의 미투 url 뒷자리
(ex : http://ottd.iruis.net/~onionmen/me2/test.php?me2id=sumanpark )
Posted by onionmen

댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. 와 신기해 2009.05.19 09:56 신고  댓글주소  수정/삭제  댓글쓰기

    좋은내용이내요 .. 이거있으면 검색 엄청 편리할듯 ㅋㅋ 아이템도 쉽게찾고

  3. 무헌~ 솔히야? 2009.05.19 16:03 신고  댓글주소  수정/삭제  댓글쓰기

    나 컴맹 ? ㅎㄷㄷ ;;

  4. 나도 컴맹.... 2009.05.19 16:45 신고  댓글주소  수정/삭제  댓글쓰기

    인가;; 무슨얘기인지 하나도 모르겠네염. 명색이 컴공과인데

  5. 네오플은 내용 알까? 2009.05.19 17:02 신고  댓글주소  수정/삭제  댓글쓰기

    네오플은 내용을 알고 오던을 띄운 걸까여 ???

  6. 이분이 네오플 직원 2009.05.19 17:15 신고  댓글주소  수정/삭제  댓글쓰기

    이분이 네오플직원인데 내용알까는 뭔 개소리인가여

  7. 미네르바 2009.05.19 17:46 신고  댓글주소  수정/삭제  댓글쓰기

    전 간이드북이있습니다 ㅎㅎ

  8. 바보들의 행진이구만 2009.05.19 18:23 신고  댓글주소  수정/삭제  댓글쓰기

    바보님들 .. 두뇌가 병X면 손발이 고생한다더니
    http://ottd.iruis.net/~onionmen/dnf/
    클어가서 툴바추가하세요

  9. 로드-나이트 2009.05.19 18:39 신고  댓글주소  수정/삭제  댓글쓰기

    어차피 홈피에서 게임접속하는 게임인데 던파에서는 별로 필요없는 기능같네요
    좋은 정보임에는 분명하지만...오던의 기준은 참...난해하군요

  10. 유고 걸 2009.05.19 19:12 신고  댓글주소  수정/삭제  댓글쓰기

    뭘까?

  11. BlogIcon 지나가는하천민 2009.05.19 20:45 신고  댓글주소  수정/삭제  댓글쓰기

    풉.길가던하천민도이해함ㅋ
    님들뭐임ㅋ

  12. 1234 2009.05.19 21:46 신고  댓글주소  수정/삭제  댓글쓰기

    결국 스크롤은 엄청난 속도로 내려오기 시작하는데..

  13. 2009.05.19 22:55  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  14. Favicon of http://blog.naver.com/qlsngood BlogIcon Ziskad 2009.05.19 23:01 신고  댓글주소  수정/삭제  댓글쓰기

    ㅇㅅ ㅇ 음침님 블로그에서 본 그 양파맨님인거같군여?!
    위에 있는 식을 어디로 보내야하는지 잘 모르갰내욥 ㅠㅠ

  15. 네츠아이 2009.05.19 23:44 신고  댓글주소  수정/삭제  댓글쓰기

    음...페이지에 오류가 있습니다 뜨는데...어찌해야함 ㅠㅠ
    비주얼 서치만 안됨 ㅠ

  16. Ruid 2009.05.20 16:47 신고  댓글주소  수정/삭제  댓글쓰기

    이거 해논거 없애는 방법은 없나요

  17. =ㅅ= 2009.05.20 17:01 신고  댓글주소  수정/삭제  댓글쓰기

    어떤게 쓰는거야.............

  18. 이글 쓴사람 폅신 2009.05.22 18:51 신고  댓글주소  수정/삭제  댓글쓰기

    이딴게 왜 오던인지 모르겠네 ...

  19. 이해안되냐? 2009.05.23 19:22 신고  댓글주소  수정/삭제  댓글쓰기

    IE8 하루만 써보면 뭔얘긴지 다 안다.

  20. ㅋㅋ 2009.05.23 21:29 신고  댓글주소  수정/삭제  댓글쓰기

    ㅋㅋ 오던 추카

  21. Favicon of http://www.runpapa.com BlogIcon car 2011.06.21 06:33 신고  댓글주소  수정/삭제  댓글쓰기

    이거 해논거 없애는 방법은 없나요

블로그에 웹슬라이스를 적용했었습니다.

그리고 제가 자주 사용하는 웹서비스 미투데이(링크)에도 이 기능을 적용 할 수 있을 것 같아 시험삼아 만들어 봤습니다.

아이디만 알면 그사람의 최근 덧글을 가져올 수 있는 일종의 가젯입니다.
이용하시려면 IE8을 설치하시거나, 아니면 일전에 소개해드린 파이어폭스의 확장기능인 Webchunks (다운로드링크) 를 설치하셔야 합니다.

웹슬라이스를 적용하기 위해 HTML을 파싱하는 simple HTML DOM parser(링크) 를 사용했습니다.


DOM parser를 이용해 Comment To Me의 내용만 추출했습니다.

사용자 삽입 이미지

이 곳에 webslices 를 적용시킬 div 태그만 넣으면 끝날 줄 알았는데, 아니더군요. -_-;

사용자 삽입 이미지

링크부분에 http://me2day.net 이라는 부분이 빠져있어서 /eyedamping 이라는 Mr.면도날드님의 아이디만 링크로 연결되어 있었습니다. 그래서 클릭해도 제대로된 링크로 갈 수 없었습니다.

그래서 저 HTML을 다시 파싱하여 링크를 넣었습니다.
사용자 삽입 이미지

사용자 삽입 이미지

제대로 된 링크가 잡혔고, 웹슬라이스를 적용시킬 태그 몇개를 더 넣어주어 완성하였습니다.

사용자 삽입 이미지

파이어폭스에서 모습


사용자 삽입 이미지

IE8에서의 활용 모습

완성!

사용자 삽입 이미지

여기 이렇게 아이디만 바꿔서 webslices 로 등록하면 됩니다!

사용자 삽입 이미지


별도의 OpenAPI를 사용하지 않고도 HTML 포함 41줄 코딩하여 간단하게 최근댓글을 불러올 수 있게 되었어요.
간단한 CSS도 적용해서 좀 더 예쁘게 만들 수도 있어요.

어떄요. 참 쉽죠?



덧1. FF는 클릭 즉시 읽어오기 때문에 덧글 내용을 바로바로 확인할 수 있는데, IE8의 경우는 15분의 수집시간이 있어서 내용을 바로바로 확인할 수 없어서 아쉽습니다!

덧2. PHP5를 지원하고 allow_url_fopen 옵션이 On 으로 되어있는 웹서버가 없어서 외부서버에서 돌릴 수가 없네요. ㅠㅠ

덧3. 조금의 수고를 들여서 RSS로도 만들수 있겠네요.

덧4. 소켓통신을 이용해서 외부에서 접근할 수 있도록 만들었습니다.
주소 : http://ottd.iruis.net/~onionmen/?me2id=
me2id 다음에 자신의 미투데이 주소를 넣으세요.
(예: http://ottd.iruis.net/~onionmen/?me2id=3rdtype)

Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://www.hwanny.net BlogIcon Noel 2008.08.12 13:09 신고  댓글주소  수정/삭제  댓글쓰기

    "참 쉽죠?" 라는 말이 밥 로스가 문득 생각나는군요 ^^;

  2. Favicon of http://icehit3.tistory.com BlogIcon 파초 2008.08.12 14:40 신고  댓글주소  수정/삭제  댓글쓰기

    재밋어 보이긴 한데, ie 8을 설치해야 된다는 얘기에 귀차니즘이 도지는군요 ^^;

    • Favicon of http://onionmen.kr BlogIcon onionmen 2008.08.12 14:49 신고  댓글주소  수정/삭제

      IE8 말고도 파이어폭스 사용하신다면 확장기능 설치로 사용 가능합니다. 파폭 사용 안하신다면 어쩔수 없지만요. ㅎ 언젠가 IE8 정식버전이 나온다면 한번 사용해보세요. ^^

  3. Favicon of http://pys.i21c.net BlogIcon 박영식 2008.08.12 16:38 신고  댓글주소  수정/삭제  댓글쓰기

    좋아요 좋아요.

  4. Favicon of http://marketings.co.kr BlogIcon 마케팅스 2008.09.07 00:24 신고  댓글주소  수정/삭제  댓글쓰기

    와, 하지만 역시 8 버전이 선행되어야 한다는 ,.., 웹슬라이스를 보고 웨슬리스나입스가 생각나는건 웨일까 ,,. 웨 ..

    • Favicon of http://onionmen.kr BlogIcon onionmen 2008.09.17 23:43 신고  댓글주소  수정/삭제

      ㅎㅎ 안녕하세요 넷물고기님. 제가 답글이 많이 늦었네요 ^^;;

      오늘 IE8 Beta2 세미나에 다녀왔습니다.
      참 많이 좋아졌더군요. 이참에 IE8한번 설치해보심이 ^^

      웹슬라이스와 웨슬리스나입스 ㅋㅋ 비슷하네요. ㅎㅎ

  5. Favicon of http://echoya.com/ BlogIcon 에코 2008.09.10 23:25 신고  댓글주소  수정/삭제  댓글쓰기

    님하, 언제쯤 쉬워지나요?ㅋㅋ

webslice 라고 적어놨는데, webslices 군요. 제목 수정했습니다.


언젠가 uxfactory 에서 글을 보고 내 블로그에도 적용시켜 봐야지 했는데, 오늘 회사에서 시간이 잠시 비어 적용해 봤습니다.

IE8에 도입된 새로운 기능 중 하나인 웹슬라이스를 사용할 수 있도록 적용해봤습니다.
어려운 기술이 들어가는 것은 아니고 단지 HTML 태그 두세개만 추가해주면 쉽게 적용 가능하네요.

다음 URL을 가보시면 쉽게 적용시킬 수 있을 것 같습니다.

링크

간단히 요약하자면 다음과 같은 태그를 적용시키고자 하는 부분에 넣어주시면 됩니다.

<div class=”hslice” id=”1”>
  <p class=”entry-title”>item - $66.00</p>
  <div class=”entry-content”>high bidder:buyer1
     적용시킬 태그를 이곳에 넣어주세요.
  </div>
</div>

div나 p 와 같은 태그는 신경안쓰셔도 되고, class 부분에 들어가는 이름만 적용하시면 될 듯 합니다.
그에 맞는 CSS도 함께 적용시켜주시면 한층 이쁘겠죠?

현재 IE8 베타1에서 이 기능을 사용하실 수 있고, FF3에서는  Webchunks (다운로드링크) 라는 이름의 확장기능을 통해 사용하실 수 있습니다. 이 확장기능은 IE8 beta1이 공개되자마자 다음날 바로 FF용 확장기능으로 나와 사람들의 입에 오르내린적이 있습니다. 현재 FF 3.0.1에서 사용가능한 버전은 webchunks 0.13 버전입니다. 위 링크에서 받으세요.

IE8과 부가기능을 설치한 FF 사용자가 제 블로그 사이드바의 최근 댓글에 마우스를 올리시면 손쉽게 추가하실 수 있습니다.

사용자 삽입 이미지

파이어폭스에서의 이미지


사용자 삽입 이미지

요건 IE8에서의 모습.

재미로 적용시켜 봤는데, 추후에 IE8이 보급될 경우 많은 확장성이 있겠네요. ^^

IE의 경우에는 즐겨찾기의 빠른연결에 등록이 가능한데, FF의 경우는 빠른연결 하단에 또다른 Bar 가 생기는점이 아쉽습니다.

그리고 IE는 아직 버그인지 이름을 수정해도 반영이 되지 않는군요. 조만간 Beta2나 정식버전이 나오면 수정될 부분인것 같습니다.

Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://dbjang.tistory.com BlogIcon dbjang 2008.08.22 20:32 신고  댓글주소  수정/삭제  댓글쓰기

    아이콘을 누르면 옆으로 프레임처럼 나타나는건가요??
    내가 정확히 이해를 잘 못하는 듯.. ^^;;;;;

    • Favicon of http://onionmen.kr BlogIcon onionmen 2008.08.24 01:31 신고  댓글주소  수정/삭제

      아이고, 안녕하세요 란♡님. 오랜만입니다.
      제 글에 설명이 부족했나봅니다.
      아이콘을 누르면 프레임처럼 나타나는건 아니고, 즐겨찾기처럼 등록이 됩니다.

      익스플로러(또는 FF)의 주소표시줄 아래에 등록이 됩니다. 그리고 그걸 클릭하시면 별도의 창이 뜨지 않고 바로 그부분에 대한 업데이트된 내용을 확인하실 수 있는거죠.

      자세한 내용은 이곳(http://joongs.net/15)을 참고하시면 될 것 같아요 ^^

2007/12/09 - [Etc..] - Javascript를 사용한 rich Editor.

이전에 우리는 아래와 같은 화면을 보여주는 코드를 작성한 적이 있습니다.
사용자 삽입 이미지

이제 여기에 좀 더 기능을 추가해 보도록 하겠습니다.

우선 가장 기본적으로, 굵게, 기울임체, 밑줄긋기 의 세 버튼을 추가해보겠습니다.

<input type="button" value="기울임" onClick="doCommand('italic');"/>
<input type="button" value="밑줄" onClick="doCommand('underline');"/>

위와 같은 코드를 추가해서 효과를 얻을 수 있습니다.

doCommand 메소드안에 인자값으로 italic 과 underline 을 주었습니다.
인자값의 자세한 내용은 다음 링크를 참조 하세요.


사용자 삽입 이미지

효과가 적용되는것을 확인할 수 있습니다.
이제 우리가 원하는 대로 조금씩 가까워 지고 있습니다.

이제 원하는 글씨체를 넣어볼 차례입니다.
웹페이지를 제작하면서 글꼴은 화면을 보는 사람 입장에서 생각해야 합니다. 자신의 컴퓨터에 상용글꼴들이 설치되어 있다고 상용글꼴을 사용하면, 정작 그것을 읽는 사용자 입장에선 기본폰트로 보여지기 때문에 디자인에 영향을 줄 수 있습니다. 이는 지금 이 강좌에서도 동일하게 적용됩니다.

그렇기 때문에 우리는 윈도우 기본 글꼴을 사용해서 코드를 작성할 것 입니다. 기본글꼴의 수만해도 굉장히 많이 있지요. 우선은 간단하게 굴림체와 바탕체와 궁서체만 등록을 해 보겠습니다.

<input type="button" value="바탕" onClick="doCommand('fontname','바탕');"/>
<input type="button" value="굴림" onClick="doCommand('fontname','굴림');"/>
<input type="button" value="궁서" onClick="doCommand('fontname','궁서');"/>

위와 같은 코드를 넣음으로 해서 다음과 같은 결과를 얻을 수 있습니다.

사용자 삽입 이미지

글꼴이 추가되면 계속 버튼을 추가해서 넣어야 합니다. 글꼴을 20개 넣는다면, 너무 길어져서 디자인을 제대로 할 수 없습니다.

우리는 <select> 라는 태그를 사용해서 이것을 해결할 수 있습니다.

<select>
    <option>바탕</option>
    <option>굴림</option>
    <option>궁서</option>
</select>

다음과 같은 공간활용이 가능한 결과물을 얻었습니다.

사용자 삽입 이미지


이제 셀렉트 박스(SELECT BOX) 의 선택값으로 글자체를 바꾸는 코드를 넣어보도록 합시다.

<select onChange="doCommand('fontname',this.value);">
    <option value="'Batang'">바탕</option>
    <option value="'Gulim'">굴림</option>
    <option value="'Dotum'">돋움</option>
</select>

화면은 동일하지만 내용물이 좀 바뀌었습니다. 버튼의 경우 클릭 이벤트를 받아야했기 때문에 onClick 이벤트를 사용했는데, 셀렉트박스의 경우 내용이 바뀌는 경우를 받아야 하기 때문에 onChange 이벤트를 사용했습니다. doCommand 의 경우 이번엔 인자값이 두개인데, 하나는 폰트를 바꾼다고 알려주는 것이고, 두번째는 어떤 폰트로 바꿀지 알려주는 것 입니다. this.value로 현재 선택된 value 값을 인자값으로 넘겨줄 수 있도록 합니다.

<select onChange="doCommand('fontname',this.value); this.selectedIndex=0;">
    <option>글자체</option>
    <option value="'Batang', 'Serif'">바탕</option>                                                 <option value="'BatangChe', ' Serif'">바탕체</option>                                   
    <option value="'Gulim', 'Sans-serif'">굴림</option>                                   
    <option value="'GulimChe', 'Sans-serif'">굴림체</option>                       
    <option value="'Dotum', 'Sans-serif'">돋움</option>                           
    <option value="'DotumChe', 'Sans-serif'">돋움체</option>               
</select>

코드를 넣고 각각의 option에 style="font-family: 'Batang';" 과 같은 스타일을 주어 직접 보여지는 보습의 폰트를 변경 할 수 도 있습니다.

사용자 삽입 이미지

동일한 방법으로 크기에 대한 코드를 넣습니다.

사용자 삽입 이미지

이제 얼추 기능이 추가된 것 같습니다.
좀 더 세심한 기능을 원하시는 분은 위 링크에 들어가셔서 기능을 연구해 보세요. Tistory의 편집창도 직접 만드실 수 있을 거예요.
Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://nobr.tistory.com BlogIcon nob 2007.12.12 23:56 신고  댓글주소  수정/삭제  댓글쓰기

    이런거 잘 아시는 분은 .. 멋있어 보인다는..

    역시 영어글이라 광고도 영어로 나오네요

    • Favicon of http://onionmen.kr BlogIcon onionmen 2007.12.13 00:43 신고  댓글주소  수정/삭제

      앗; 저 조금 멋있어 진건가요? ㅎ 그런데 이런거 좀 아시는 분들은 이 포스트 보면 뭔 초보가 이렇게 글을 남겼나 하실걸요. ㅎㅎ

  2. Favicon of http://echo7995.tistory.com/ BlogIcon echo 2007.12.13 00:33 신고  댓글주소  수정/삭제  댓글쓰기

    나도나도 이런거 잘아는사람
    좀 달라보인다능~ㅋㅋ

    • Favicon of http://onionmen.kr BlogIcon onionmen 2007.12.13 00:44 신고  댓글주소  수정/삭제

      ㅋㅋ 달라보이는데 막 더 안좋게 달라보이고 ㅋㅋ
      총기탈취범용의자가 이제 경찰서에 있으니, 서울갈때 검문 안하겠죠? ㅎㅎ 아이조아라

  3. Favicon of http://echo7995.tistory.com/ BlogIcon echo 2007.12.13 00:49 신고  댓글주소  수정/삭제  댓글쓰기

    검문당하게 생긴얼굴도 아니면서 ㅋㅋ 뭘 그리 조아하나요
    그나저나 그런인간은 왜 얼굴공개 안시키나 몰라

4년~5 년 전만 해도, 게시판에 글을 쓸 때 폰트의 크기를 키우거나, 색상을 변경하고 싶으면, 사용자가 직접 HTML 태그를 사용해서 글을 작성해야 했습니다. 그나마도 게시판에서 HTML을 지원해 줘야 가능한 일이었습니다. 그러다가 점점 기술이 발전해 나가고, 사용자의 편의를 신경 쓰게 되니, ActiveX를 사용한 웹게시판이 포털사이트를 중심으로 등장했습니다. 귀여운 아이콘도 넣을 수 있도록 말이죠. 하지만 최근 반ActiveX 지향적인 바람이 불면서, MS IE에서만 동작하는 이러한 게시판에 대한 원성이 높아지고 있습니다. ActiveX를 도입했던 많은 곳에서 이제 ActiveX 를 제거하고, javascript를 사용한 에디터 게시판으로 전향했습니다. 별도의 프로그램을 설치하지 않아도 되는 rich 게시판은 사용자에게 유용하게 사용될 수 있습니다. 물론 이전에도 이런 기술은 존재 하였고, 몇몇 곳에서 이미 도입하여 사용하고 있었지만, 조명을 받기 시작한 건 얼마 되지 않았습니다.

본 포스팅에서 크로스브라우징이 가능한 RICH Editor를 제작해보도록 하겠습니다.

보통 게시판을 제작할 때, 글 내용을 입력하는 부분은 <textarea> 라는 태그를 사용합니다. 하지만 <textarea>는 text 외에 어떤 html도 입력할 수 없고, 입력하더라도 단지 입력만 될 뿐 외관상 아무런 영향을 미치지 않습니다. 그래서 이 부분은 frame 의 designMode 라는 DOM을 사용하여 처리하게 됩니다. 그럼 코드를 작성해 보도록 하겠습니다.

<html>

    <head>

        <title>simple rich editor</title>

    </head>

    <body>

        <iframe id="richEditor"></iframe>

    </body>

</html>

Html 코딩이 끝났습니다. 추가한 것은 iframe 태그가 전부입니다. 이 상태로 화면을 확인해 봐도 아무것도 할 수 없으니 다음 코드를 작성해 보겠습니다.

<head>

<title>simple rich editor</title>

<script langauge="javascript">

function load()

{

    document.frames['richEditor'].document. designMode = "On";

    }

</script>

</head>

<body onload="load();">

    <iframe id="richEditor"></iframe>

</body>

페이지가 열린 후 iframe 안에 내용을 편집 가능하게 하려면 designMode 가 on 이 되어야 합니다. 그러기 위해서 <body> 안에 onload 이벤트를 사용하여, 페이지가 로드 되면 자동으로 designmode를 on 시키는 코드를 넣었습니다.

이제 코드를 작성하고 Explorer 를 실행시켜 동작시켜보면 Iframe안에 글씨를 써넣을 수 있게 됩니다. 그런데 위 코드는 파이어폭스(FF)에서는 제대로 실행이 되지 않는다는 큰 문제가 있습니다. 애써서 자바스크립트로 새로 코딩하는데, FF에서 제대로 실행되지 않으면 ActiveX를 사용하는 것과 큰 차이점이 없겠지요?

크로스 브라우징을 위해 코드를 조금 개선시켜 보겠습니다.

function load()

{

    if (document.getElementById('richEditor').contentDocument)

    {

        return document.getElementById('richEditor').contentDocument.designMode = "On";

    }

    else

    {

        return document.frames['richEditor'].document.designMode = "On";

    }

}

나머지 부분은 그대로 놔두고, 자바스크립트 부분만 바꾼 모습입니다. 이러면 IE와 FF 모두 잘 동작하는 모습을 볼 수 있습니다. 코드가 지저분해 보이니 리펙토링을 조금 해보면.

function load()

{

    getIFrameID("richEditor").designMode = "On";

}

function getIFrameID(aID)

{

    if (document.getElementById(aID).contentDocument)

    {

        return document.getElementById(aID).contentDocument;

    }

    else

    {

        return document.frames[aID].document;

    }

}

이렇게 해서 조금은 깔끔한 코드가 완성되었습니다.....만, 오히려 더 지저분해진 느낌입니다. 그냥 재사용성을 위함 이라고 해두죠. ^^;;;

이제 글씨들의 스타일을 변경할 수 있는 버튼들을 만들어 넣을 차례입니다.

Html:

<input type="button" value="굵게" onClick="doCommand('bold');"/>

선택된 곳을 굵게 표시할 수 있는 버튼을 만들었습니다. onClick 이벤트로 클릭하면 doCommand 가 실행됩니다.

Javascipt:

function doCommand(command, args)

{

    getIFrameID('richEditor').execCommand(command,false,args);

    document.getElementById('richEditor').contentWindow.focus()

}

doCommand 메소드 입니다. 좀 전에 리펙토링 하면서 만들었던 getIFrameID 메소드와 execCommand 메소드를 사용합니다.

execCommand메소드는 두개의 인자를 갖습니다. 다음 페이지를 참고 하세요.

doCommand(command, args)의 인자 값 중 처음 command는 굵게 만들지, 이텔릭체로 만들지, 언더라인을 그을지 등을 결정합니다. 두번째 args는 첫번째 인자에 따라서 결정되는데, 굵게 만들기와 같은 작업엔 사용하지 않고, 폰트종류나 크기를 결정할 때 입력합니다.

Html :

<input type="button" value="궁서" onClick="doCommand('fontname','궁서');"/>

위 코드를 추가하고 테스트를 해보면, 어떤 의미인지 잘 알 수 있을 것 입니다.

완성된 코드 입니다.

<html>

<head>

    <title>simple rich editor</title>

    <script langauge="javascript">

    function load()

    {

        getIFrameID("richEditor").designMode = "On";

    }

    function getIFrameID(aID)

    {

        if (document.getElementById(aID).contentDocument)

        {

            return document.getElementById(aID).contentDocument;

        }

        else

        {

            return document.frames[aID].document;

        }

    }

    function doCommand(command, args)

    {

        getIFrameID('richEditor').execCommand(command,false,args);

        document.getElementById('richEditor').contentWindow.focus()

    }

    </script>

</head>

<body onload="load();">

    <p>

        <input type="button" value="굵게" onClick="doCommand('bold');"/>

        <input type="button" value="궁서" onClick="doCommand('fontname','궁서');"/>

    </p>

    <iframe id="richEditor"></iframe>

</body>

</html>

다음에는 위 코드에, 기능을 좀 더 추가하고, 페이지의 값을 넘겨 스크립트언어에서 받는 방법을 소개해보도록 하겠습니다.

Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://echo7995.tistory.com/ BlogIcon echo 2007.12.09 23:39 신고  댓글주소  수정/삭제  댓글쓰기

    난 아무짓도 안했어요 ㅠ

  2. Favicon of http://breathe77777.tistory.com BlogIcon 브리드 2007.12.10 19:39 신고  댓글주소  수정/삭제  댓글쓰기

    밥아저씨가 적절하게 들어가있네요^^;

혹시 여러분들 중에 내 블로그에 누가 접속해 있을지, 또 누가 다녀 갔을지 궁금하신 분들 계십니까?

리퍼러 기록만으로는 만족하지 못하겠고, 방문객 카운트는 올라가는데, 누군지는 궁금하고. 궁여지책으로 http://whos.amung.us/ 에서 달아놓은 위젯에 몇 명 접속해있는지 숫자는 뜨는데, 과연 누구일지, 궁금하지 않으셨습니까?

이런 모든 궁금증을 해결해 줄 위젯이 있습니다.

Miwing 에서 내놓은 redwing이 바로 그 해결사 위젯 입니다. 물론 설치형 블로그나 티스토리에만 쓸 수 있지만, 정말 매력적인 위젯이 아닐 수 없습니다. 접속하고 있는 사람과 채팅도 즐길 수 있고, 놀라운 것은 현재 접속자가 읽고 있는 글도 알 수 있다는 것 입니다.

어때요. 한번 써보시고 싶은 마음이 들지 않습니까? 아래 링크로 가보세요.

곧 레드윙에 대한 수익분배 시스템도 개발되어 공개될 예정이라고 하니, 하나 달아두시면 내년쯤엔 수익금을 받을 수 있지 않을까 생각해봅니다.

Miwing 에서 빨간날개 이후로 윙박스 라는 이름을 가진 두번째 서비스를 내놓았습니다. 마이윙 , 레드윙처럼 이름이 윙이 끝으로 끝났다면 라임도 맞고 좋았을 텐데, 윙박스라니 조금 아쉬운 이름이긴 합니다. 윙박스가 궁금해서 여러분들도 잘 아시는 포털 검색사이트에서 검색을 해보았습니다.

사용자 삽입 이미지

실제로 검색사이트에서 검색을 해보고, 제일 처음 나오는 바로가기 사이트를 클릭하면 다음과 같은 화면이 우리를 반깁니다.

사용자 삽입 이미지

제가 말하고자 하는 사이트는 저 웹하드 사이트가 아니오니, 윙박스를 이용 하시고자 하는 분들은 이리로 접속하세요.

http://www.miwing.com/

일단 접속하게 되면, 군더더기 없는, 조금은 횡해 보이는 깔끔한 사이트가 등장합니다. 그냥 일단 만들고 보는 겁니다.

이미지에도 표시된 [내 윙박스 만들기] 를 클릭합니다.

사용자 삽입 이미지


잠깐만요. 혹시 오픈아이디를 가지고 계십니까


클릭하게 되면 보통의 회원가입창을 볼 수 있습니다.

사용자 삽입 이미지

어디서나 쉽게 볼 수 있는 회원가입 창입니다. 기본 정보와 선택정보를 입력할 수 있습니다.

한가지 유의할 점은 여기 사진 입력부분입니다. 이곳에 입력한 사진이 윙박스에 바로 적용되지는 않습니다. 이곳에 사진을 입력하고 저장한 후에, 만들어진 윙박스에 또 사진을 입력해야 하는데, 조금 헛갈리긴 하지만 생각해보면 사용자의 선택권에 있어서 좀 더 높은 자유도를 주는 시스템입니다. 다만 조금 헛갈리다는 것이 문제이겠지요. 굳이 비교 하자면, 여기 입력하는 사진은 싸이월드의 미니미로 생각하시면 되겠습니다. 이 사진으로 활동을 하시는 것이지요. 그리고 조금 뒤에 나오겠지만 윙박스의 사진 입력은 싸이월드의 메인 사진으로 생각하시면 이해가 되실거라 생각합니다.

다음 이미지를 보면서 좀 더 이야기 해보겠습니다.

사용자 삽입 이미지

각 메뉴 설명
  1. 프로필
  2. 미니메일
  3. 토크박스
  4. 줄글
  5. 레드윙


1. 프로필

1번창에 입력된 이미지와 6번에 나타나는 이미지가 아까 말씀드린 그 서로다른 이미지 입니다. 회원가입 시 입력한 이미지는 대외활동을 할 때 나타납니다. 6번의 모습으로 말입니다. 그리고 1번에 나타난 이미지는 그냥 자신의 윙박스의 대표 이미지라고 생각하시면 되겠습니다.

1번창에 사진을 입력하는 방법은 빨간색 버튼인 [[프로필 수정]] 을 통해 변경 하실 수 있습니다.

사용자 삽입 이미지

프로필 수정을 누르면 심플한 창이 나타납니다. 이미지는 자동으로 리사이징 해줍니다만, 가로사이즈170pixel로 맞춰 주신다면, 훨씬 좋은 퀄리티의 이미지를 공개하실 수 있을 것 같습니다.


2. 미니메일

2번은 간단히 말해서 쪽지의 기능입니다. 누군가 나에게 쪽지를 남기고 싶거나, 내가 누군가에게 무엇인가 비밀스럽게 할말이 있다고 생각되시면 바로 타이핑 하셔서 전송 버튼을 누르시면 됩니다. 이건 제 윙박스 이기 때문에 보내기 창이 나타나지 않습니다만, 다른분의 윙박스를 방문하게 되면, 다음과 같은 화면을 보실 수 있고, 이곳에서 바로 메시지 전송을 할 수도 있습니다.


사용자 삽입 이미지


버그일까요?



3. 토크박스

3번은 아무래도 가장 핵심적인 기능이 아닐까 생각합니다. 간단히 말해서 채팅방 입니다. 많은 회사에서 요즘 외부 메신저를 통제하고 있습니다. 심지어는 대화내용까지 감시하고 있는 곳도 있습니다. 회사에서 나른한 오후, 친구와 잠깐 수다를 떨고 싶어도, 할 수가 없는 이 현실이 안타깝지 않으셨나요? 이제 익스플로러 창 하나만 띄워두시면 가능합니다.

시작표시줄의 깜빡이는 네이트온/MSN창을 덮기 위해 괜히 시작표시줄을 숨길 필요도 없습니다. 이제 친구에게 문자로 url 하나만 던져주면 됩니다.

사용자 삽입 이미지
굳이 윙박스에 가입하지 않아도 "손님" 으로 접속할 수 있으니 활용도가 높다고 할 수 있겠습니다.

비밀스러운 대화를 나누고 싶다면 비공개로 비밀번호를 설정해 둘 수 도 있습니다. 한번 사용해보시지 않으시겠습니까?

요즘 세이클럽이 방만드는 것에 대한 유료화를 진행했다는 소식(http://i-guacu.com/1904)을 들었습니다. 일전에 하늘사랑(skylove) 라는 사이트가 유료화를 진행했다가 얼마 지나지 않아 곧 무료화 했던 사례가 생각납니다. 퇴행하는 (느린)세이클럽과 같은 사이트 대신 이런 Agile한 서비스는 어떨까요?


4. 줄글

한마디로 방명록 & 낙서장 입니다. 한 줄을 남기면 아무나 댓글을 달 수 있습니다. 미투데이(http://me2day.net)가 생각납니다. 사용자가 좀 더 많아진다면, 오히려 토크박스의 사용성을 앞지를지도 모를 기능입니다. 한줄의 피드백이 미투데이를 사용해보면 얼마나 큰지 아실 수 있습니다.


5. 레드윙

아까도 말씀드린 레드윙 입니다. 윙박스 전체에 현재 몇 명의 사용자가 접속해 있고, 또 누가 접속해 있는지 알 수 있습니다. 물론 대화도 가능합니다. 친구가 없다고 생각하시나요? 바로 이곳에 있는 분들에게 말 걸어보세요.

윙박스 도움말(http://www.miwing.com/room/help.php) 페이지에 가 보시면 좀 더 자세한 설명과, 앞으로의 방향 등을 아실 수 있습니다. 한번쯤 방문해보시고, 새로운 아이디어의 웹서비스를 사용 해보시는 건 어떠실지요?


0. 끝으로

좀 더 커뮤니티가 형성되고, 사람들이 많이 모이면 정말 재미난 서비스가 될 것 같습니다. 역시 아무래도 키워드는 "사람" 인 걸까요?


덧.

현재 miwing에서 이벤트 진행중 입니다.

다음 링크에 가보시면 자세한 내용을 확인하실 수 있습니다.


Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://pnpcrow.pamily.kr BlogIcon 까마귀 2007.12.06 17:38 신고  댓글주소  수정/삭제  댓글쓰기

    저는 파이어폭스 2.0.0.11 버전을 사용하고 있지만 정상적으로 표현됩니다. 그리고 red-app.miwing.com 페이지를 열고 있다고 나오는 부분은 레드윙의 데이터 리플레쉬로 연결이 있다는 표시구요. 저 주소는 레드윙의 데이터 서버입니다. 페이지가 안열린게 아닙니다. Fasterfox 등을 설치해서 페이지가 얼마만에 열리는지 직접 확인해 보시면 확인 가능할 거라고 생각 됩니다(페이지 열리는데 걸린 시간을 표시해주는 기능이 있습니다). 파이어폭스 자체가 모든 전송되는 내용을 표시해주다 보니 IE만 생각해서 페이지가 제대로 안열린다 생각하는 경우가 많더군요.

    • Favicon of http://onionmen.kr BlogIcon 세형 2007.12.06 18:22 신고  댓글주소  수정/삭제

      까마귀님. 댓글 감사합니다.
      제 글 표현에 조금 문제가 있었나 봅니다.
      저도 red-app.miwing.com 으로 페이지를 열고 있다는 메시지가 무슨 메시지인지 정도는 알고 있습니다.
      데이터를 못받아 왔다는 표현이 좀 더 정확하겠군요. 다른 작업을 하면서 서버의 응답을 30분간 기다려보았습니다. 재부팅도 해보고, 브라우져 재실행도 해보았습니다. 그래도 IE에서는 바로 나타나는 화면이 FF에서는 나타나지 않았기에(아니 데이터를 받아오지 못했기에) 적어놓은 것 입니다. 까마귀님께서는 제대로 나타나셨다고 하니 아마도 제 시스템의 문제인가 봅니다.

  2. Favicon of http://pnpcrow.pamily.kr BlogIcon 까마귀 2007.12.06 19:03 신고  댓글주소  수정/삭제  댓글쓰기

    파이어폭스에 세션을 저장해주는 플러그인이 설치되어 있지는 않은가 생각 됩니다. 세션이 저장되다보면 세션이 만료되서 업데이트 되는 시점이 아닌 이상은 저장된 페이지가 나오고 갱신이 안될 수 있는데 그 문제일 것 같습니다.
    그리고 red-app.miwing.com은 레드윙만 사용하는 것이기 때문에 페이지 접속시도를 하는게 아니라 레드윙(윙박스에서는 윙박스라운지로 쓰는 레드윙)이 현재 방문자 목록을 갱신받고 있다는 의미입니다. 5초간격으로 리플레쉬 됩니다.

    • Favicon of http://onionmen.kr BlogIcon onionmen 2007.12.07 01:12 신고  댓글주소  수정/삭제

      까마귀님 좋은 댓글 감사합니다.
      세션 저장하는 플러그인은 설치되어 있지 않습니다.
      까마귀님 의견 참고하도록 하겠습니다.

  3. 2007.12.07 02:04  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

2007.11.17 00:27 Review/IT

Daum 캘린더

컴퓨터 옆에 있는 달력에 유성펜으로 일정을 기입해 놓는다. 물론 아웃룩이나 구글캐린더, 라이프팟과 같은 서비스를 모르는 것은 아니다.

내가 아웃룩이나 웹서비스를 사용하지 않는 이유는 단지 달력에 쓰는 것 보다 불편하기 때문이다. 잠깐 써보니 달력보다 편한 것을 느끼지 못하겠더라.
혹자는 말한다. "일단 익숙해져봐. 써보면 진짜 편하다니까." 하지만 익숙해지지 못하는게 내 탓만은 아니지 않는가.

오늘 다음캘린더가 오픈했다고 하여 잠깐 사용해보았다. 잠깐 Lifepod 을 사용해본 적이 있었는데, 아무래도 이건 내 서비스가 아닌듯 하여 사용을 중지했다. 그런데 다음켈린더는 라이프팟보다 조금 더 불편했다.

불편한 점 몇가지를 보자면.

알림설정의 불편
알람을 설정하려면 매번 일정 입력 때마다 일정자세히 입력을 눌러서 설정해줘야 한다.
차라리 환경설정에 일괄적으로 알림받기/해제를 설정할 수 있으면 더 편하지 않을까.
그리고 물론 생각하고 있겠지만, 핸드폰 알림도 가능했으면 좋겠다.

인터페이스의 불편
달력띄우면 버튼들은 조막만해서 하나 잘못 클릭하면 창이 사라져버리고, 여간 불편한 것이 아니다. 모니터가 800 x 600 사용자를 배려한 것인지는 모르겠지만, 입력창이 너무 소심하게 작다. 일정입력하는데 다른 일 할 것도 아니니 큼직큼직하게 입력하기 편하게 만들어졌으면 좋겠다.
"일정 자세히 입력" 을 누르면 입력은 가능하지만 불편은 여전하다. 게다가 페이지 전환까지 되버린다. 물론 페이지간 전환은 굉장히 빠르지만, 뒷배경은 놔두고 modal창이 좀 더 커지는 식으로 전환되었으면 답답한 느낌이 조금은 덜 들것 같다.

시작시간을 설정 한 후, 종료시간을 설정하는 박스 옆에 1시간, 3시간, 5시간, 다음날. 과 같은 버튼이 있었으면 좋겠다. 하루종일 탭을 체크하면 그날 하루가 전체로 입력되는데, 이것 말고 추가로 1시간 3시간 등과 같은 아이템 박스같은 것을 제공해 주면 좋겠다.
이 아이템박스에 넣는 것은 다섯개 정도로 제한 하고, 그 안에 시간은 사용자가 수정 할 수 있도록 만들면 일정 입력하는 것이 더욱 편리할 듯.

날짜시간입력의 불편
왜 날짜를 클릭하면 꼭 12시간이 설정되는건지. 밤에 설정하면 다음날로 넘어가버리니 여간 불편한 것이 아니다.

잠깐 사용해 보면서 이런 불편한점들을 느꼈다. 이런점들이 고쳐지지 않는다면 아마도 적어도 나에겐 또 멀어지는 서비스가 되지 않을까 싶다.
물론 이런 서비스들을 몇시간 사용해보고 평가, 판단 해버린다는 것은 제작자에게 너무 가혹한 행위라 생각한다.

나랑 사귀어보면 내가 정말 좋은 사람이라는 것을 알게 될텐데, 라고 한탄하다가, 내 매력을 모르는 니가 나쁜거야 라며 상대방에게 잘못을 떠 넘기는 경우가 종종 있다.

현실은 사귀지 않으면 모른다 = 아무도 좋은점을 알리가 없다 = 사귈수 있을리가 없다.

어떤 서비스도 마찬가지다. 아무리 좋은 기능들이 많이 있다고 해도, 사용하도록 만드는데 문제가 있다면 좋은 기능이 하나도 없는 것과 마찬가지이다.

한가지 인상깊었던 점은 반응속도이다. Daum 캘린더의 반응속도는 정말 최고다. 한메일익스프레스의 속도를 보고, 빠르다. 라고 생각했었는데, 이 다음캘린더도 그정도의 속도를 보여준다. 상당히 인상적이었다.

내가 못보고 지나간 것인지 아니면 새로 생긴 것인지, 이틀사이에 좀 많은 것이 바뀌었는데 계속해서 발전해 나가는 모습이 보기 좋다.
꾸준히 써나가다보면 곳곳에 숨은 기능들을 발견할 수 있을 것 같다.
Posted by onionmen

댓글을 달아 주세요

  1. Favicon of http://daummail.tistory.com/82 BlogIcon 다음캘린더 2007.11.18 22:28 신고  댓글주소  수정/삭제  댓글쓰기

    우선 좋은 리뷰에 먼저 감사드립니다.

    그냥 몇가지 말씀드리고 갈게요^^
    1. 전체 알람설정이 왜 없냐고 하신 부분에 대해서는 말씀하신것처럼
    환경설정에 있어요^^ 그런데 각 카테고리 별로 이 설정이 가능해야 하니까
    환경설정 페이지에 바로 보이는게 아니고, 환경설정-카테고리 수정을 누르면
    보인답니다^^; 더 쉽게 찾을 수 있는 방법을 고민해보겠습니다.
    아무리 좋은 기능도 유저가 찾지 못한다면 무용지물 아니겠습니까?
    또한, 핸드폰 알림도 빠르게 붙을 수 있게 할게요.

    2. 입력창 등 화면이나 버튼이 작다는 지적에 대해...
    이는 기본적으로 1024 사용자를 배려할 수 밖에 없어서 다소 작긴하죠?
    버튼 등을 키워서 시원시원하게 보일 수 있게 할 수 없을지 연구하겠습니다.

    3. 의견 주신것 처럼 시작시간 설정하고,
    1시간,3시간 등을 빠르게 설정할 수 있게 개편하겠습니다.
    조금만 기다려 주세요~

    3. 날짜를 클릭하면 꼭 12시간이 되는것은 아니고요. 12시에 클릭하면 12시로 되고
    현재시간이 5시라면 5시가 되고... 그런시스템이랍니다^^;
    혹시 그게 아니라 정말 항상 12시로 표시가 된다면 버그였던것 같은데...
    다시한번 점검해보고 수정하도록 하겠습니다.

    날카로운 지적 감사드리고,
    베타서비스인만큼 이렇게 의견을 청취하고 계속 발전하는 캘린더가 되겠습니다.
    그래야, 양파맨님 같이 PC로 일정관리를 하는것이 귀찮다던 분들도
    사용할 수 있는거겠죠? 앞으로도 많은 조언 부탁드리겠습니다.

    • Favicon of http://onionmen.kr BlogIcon onionmen 2007.11.20 16:01 신고  댓글주소  수정/삭제

      아 전체 알림설정은 환경설정에 있었군요 역시.
      면밀히 살펴보지 못한 제 불찰이네요.

      그런데 그 12시간 표시되는 문제(문제는 아니지만)는 제가 전달을 좀 제대로 못한 듯 싶은데, 현시간을 기준으로 +12시간이 되어버리더군요. 오늘 23시에 일정을 만들면 다음날 11시까지로 기본 설정되어 있어요.

      오전 11시에 일정을 만들면 그날 저녁 11시까지로 일정이 잡혀버리구요. 이거 일일이 수정하는게 불편하다는 말이었습니다.

      앞으로도 좋은 서비스로 계속해서 발전해나가세요. 보기좋습니다. ^^

  2. Favicon of http://www.musecine.com/tt BlogIcon 댕글댕글파파 2007.11.19 11:07 신고  댓글주소  수정/삭제  댓글쓰기

    저는 웹 캘린더는 별로 쓸 일이 없더군요..-_-;;
    라이프팟이나 구글 캘린더를 조금 사용하다가 그냥 패스 ~_~
    PDA나 하나 있으면 그걸로 사용하는게 제일인듯합니다. :)

    • Favicon of http://onionmen.kr BlogIcon onionmen 2007.11.20 16:02 신고  댓글주소  수정/삭제

      PDA나 스케쥴러가 제일 편한듯 해요. 그래도 요즘 웹캘린더가 대세이다보니 한번쯤 사용에 익숙해지는것도 나쁘진 않을 것 같아요. 저도 한번 써보려구요. ㅎㅎ

위젯(widget) 이라는 말이 이제는 심심치 않게 들려온다. 예전 한참 유행하던 외계소년 위제트의 그 위젯을 이야기 하는 것이 아니다. 네이버나 야후등을 이용하면서 네이버위젯, 야후위젯 이라는 용어를 한번쯤은 들어봤을 거라 생각한다. 보통은 데스크탑의 바탕화면에서 응용프로그램을 실행하지 않고도 쉽게 무엇인가를 할 수 있는 것을 위젯이라 했는데, 이제는 웹이 보편화되고, 웹개발 기술이 발전하면서 위젯도 웹으로 옮겨가게 되었다. 대표적으로 위자드닷컴의 개인화페이지와 구글의 Igoogle을 예로 들 수 있다. 웹페이지에 접속하면, 굳이 다른 프로그램이나 다른 사이트에 들어가지 않아도, 메모를 작성하거나, 간단한 계산을 하거나, 쉽게 날씨를 알아볼 수 있다.

RSS를 받아보는 블로거팁 닷컴에서 소개한 하나포스 엔유위젯 달기 이벤트를 보고 바로 위젯을 설치해봤다.

아래 링크에서 확인 가능하다

http://andu.hanafos.com/event/anduevent_widget/default.asp

사용자 삽입 이미지

선착순으로 USB 허브를 주고, 추첨을 통해 2GB 메모리스틱을 또 준다. 11월 22일까지 현재시각을 기준으로 13일 남았으니 이 글을 보고 있는 여러분들도 한번 도전해보길 바란다.

사용자 삽입 이미지

현재 엔유를 설치해 놓은 onionmen.kr 블로그의 하단 모습이다. 다행이도 하얀색 스킨을 지원하여 이 블로그에 그나마 잘 어울리는 모습으로 만들었다.


사용자 삽입 이미지사용자 삽입 이미지


위와 같이 가로세로 각각 4종류의 색상스킨을 지원한다. 사이드바에 달 수 있는 세로형 스킨도 지원한다.

세로형을 설치할 경우 자칫 블로그가 너무 길어질 수도 있으므로 잘 선택하도록 하자.

사용자 삽입 이미지
삽입 코드를 생성하기 전에 네가지 탭중 하나를 선택할 수 있는데, 꼬릿말 묶음의 경우 연관동영상을 모아 제공해준다. 그냥 간편하게 인기동영상 묶음으로 선택하여 코드를 발급받는 것이 편할 것이다.

별도의 ActiveX를 설치하지 않아도 무리없이 재생되고, 파이어폭스에서도 제대로 작동되므로 호환성 문제 때문에 걱정할 필요도 없겠다.

사용자 삽입 이미지

동영상을 클릭하면 별도의 창이 열리거나, 페이지 이동을 하는 것이 아니라, 현재창에서 바로 재생이 가능하다. 플레이가 끝나면 오른쪽 상단의 close 탭을 눌러주면 바로 사라진다.

아쉬운 점은 애드센스나 올블릿과 같이 포스트 내용과 관련있는 동영상을 자동으로 검색하여 보여주는 기능이 없다는 것이다. 현재 블로그 포스트에 포함된 태그를 바탕으로 동영상을 검색해 준다면, 좀 더 널리 퍼질 수 있을 듯 하다. 또 블로그의 로딩시간이 길어지는 단점이 있다. 요즘 유행하는 유니클로를 비롯해 많은 위젯을 설치해놓은 사용자는 조금 부담스러운 것이 사실이다. Onionmen.kr 블로그에도 엔유를 포함해서 세개정도의 위젯을 설치해놓고 에드센스까지 달아놓아서 로딩시간이 꽤 긴편이다. 아무래도 이미지를 얻어와야 하니 느린 것이겠지만, 시간이 1초만 더 단축되었으면 하는 바람이다.

Posted by onionmen

댓글을 달아 주세요

컨셉이 확실한 카페나 상점을 예로 드는 것이 빠를 지 모르겠습니다. 예전 의류매장에서 아르바이트를 해본 경험이 있습니다. 그 곳 에서는 언제나 사장님이 음악을 선곡 하셨습니다.

제가 봤을 때 사장님의 선곡에는 두 가지 정도의 문제점이 있었습니다.

첫 번째 20대를 타깃으로 한 유명 브랜드 매장이었음에도 불구하고 음악은 20대도 안 듣고, 30대도 안 듣는 철 지난 유행가 라는 것.
두 번째 이 철 지난 유행가들이 12곡 담긴 CD 3장으로 매장의 음악을 유지하고 계셨던 것.

하루 12시간 가량 이런 노래들만 듣고 있자니 뇌가 마비되고, 과거에 같힌 사람이 될 것만 같아 직접 선곡을 해오겠다고 사장님께 말씀 드리는 실수를 범하고 말았습니다.

점심시간에 무엇을 먹을지 고민하는 것만큼 힘든 것이, 음악 선곡이라고 생각합니다. 어울리는 장르의 노래들을 선별해야 하고, 사장님의 취향도 어느 정도 고려해야 했기 때문에, 정말 쉬운 일이 아니었습니다. 한동안 매장에서는 철 지난 유행가 보다는 조금 최신의 곡들이 들려왔습니다만, 몇 개월 지나면 이 것도 마찬가지로 옛 것이 되어 매장에서 흘러나오겠지요.

다른 이의 미니홈피로 이동 할 때마다 음악이 바뀌는 싸이월드. 조용한 밤에 누군가의 미니홈피에 슬쩍 들어갔다가 갑작스럽게 들려오는 쿵쿵거리는 음악소리에 놀라본 적 한번쯤은 있을 것 이라 생각합니다. 음악이 나오기 전 바로 ESC버튼을 누르면 플레이는 중지 되지만, 꽤 귀찮은 일 입니다.

전 그럴 때 가끔 이런 생각을 했습니다.

첫 번째 "음악 좀 안나오게 할 수 없나."
두 번째 "안 나오게 할 수 없다면 차라리 내가 원하는 노래만 플레이 되게 할 수 없나."

첫 번째야 음악 플러그인을 제거 하거나 IE가 아닌 웹브라우저를 사용하는 것만으로 쉽게 해결 가능하지만, 두 번째 방법은 싸이월드 내에선 거의 불가능 합니다.

얼마 전 웹 서핑을 하면서 재미있는 사이트를 발견 하였습니다.

http://musicovery.com/

Random 음원 스트리밍 서비스

그냥 한번 보면 "이게 뭐야." 라고 하실지 모르겠지만, 약 3분만 투자해서 살펴보시면 즐겨찾기에 추가하실 것이라 생각합니다.

그림 1 처음 접속 후 화면

맨 처음 접속 하면 위와 같은 리모컨 같은 화면을 볼 수 있습니다. (플래시 기반이기 때문에 플래시 플러그인을 설치 하셔야 합니다.)메뉴를 하나하나 자세히 살펴보겠습니다.

  1. 로고와 국가선택입니다. 영국, 프랑스, 포르투갈 그리고 스페인의 4개국 선택이 가능합니다. 물론 나라를 선택 한다고 그 나라의 곡만 연주된다거나 하는 것은 아니고, 단지 언어만 변경 될 뿐입니다. 수 개월 전만 해도 영국과 프랑스 두개의 국기만 제공 되었었는데, 지금 현재 포르투갈과 스페인이 추가 된 것을 보면 앞으로 더 많은 다국어 지원을 기대해 볼 만 합니다.
  2. 노래의 대중성을 선택하는 부분입니다. 매우 대중적인 곡, 조금 대중적인 곡 그리고 많이 대중적이지 못한 곡으로 분류합니다.
  3. 노래의 출시연도를 설정 할 수 있습니다. 슬라이드를 움직여 기간별 설정이 가능합니다.
  4. 자신이 듣고 싶은 분위기의 범위를 클릭하면 그 정도의 노래가 흘러 나옵니다. 현재 내 상태가 매우 우울하여 발랄한 노래를 듣고 싶다면, 1사분면 쪽으로 마우스를 클릭해보세요. 발랄한 팝송이 기분을 업 시켜드릴 것 입니다. 이 부분은 보시는 바와 같이 "Mood, Dance, Me" 세가지 탭으로 구성되어 있습니다. 이 부분에 대해서는 뒤에 다시 이야기 하도록 해 보겠습니다.
  5. 별도의 설명이 필요 없을 듯 한 부분입니다. 음악의 장르를 선택하여 플레이 되도록 할 수 있습니다.

Mood 부분에 자신이 선호하는 위치에 마우스를 클릭하면 위 그림과 같은 화면이 나타납니다. 파이프와 같은 라인을 따라서 음악이 재생되고, 각각의 색은 장르를 나타냅니다. 음악을 듣다보면 친숙한 노래도 들리고, 전혀 처음 듣는 노래도 들립니다.

지금 현재 Damien rice 의 The Blower's Daughter 라는 곡이 재생 되고 있습니다. 영화 클로져의 삽입곡으로 쓰였던 곡이기도 합니다. 개인적으로 좋아하는 곡인데, 마침 딱 재생이 되어 아주 잠시나마 기쁨을 느꼈습니다.

우선 기본적으로 컬러를 통해 장르를 구분해 주고, 앨범 커버아트, 음악가 그리고 곡 제목을 제공해줍니다.

또한 아마존과 eBay에서 앨범 구매가 가능하고, iTunes 를 통한 다운로드도 지원 하고 있습니다. 듣고, 구입하고 싶은 마음이 들면 힘들여 따로 검색하지 말고 클릭 한번으로 해결 하라는 편리함이 있습니다.

마지막으로 볼륨조절, 일시정지, 다음곡, ban, favorite 메뉴를 제공합니다. 다음 곡을 누르면 음악은 파이프에서 사라지고, 다음 라인으로 넘어가 재생이 됩니다. 두개의 하트는 로그인 사용자에게만 지원되는 메뉴입니다. Musicovery.com은 굳이 가입하지 않더라도 음원을 즐길 수 있습니다만, 회원가입을 한다면 좀 더 다양한 기능들을 사용할 수 있습니다.

깨진 하트의 경우 Ban songs 로 다신 듣고싶지 않은 음악으로 등록하여 관리 할 수 있고, 붉은 하트는 favorite songs로 선호하는 음악 리스트에 넣어 관리할 수 있습니다. 이렇게 favorite songs 로 관리되는 음악은 Me 탭으로 들어가 개인적인 취향으로 플레이 할 수 있도록 되어 있습니다.

각각의 음악을 클릭하면 클릭한 음악 중심으로 파이프가 새로 형성이 됩니다. 어떠한 기준으로 파이프가 형성되는지는 쉽게 파악할 수 없을 것 같습니다. 음악을 클릭 할 때마다 순서는 뒤섞입니다.

위에서 제대로 설명하지 못하고 내려온 부분을 이야기 하고 이번 포스팅을 마칠까 합니다.

"Mood, Dance, Me" 세가지 탭으로 구성되어 있는 곳이 있습니다.

음악을 클릭하고 Mood 탭을 보면 이 음악이 어떤 분위기의 음악인지 보여줍니다. 그리고 바로 옆에 있는 Dance 탭을 클릭하면 어느 정도의 리듬에 속한 음악인지도 한눈에 보여주어 처음 듣는 곡이라 해도 대충 분위기의 파악이 가능합니다. 이 음악이 몇 년도 출시 곡인지 보여주는 것은 물론입니다.

Musicovery.com은 무료회원과 프리미엄 회원으로 구분하여 회원 가입을 받고 있습니다.

무료회원은 라디오음질 정도의 Lo-Fi 로 음악 감상이 가능합니다. 구글의 AdSense를 채용하고 있어서 무료 사용자에겐 광고도 보입니다.

무료회원에겐 Favorite songs의 직접적인 접근이 불가능합니다. 한마디로 직접 플레이 리스트를 작성한 후 듣는 것은 안 된다는 것 입니다.

그림 2 프리미엄 회원과 무료회원과의 차이

한달에 4us달러면 프리미엄 회원이 등록 가능한데, 무료사용자에 비해 혜택은 CD음질로의 향상 정도 입니다. 개인사용자라면 무료회원가입으로도 충분히 즐기실 수 있을 거라 생각합니다. 하지만 매장을 운영하고 계시거나 하신다면 프리미엄 회원의 가입도 한번 고려해볼 만 하겠습니다.

몇 년 전 이 사이트가 있었고, 또 알았다면, 그 옷가게 사장님에게 이 사이트를 추천해드렸을 텐데 말입니다.

즐거운 음악생활 즐기시길 바랍니다.

Posted by onionmen

댓글을 달아 주세요

  1. 뱡뱡 2007.10.13 21:40 신고  댓글주소  수정/삭제  댓글쓰기

    우앙ㅋ굳ㅋ 엔씨쿤 이런거 어떻게 이렇게 잘찾아요!
    미투에 글 좀 쓰라고 쓸랬더니 이미 썼네 ㅜㅜ
    암튼 난 여기부터 와서 본거라고요 ㅎㅎ

  2. Favicon of http://hjnina.tistory.com BlogIcon 완전한 기쁨 2007.10.25 01:17 신고  댓글주소  수정/삭제  댓글쓰기

    아. 저도 이 싸이트 알아요. ^ ^
    미투데이 친구 신청하셨길래, 답방 와봤어요. 감사. ^ ^

  3. 더 완전한 기쁨 2010.01.22 10:46 신고  댓글주소  수정/삭제  댓글쓰기

    뮤직커버리는 한국음악이 없어서 아쉬웠는데요..대한민국에도 비슷한 서비스가 생겼네요..뭐 느낌검색이라지만 느낌으로 찾고 음악 듣기 딱 좋네요..특허등록된 검색이랍니다..www.necube.com

이전버튼 1 2 3 4 5 이전버튼

블로그 이미지
손을 따뜻하게 만들어 주고 싶은 애인이 있습니다.
onionmen

달력

 « |  » 2018.11
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30  
DNS Powered by DNSEver.com

최근에 올라온 글

Yesterday98
Today20
Total1,666,131