Successfully reported this slideshow.
페이스북과트위터에서의소셜 시맨틱 웹<br />이명진<br />연세대학교 지능웹비즈니스연구실<br />1<br />
소개<br />이명진<br />공학박사<br />연세대학교 정보산업공학과 지능웹비즈니스연구실<br />집필 서적<br />“자바 개발자를 위한 XML 프로그래밍”<br />“소설같은XML과 XML Web Services...
소개<br />연세대학교 지능웹비즈니스연구실<br />담당 교수님: 김우주 교수님<br />연구분야<br />시맨틱 웹, web 2.0, 웹서비스, 인공지능, 지능형 에이전트 등의 기반 기술연구.<br />정보공학, 경...
목차<br />소셜 시맨틱 웹<br />페이스북의소셜 시맨틱 웹<br />트위터의소셜 시맨틱 웹<br />4<br />
소셜 시맨틱 웹<br />5<br />
소셜 웹<br />정의<br />웹을 통해서 어떻게 사람들이 서로간에 교재하고 소통하는지를 표현하는 웹 환경<br />소셜 웹에서 개인을 표현하는 특성<br />신분: who are you?<br />명성: what d...
대표적인 소셜 웹 사이트<br />페이스북<br />대표적인 소셜 네트워크 서비스<br />현재 5억명 이상이 이용<br />2010년 3월 주단위 방문자 수로 구글을 추월함<br />하루 10 테라바이트 정보가 생성<...
시맨틱 웹<br />정의<br />웹에 존재하는 정보의 의미를 기계가 이해할 수 있도록 만드는 기술적 웹 환경<br />“기계에 의해 직접적이나 간접적으로 처리되어질 수 있는 데이터의 웹” by Tim Berners-L...
시맨틱 웹의 스택<br />9<br />
링크드 데이터<br />정의<br />웹에서 URI를 통해 데이터를 공개, 공유 및 서로 연결하기 위한 방법<br />링크드 데이터의 디자인 이슈<br />사물을 식별하기 위해 URI를 사용할 것<br />HTTP UR...
데이터 공유를 위한 어휘들<br />FOAF<br />다른사람과의 관계를 기술하기 위한 어휘<br />SIOC<br />블로그나 포럼과 같이 웹 환경에서 작성된 글들의 구조를 표현하기 위한 의미적 방식으로 커뮤니티를 서...
소셜 시맨틱 웹<br />정의<br />사람들의 기여와 참여로 유용하고 더 나은 정보를 제공하는 것이 가능한 협업적 지식 시스템의 웹 환경<br />기술적 정의<br />시맨틱 웹, 소셜 소프트웨어, 웹 2.0의 기술과...
소셜 시맨틱 웹의 어휘 집합<br />13<br />
페이스북의소셜 시맨틱 웹<br />14<br />
소셜 그래프<br />정의<br />페이스북에 의해 제공되는 소셜 네트워크 서비스의 사용자들 사이에 존재하는 관계를 나타내는 네트워크<br />모든 개인적 관계를 나타내는 사회 관계적 도표<br />처음에는 페이스북에 ...
소셜 그래프의 변화<br />16<br />
오픈 그래프 프로토콜<br />정의<br />웹 페이지를 하나의 객체로 나타내어 소셜 그래프 내에 통합하기 위한 방법<br />개발 상의 단순함을 추구<br />표현 방법<br />웹 페이지에 메타데이터를 추가함으로써 ...
우리는 무엇을 해야 하는가?<br />웹 페이지에 메타데이터를 기술<br />이로써 그래프 내에서 객체로 취급될 수 있는 형태로 변화<br />Like 버튼의 삽입<br />그래프에 삽입될 수 있는 여지를 남김<br /...
RDFa<br />정의<br />XHTML 형태의 속성을 이용하의 웹 문서 내에 메타데이터를 삽입하기 위한 W3C 권고안<br />이는 XHTML 문서 내에 삽입된 RDF 트리플로 사용될 수 있음<br />RDFa의 속...
OGP의 메타데이터<br />기본 메타데이터<br />og:title – 객체의 제목, 예, "The Rock".<br />og:type – 객체의 타입을 지정, 예, "movie". <br />og:image – 그래...
기본 메타데이터의 예<br /><html xmlns:og="http://ogp.me/ns#"><br /><head><br /><title>The Rock (1996)</title><br /><meta property="...
위치 지정을 위한 메타데이터<br />좌표 기술을 위한 메타데이터<br />og:latitude- e.g., "37.416343".<br />og:longitude- e.g., "-122.153013".<br />주소를...
연락 정보를 위한 메타데이터<br />연락 정보 기술을 위한 메타데이터<br />og:email- e.g., "me@example.com".<br />og:phone_number- e.g., "+1-650-123-456...
객체 타입 지정을 위한 메타데이터<br />og:type속성<br />그래프 내에서 표현되어질 객체의 특정 타입을 지정<br /><meta property="og:type" content="product" /><br /...
소셜 플러그인<br />정의<br />HTML 웹 페이지에 코드를 삽입함으로써 페이스북의소셜 서비스를 이용할 수 있는 추가 프로그램<br />소셜 플러그인의 종류<br />Like Button<br />Activity ...
Like 버튼<br />기능<br />페이스북에서 친구들과 특정 문서를 공유하기 위한 기능을 제공<br />사용자가 특정 사이트의 Like 버튼을 클릭하면, 해당 사이트로의 링크를 포함하여 사이트의 정보가 사용자의 친구...
Like 버튼 만들기<br />27<br />
사용자의 광클<br />28<br />
시맨틱 웹에서 OGP의 의미<br />RDF 데이터 모델<br />OGP의 메타데이터는 “URI – OGP의 속성 – 값” 형태로 SPO의 구조를 사용<br />따라서 완전한 RDF의 모델로 취급될 수 있음<br />...
트위터의소셜 시맨틱 웹<br />30<br />
트위터의어노테이션<br />기능<br />트위터에 메시지를 작성할 때 메시지에 대한 구조화된 메타데이터를 첨부하는 것<br />특징<br />JSON이나 XML 형태로 표현되어짐<br />어떤 메타데이터를 작성할 것인가...
트위터어노테이션의 형태<br />타입<br />모든 어노테이션에는 하나 이상의 타입이 존재<br />타입은 하나 이상의 속성과 값의 쌍으로 구성<br />어노테이션 정보의 포함을 위해 한 메시지의 총 용량을 512 by...
어노테이션의 작성<br />33<br />JSON<br />Simple Format<br />
트위터어노테이션의 예<br />34<br />
트위터어노테이션 실습<br />URL<br />http://r.github.com/annotationsformatter/<br />35<br />
어노테이션을 위한 속성<br />공통 속성<br />title – 어노테이션의 제목<br />image – 표현될 그림을 지정<br />url– 어노테이션을 클릭했을 때 보여질 URL<br />어토테이션을 위한 타입<b...
어노테이션과 시맨틱 웹<br />어노테이션 타입  온톨로지의 클래스<br />37<br />
어노테이션과 시맨틱 웹<br />시맨틱 웹의 자원과 연결<br />38<br />
결론<br />페이스북의 오픈 그래프 프로토콜<br />하나의 웹 페이지를 하나의 소셜 객체로써 사용자들과의 그래프 형태로 제공하기 위한 방법<br />트위터의어노테이션<br />하나의 트위터 메시지를 소셜 객체로써 활...
저는요…<br />E-Mail<br />xml@yonsei.ac.kr<br />Blog<br />http://www.semantics.kr/<br />Twitter<br />http://www.twitter.com/My...
Upcoming SlideShare
Loading in …5
×

페이스북과 트위터에서의 소셜 시맨틱 웹

3,226 views

Published on

이 슬라이드는 페이스북의 오픈 그래프 프로토콜과 트위터의 어노테이션을 설명하며, 이러한 서비스들이 어떻게 소셜 시맨틱 웹과 결부될 수 있는지를 보여주고 있다.

Published in: Technology, News & Politics
  • Be the first to comment

페이스북과 트위터에서의 소셜 시맨틱 웹

  1. 1. 페이스북과트위터에서의소셜 시맨틱 웹<br />이명진<br />연세대학교 지능웹비즈니스연구실<br />1<br />
  2. 2. 소개<br />이명진<br />공학박사<br />연세대학교 정보산업공학과 지능웹비즈니스연구실<br />집필 서적<br />“자바 개발자를 위한 XML 프로그래밍”<br />“소설같은XML과 XML Web Services”<br />“소설같은JSP”<br />2<br />
  3. 3. 소개<br />연세대학교 지능웹비즈니스연구실<br />담당 교수님: 김우주 교수님<br />연구분야<br />시맨틱 웹, web 2.0, 웹서비스, 인공지능, 지능형 에이전트 등의 기반 기술연구.<br />정보공학, 경영과학, 데이터 마이닝, 의사결정 공학등의 최신 경영공학 연구.<br />e-비즈니스, 전자상거래, 위치기반시스템, 유비쿼터스 컴퓨팅, 지식경영 시스템연구.<br />비즈니스 인텔리전스, 그리고 전통적인 경영이슈 등의 응용 분야 연구.<br />http://iwec.yonsei.ac.kr/index.html<br />3<br />
  4. 4. 목차<br />소셜 시맨틱 웹<br />페이스북의소셜 시맨틱 웹<br />트위터의소셜 시맨틱 웹<br />4<br />
  5. 5. 소셜 시맨틱 웹<br />5<br />
  6. 6. 소셜 웹<br />정의<br />웹을 통해서 어떻게 사람들이 서로간에 교재하고 소통하는지를 표현하는 웹 환경<br />소셜 웹에서 개인을 표현하는 특성<br />신분: who are you?<br />명성: what do people think you stand for?<br />존재: where are you?<br />관계: who are you connected with? who do you trust?<br />소속: how do you organize your connections?<br />대화: what do you discuss with others?<br />공유: what content do you make available for others to interact with?<br />6<br />
  7. 7. 대표적인 소셜 웹 사이트<br />페이스북<br />대표적인 소셜 네트워크 서비스<br />현재 5억명 이상이 이용<br />2010년 3월 주단위 방문자 수로 구글을 추월함<br />하루 10 테라바이트 정보가 생성<br />트위터<br />소셜 네트워크에 초점을 맞춘 140 글자로 제한된 마이크로 블로그 서비스를 제공<br />하루 7테라바이트 정보가 생성<br />7<br />
  8. 8. 시맨틱 웹<br />정의<br />웹에 존재하는 정보의 의미를 기계가 이해할 수 있도록 만드는 기술적 웹 환경<br />“기계에 의해 직접적이나 간접적으로 처리되어질 수 있는 데이터의 웹” by Tim Berners-Lee<br />구성 기술<br />URI, XML, Namespace<br />RDF, RDFS, OWL<br />Rule and SPARQL<br />Proof, Trust, Cryptography<br />8<br />
  9. 9. 시맨틱 웹의 스택<br />9<br />
  10. 10. 링크드 데이터<br />정의<br />웹에서 URI를 통해 데이터를 공개, 공유 및 서로 연결하기 위한 방법<br />링크드 데이터의 디자인 이슈<br />사물을 식별하기 위해 URI를 사용할 것<br />HTTP URI를 사용함으로써 이러한 사물이 사람이나 기계에 의해 발견되고 참조되어 질 수 있도록 할 것<br />RDF/XML과 같은 표준화된 형식을 사용하여 개체에 대한 정보를 제공할 것<br />다른 것들과의 연결을 포함할 것<br />10<br />
  11. 11. 데이터 공유를 위한 어휘들<br />FOAF<br />다른사람과의 관계를 기술하기 위한 어휘<br />SIOC<br />블로그나 포럼과 같이 웹 환경에서 작성된 글들의 구조를 표현하기 위한 의미적 방식으로 커뮤니티를 서로 연결하기 위한 어휘<br />SKOS<br />구조화된 어휘를 표현하기 위해 만들어진 형식적 언어<br />RDFa<br />웹 문서에 풍부한 메타데이터를 기술하기 위한 형식<br />Microformat<br />HTML과 XHTML을 사용해서 기존의 컨텐츠를 재사용하기 위한 어휘<br />11<br />
  12. 12. 소셜 시맨틱 웹<br />정의<br />사람들의 기여와 참여로 유용하고 더 나은 정보를 제공하는 것이 가능한 협업적 지식 시스템의 웹 환경<br />기술적 정의<br />시맨틱 웹, 소셜 소프트웨어, 웹 2.0의 기술과 전략, 그리고 방법론의 조합으로 만들어지는 웹<br />12<br />
  13. 13. 소셜 시맨틱 웹의 어휘 집합<br />13<br />
  14. 14. 페이스북의소셜 시맨틱 웹<br />14<br />
  15. 15. 소셜 그래프<br />정의<br />페이스북에 의해 제공되는 소셜 네트워크 서비스의 사용자들 사이에 존재하는 관계를 나타내는 네트워크<br />모든 개인적 관계를 나타내는 사회 관계적 도표<br />처음에는 페이스북에 국한되었으나 현재 인터넷에 존재하는 모든 사용자들에 대한 개념으로 확대됨<br />15<br />
  16. 16. 소셜 그래프의 변화<br />16<br />
  17. 17. 오픈 그래프 프로토콜<br />정의<br />웹 페이지를 하나의 객체로 나타내어 소셜 그래프 내에 통합하기 위한 방법<br />개발 상의 단순함을 추구<br />표현 방법<br />웹 페이지에 메타데이터를 추가함으로써 웹 페이지를 그래프 객체로 만듦<br />RDFa의 단순한 형태<br />17<br />
  18. 18. 우리는 무엇을 해야 하는가?<br />웹 페이지에 메타데이터를 기술<br />이로써 그래프 내에서 객체로 취급될 수 있는 형태로 변화<br />Like 버튼의 삽입<br />그래프에 삽입될 수 있는 여지를 남김<br />사용자의 광클<br />해당 사용자의 소셜 그래프에 구성 객체로 연결<br />18<br />
  19. 19. RDFa<br />정의<br />XHTML 형태의 속성을 이용하의 웹 문서 내에 메타데이터를 삽입하기 위한 W3C 권고안<br />이는 XHTML 문서 내에 삽입된 RDF 트리플로 사용될 수 있음<br />RDFa의 속성들<br />about과src – 메타데이터가 나타내는 것에 대한 URI<br />rel과rev – 다른 자원과의 관계를 기술<br />href와resource – 연결된 자원을 기술<br />property – 속성을 지정<br />content – 태그의 내용보다 우선시 되는 값 삽입<br />datatype – 데이터타입을 지정<br />typeof – RDF 타입을 지정<br />19<br />
  20. 20. OGP의 메타데이터<br />기본 메타데이터<br />og:title – 객체의 제목, 예, "The Rock".<br />og:type – 객체의 타입을 지정, 예, "movie". <br />og:image – 그래프 내에서 객체를 나타내는 그림을 삽입.<br />og:url – 그래프에서 ID로 사용될 수 있는 기준 URL을 기술, 예, "http://www.imdb.com/title/tt0117500/".<br />선택적 메타데이터<br />og:description – 객체에 대한 설명을 기술.<br />og:site_name – 특정 사이트의 일부일 경우 사이트의 이름을 명시. 예, "IMDb".<br />20<br />
  21. 21. 기본 메타데이터의 예<br /><html xmlns:og="http://ogp.me/ns#"><br /><head><br /><title>The Rock (1996)</title><br /><meta property="og:title" content="The Rock" /><br /><meta property="og:type" content="movie" /><br /><meta property="og:url" content="http://www.imdb.com/title/tt0117500/" /><br /><meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" /><br />...<br /></head><br />...<br /></html><br />21<br />
  22. 22. 위치 지정을 위한 메타데이터<br />좌표 기술을 위한 메타데이터<br />og:latitude- e.g., "37.416343".<br />og:longitude- e.g., "-122.153013".<br />주소를 기술하기 위한 메타데이터<br />og:street-address - e.g., "1601 S California Ave“<br />og:locality- e.g, "Palo Alto“<br />og:region- e.g., "CA“<br />og:postal-code e.g., "94304“<br />og:country-name - e.g., "USA"<br />22<br />
  23. 23. 연락 정보를 위한 메타데이터<br />연락 정보 기술을 위한 메타데이터<br />og:email- e.g., "me@example.com".<br />og:phone_number- e.g., "+1-650-123-4567".<br />og:fax_number- e.g., "+1-415-123-4567".<br />23<br />
  24. 24. 객체 타입 지정을 위한 메타데이터<br />og:type속성<br />그래프 내에서 표현되어질 객체의 특정 타입을 지정<br /><meta property="og:type" content="product" /><br />지원되는 타입<br />http://opengraphprotocol.org/#types참조<br />24<br />
  25. 25. 소셜 플러그인<br />정의<br />HTML 웹 페이지에 코드를 삽입함으로써 페이스북의소셜 서비스를 이용할 수 있는 추가 프로그램<br />소셜 플러그인의 종류<br />Like Button<br />Activity Feed<br />Recommendations<br />Like Box<br />Login Button<br />Facepile<br />Comments<br />Live Stream<br />25<br />
  26. 26. Like 버튼<br />기능<br />페이스북에서 친구들과 특정 문서를 공유하기 위한 기능을 제공<br />사용자가 특정 사이트의 Like 버튼을 클릭하면, 해당 사이트로의 링크를 포함하여 사이트의 정보가 사용자의 친구들에 노출됨<br />URL<br />http://developers.facebook.com/docs/reference/plugins/like<br />26<br />
  27. 27. Like 버튼 만들기<br />27<br />
  28. 28. 사용자의 광클<br />28<br />
  29. 29. 시맨틱 웹에서 OGP의 의미<br />RDF 데이터 모델<br />OGP의 메타데이터는 “URI – OGP의 속성 – 값” 형태로 SPO의 구조를 사용<br />따라서 완전한 RDF의 모델로 취급될 수 있음<br />시맨틱 웹에서의 클래스와 개체<br />하나의 웹 페이지는 OGP의 type 속성에 의해 그것의 타입을 기술  클래스에 해당<br />또한 하나의 웹 페이지는 그래프에서 하나의 객체로 취급  클래스의 개체(individual)에 해당<br />29<br />
  30. 30. 트위터의소셜 시맨틱 웹<br />30<br />
  31. 31. 트위터의어노테이션<br />기능<br />트위터에 메시지를 작성할 때 메시지에 대한 구조화된 메타데이터를 첨부하는 것<br />특징<br />JSON이나 XML 형태로 표현되어짐<br />어떤 메타데이터를 작성할 것인가는 작성자의 의도에 따라 달라질 수 있음<br />단, 권장하는 메타데이터의 종류가 존재<br />타입과 속성으로 구성<br />31<br />
  32. 32. 트위터어노테이션의 형태<br />타입<br />모든 어노테이션에는 하나 이상의 타입이 존재<br />타입은 하나 이상의 속성과 값의 쌍으로 구성<br />어노테이션 정보의 포함을 위해 한 메시지의 총 용량을 512 bytes로 확장<br />하지만, 웹에서 표현되는 방식은 이전과 동일<br />140 글자의 제한을 그대로 유지<br />32<br />
  33. 33. 어노테이션의 작성<br />33<br />JSON<br />Simple Format<br />
  34. 34. 트위터어노테이션의 예<br />34<br />
  35. 35. 트위터어노테이션 실습<br />URL<br />http://r.github.com/annotationsformatter/<br />35<br />
  36. 36. 어노테이션을 위한 속성<br />공통 속성<br />title – 어노테이션의 제목<br />image – 표현될 그림을 지정<br />url– 어노테이션을 클릭했을 때 보여질 URL<br />어토테이션을 위한 타입<br />webpage, place, review, song, movie, tvshow, book, product, stock, offer, topic, event<br />http://dev.twitter.com/pages/annotations_overview<br />36<br />
  37. 37. 어노테이션과 시맨틱 웹<br />어노테이션 타입  온톨로지의 클래스<br />37<br />
  38. 38. 어노테이션과 시맨틱 웹<br />시맨틱 웹의 자원과 연결<br />38<br />
  39. 39. 결론<br />페이스북의 오픈 그래프 프로토콜<br />하나의 웹 페이지를 하나의 소셜 객체로써 사용자들과의 그래프 형태로 제공하기 위한 방법<br />트위터의어노테이션<br />하나의 트위터 메시지를 소셜 객체로써 활용<br />소셜 시맨틱 웹에서의 관점<br />사용자들의 사회 관계 활동을 기반으로 기계가 처리할 수 있는 메타데이터가 만들어지고, 이를 활용하여 보다 사용자 중심의 서비스를 제공하는 것이 그 목적<br />39<br />
  40. 40. 저는요…<br />E-Mail<br />xml@yonsei.ac.kr<br />Blog<br />http://www.semantics.kr/<br />Twitter<br />http://www.twitter.com/MyungjinLee<br />Facebook<br />http://www.facebook.com/mjinlee<br />SlideShare<br />http://www.slideshare.net/onlyjiny<br />40<br />

×