posted by 희정냥★ 2009. 8. 6. 16:31

* 과제소개 : Samsung Software Membership online 9th Exhibition
아래는 제가 2007년도에 멤버십 회원이 되고 나서 처음으로 했었던 과제이고,
2007년 5월부터 2007년 7월까지 진행했었습니다.
위에 링크되어 있는 온라인전시회 페이지에 소개된 내용입니다.


1. Introduction




웹 환경에서 프레젠테이션 문서를 제작함으로써 설치와 같은 환경의 제약이 없이 사용이 가능하며, 데이터 공유와 정보의 공개 등을 통한 새로운 사용자 컨텐츠 문화를 조성한다. 제작한 문서의 사용자간 공유 기능이 매우 뛰어난 장점이 있다. AJAX와 ASP .NET을 이용한 동적인 컨텐츠를 통해 표현의 제약을 뛰어 넘고, 나아가 여러 비즈니스 모델을 제시한다.




김정하  하승우  김희정 


 


            


이 서비스는 두 가지 측면의 문제를 해결하고자 기획되었다.


첫째, 프리젠테이션 프로그램의 로컬환경의 작업으로 인해 문서 및 정보의 사용자간 공유가 매우 힘들다는 점이다. 무거운 프로그램과 웹 환경에서 편집이 되지 않는 점 등이 웹 환경으로의 전환을 꾀하지 못한다는 단점이 있다.

둘째, 현재 존재하고 있는 온라인상의 많은 부분의 컨텐츠가 텍스트 위주의 정적인 컨텐츠이다. 또, 각 컨텐츠는 하나의 특징만을 가지는 독립적인 것이 대부분이다.

이 서비스를 통해 다양한 방법에서 표현할 수 있는 진정한 동적 컨텐츠를 생성하고자 하며 사용자간 데이터 공유와 정보의 공개 등을 통한 새로운 사용자 컨텐츠 문화를 조성하며, 서비스 제공자는 이를 통한 여러 상업적인 효과를 창출할 수 있다.



2. Development Description


본 과제는 웹 오피스 Web 2.0의 한 부분을 비중있게 다룬 작품이다.

많은 분야에서 이와 같은 모델이 연구되고 있지만 웹 오피스의 장점을 비즈니스 모델과 접목 시키는 부분에 대해서는 미흡한 것이 사실이다. 우리는 이에 착안하여 웹의 특성을 살린 사용자들간의 공유와 출판의 개념을 접목 시키고자 하였다. 또한, 관련 기술은 AJAX를 심도있게 다루었으며, ASP .NET을 이용하여 내부적인 비즈니스 로직을 제작하였다.

로컬 환경의 프로그램이 웹 환경으로 진화하면서 사용자들은 자신의 지식을 다른 사용자와 공유할 수 있으며, 이를 자신을 표현하고 나타내는 수단으로 사용할 수 있다. 또한 서비스 제공 업체에서는 관련 서비스를 이용하여 많은 비즈니스 모델을 구상할 수 있게 되었다.

이것은 바로 Web 2.0 의 개념을 가장 잘 표현한 부분이며, 이 작품에서 자신있게 보여주는 부분이다.



 

  



DB를 제외한 전체적인 3-Tier Architecture로 구성이 되어 있다. 이는 추후 서비스가 대형화 되었을 때를 대비하여 커넥션 풀링과 같은 부분을 고려하기 위함이라 할 수 있다.

1. UI

일반 사용자에게 보여지는 Web Site, PT문서작성, Open API를 포함한다. 사용자의 이벤트 등을 처리하며 입력 Data를 BIZ layer로 넘기거나 BIZ layer를 통해 Data를 조회한다.

2. BIZ

각종 업무단위로 묶여지며 입력 Data를 처리하고 처리된 Data를 DAC layer로 넘기거나 DAC layer를 통해 Data를 조회한다. AJAX처리를 위한 WebService BIZ와 일반적인 Web Site부분에서 사용될 BIZ부분으로 나누어지며 WebService BIZ는 다시 공용 BIZ를 사용하게 된다. 공용 BIZ는 COM+로 구성되며 Transaction 처리를 담당한다.

3. DAC

COM+과 SQL Helper을 통해 DataBase와의 Connection과 Connection Timeout등을 관리하며 Stored Procedure의 Parameter 생성과 호출을 담당한다.

4.  DataBase

MS SQL 2005로 구성된다.



 

5. XML

데이터베이스에서 문서를 불러오거나 사용자의 요구에 의해서 문서가 편집 되었을 때, 하나의 XML 문서의 형태로 데이터가 저장되어 제어를 할 한다. 또한 이렇게 제작된 XML 데이터를 바탕으로 사용자 디스플레이에 렌더링 된다.




  

1. 과제 목표

본 과제는 동기에서 볼 수 있듯이 Web 2.0 이란 기술을 활용해서 웹 오피스와 접목 시켰을 경우, 얼마나 많은 상승 효과를 보여줄 수 있는 지에 대한 증명을 목표로 하고 있다.

프로그램 측면에서 기본적인 텍스트와 이미지의 입력과 편리한 유저 인터페이스의 제공을 목표로 하고 있으며, 웹 컨텐츠 확보를 위한 포스팅과 사용자들간의 자료 공유에 중점을 두어 프로젝트의 기획을 하게 되었다.

또한, 데이터베이스의 확장성과 향후 서버의 확장을 고려하여 XML 문서의 형태를 분리 저장하고 로딩되는 과정에서 통합하는 형태로 자료구조를 설계하고자 하였다.

2. 과제 결과

2.1. UI

오피스 제품군을 사용하던 사용자들이 웹 환경에서 본 서비스를 사용하였을 때, 이질감을 줄이기 위해 최대한 편리한 UI를 제공해주고 있는데, 이와 같은 UI의 형태를 리본 UI라고 한다.

           

 

2.2. Editing

편집 기능에서는 로컬에서 제공되는 것과 같은 텍스트 입력과 이미지, 멀티미디어 등이 제공되며, 각 객체에는 애니메이션을 부여하여 동적인 문서를 제작할 수 있다.
또한, 이미지에 대한 그룹화와 스마트 아트를 지원하고 있으며, Redo/Undo 기능을 위한 메모리 스택을 제작하였다.

프리젠테이션 프로그램의 특성을 살려 분할 출력 기능이나 클립보드와 같은 기능 역시 제공을 하고 있다.

2.3. Viewing

제작된 문서는 다음과 같은 화면의 형태로 사용자에게 보여지게 된다.

좌측 하단에 현재 페이지가 나오고 있으며, 우측 하단에는 페이지 이동, 슬라이드쇼, 프린트 기능 등을 제공하고 있다.

               

 

2.4. Posting

사용자는 서비스 사이트에서 제공되는 문서를 포스팅 하여 자신의 블로그나 타 사이트의 게시판에 포스팅 할 수 있다. 이러한 기능을 통해 사용자들은 기존의 텍스트, 이미지가 아닌 새로운 형태의 매체를 접할 수 있게 된다.

               

 

2.5. Contents Upload

웹의 특징을 활용한 부분의 한 방법으로 컨텐츠의 업로드 기능이 있다.

사용자는 자신이 만든 도형이나 클립아트, 템플릿 등을 서버에 업로드를 할수 있으며 이를 이용하여 다른 사용자들과 공유를 할 수 있게 된다.

이러한 기능을 통해 사용자간의 데이터 공유의 활성화를 기대할 수 있으며, 이는 사용자들의 컨텐츠 제작의 질을 한층 더 향상 시킬 수 있다.

               

 

2.6. Task Sharing

다음 그림은 두명의 사용자가 하나의 문서를 동시에 작업할 수 있다는 것을 보여주고 있다.

파일 기반의 서비스의 경우 하나의 문서에 대해서 여러명이 동시에 작업을 할 경우에, 문서를 제작하고 통합하는 과정이 번거로웠다. 하지만 웹환경에서는 문서 작업을 원하는 사용자에게 편집 권한만을 부여해주는 행위 하나만으로 사용자간의 협업 시스템이 훌륭하게 이루어 지게된다.



 

2.7. Service Site

위에서 설명한 모든 기능을 서비스하기 위한 서비스 사이트를 제작하였으며, 이 사이트 역시 전반적인 AJAX 기술을 활용하여 제작하였다.

사용자의 편의성을 위해, 카테고리별 등록과 실시간 인기 검색어, 검색 자동완성 기능 등을 제공해 주고 있다.

 

 

[[applied technology]]

1. AJAX

서버와 클라이언트의 비동기 통신 방식인 AJAX 기술을 활용하여, PT 제작 부분의 전반적인 부분에 활용이 되었다.

본 프로젝트의 경우 데이터의 로딩과 저장을 하는 과정이 AJAX 기술을 가장 많이 활용한 부분이다. 이를 이용해 웹 상에서의 데이터 유실을 막을 수 있는 자동저장과 같은 기능을 구현하였다.

2. Vector Image 제작

웹 환경에서는 로컬 환경의 오피스 제품군과는 달리 벡터 형식의 이미지 처리를 지원하지 못한다.

때문에 이미지의 확대나 축소와 같은 기능을 사용자에게 제공하기 위해서는 사용자로부터 입력받은 마우스의 위치 데이터를 파악하여야 한다. 벡터 이미지 계산 수식을 적용하여 비즈니스 로직 부분에서 계산된 데이터를 바탕으로 렌더링 과정을 통해 브라우저로 실시간에 표시하게 된다.

3. COM+

3Tier Architecture 상에서 BIZ Layer 와 DAC Layer에 COM+ 기술을 적용하였다.

BIZ Layer에서는 데이터 처리상에 Transaction 을 담당하게 되고 DAC Layer에서는 Connection Pooling을 담당하게 되는데 이를 통해 대규모의 Data 및 다수의 동시접속자에 대한 처리를 할 수 있도록 설계하였다.




1. Software 

  [IDE] Visual Studio .Net 2005
  [Database] MS SQL 2005
  [Etc] JAVASCRIPT (AJAX 기술 포함)



3. Improvement



 

1. PPT 포맷 호환

현재는 자체 제작한 XML Document의 형태로 문서가 저장되고 있지만, 추후 업데이트를 통해 MS사의 PPT와도 호환이 가능하도록 구현할 예정이다. 이러한 호환이 가능해 질 경우 사용자들에게 편의성을 증가시키고, 서비스의 확대를 가지고 올 수 있다.

2. 모바일 장치와의 연동

웹 환경 어디에서든 적용이 가능하기 때문에 모바일 장치에서도 문서를 제작하거나 볼 수 있는 환경을 만들 수 있다.



4. Epilogue

 


1. 그래픽 환경

로컬 환경의 프로그램의 경우 벡터형태의 이미지로 이루어진 반면, 웹에서는 벡터 이미지를 표현해 주지 않기 때문에 이 부분을 처리하는데 어려움이 있었지만, 내부적인 계산 로직을 적용하여 해결할 수 있었다.

2. 표

사이즈의 조절과 같은 기능은 제공을 할 수 있지만, 표 안에 내용을 직접 삽입하는 등의 방법에서 많은 에로사항이 발생하였다. 이 부분에 대해서는 향후 적합한 방법을 모색중에 있다.

3. 텍스트 입력

텍스트 박스를 로컬 환경과 같은 모습으로 제작하기 위해서는 상당히 많은 기술적인 부분을 요구 했지만, 개발의 목적과 시간을 고려하여 텍스트 입력창을 따로 두었던 점이 약간의 아쉬운 점으로 남는다.

 

5. Manager's comment


 

현재 활발히 연구되고 있는 Desktop Client의 한 분야로써, 로컬 환경에서만 사용되었던 프로그램을 설치 없이 웹에서 사용할 수 있다는 점에 Web 2.0 개념을 접목시켜 사용자 측면의 편의성을 최대한으로 높였다. 기존의 파워포인트를 웹에서도 클라이언트처럼 실행할 수 있다는 것이 상당한 매력이다.
[SW멤버십 WEB2.0 공모전 금상]



 

'Computer > Web' 카테고리의 다른 글

CSS Box Model  (0) 2011.09.18
CSS 선택자  (0) 2011.09.18
Web 2.0 기반의 Presentation On The Web  (0) 2009.08.06
syntaxhighlighter를 tistory에서 사용 하는 방법  (0) 2008.10.08
IE6,IE7 ,FireFox 에 대해 CSS 맞추기  (0) 2008.07.09
CSS에서 브라우저 구별 (IE6, IE7, FIREFOX)  (0) 2008.07.09

댓글을 달아 주세요

posted by 희정냥★ 2009. 7. 21. 09:44

2009.7.18.

멤 수료한지도 어언 7개월이라는 시간이 흘렀습니다.

회원생활동안 많은 사외/사내교육을 다니면서 다양한 분야에 대해 보고 듣고 배웠었는데,

이젠 회원이 아니라 OB로써, 선배로써, 강사로써

후배회원들에게 2시간동안 이야기한다는 것이 쉬운 일은 아니였습니다.


강남멤버십으로 출발하기 직전까지도

어떤 이야기를 하는것이 후배회원들에게 좀 더 도움이 될까를 고민하고 있었으니까요.

막상 앞에 서니 해주고 싶은 이야기도 많았고, 보여주고 싶은 것도 많았고,

2시간이 짧게만 느껴졌습니다.


40~50명이라는 적지 않은 회원들이라

각기 다른 생각을 가지고 있을테고, 

어느 누구에게도 맞추기 힘든 상황이였는데

그 와중에도 열심히 필기를 하거나 제 얘기에 고개를 끄덕이거나 하는

열정적인 모습이 너무 인상 깊었습니다.


저 또한 새롭게 마음을 다질 수 있는 좋은 기회였고,

어느 누구 앞에서도 부끄럽지 않는 더욱 멋진 희정이가 되어야겠습니다.




댓글을 달아 주세요

posted by 희정냥★ 2008. 12. 24. 18:43

12월 22일 오후 6시 30분 ~

멤버십 수료식이 있었습니당~



이것은 수료증ㅋ




말로 표현할 수 없을 만큼 많은 것을 느끼고 배웠던 곳이였습니다 ㅎ




수료 소감을 얘기할 수 있는 기회가 왔는데;;;;

제가 소감을 말하게 될거라고는 눈꼽만큼도 생각치 못해서;;;;;;;;;;;;;;;;;;;;;;

그 좋은 기회에 멋진 말을 하지 못한 것이 캐안습입니다 ㅠㅠ



앞으로도 멋진 희정냥이 되겠습니다~ 아자아자~!




***

신입 모집 기간이 얼마 남지 않았습니당~

대학생이신 분들 용기내어 도전해보세요~

http://www.secmem.org

댓글을 달아 주세요

  1. BlogIcon 자수씨 2008.12.25 21:40 신고  Addr  Edit/Del  Reply

    멤바쉽 신청했시요...
    간지 나는 군뇨~

posted by 희정냥★ 2008. 11. 5. 01:44



삼성소프트웨어멤버십에서는 국가 발전의 초석이며 21세기를 이끌어 갈
열정적이고 창의적인 소프트웨어 개발에 재능이 있는 대학(원)생들을 모집합니다.

 소프트웨어/하드웨어 및 관련 분야에 대한 재능과 열정이 있는 대학생들에게 연구 개발에
필요한 모든 것들을 삼성전자에서 지원하며, 창의적이고 실력 있는 소프트웨어전문가를
양성하여 삼성전자 입사특전을 부여하는 프로그램인 삼성전자 소프트웨어 멤버십에 많은
지원 부탁 드립니다.

- 홈페이지 : http://www.secmem.org
- 회원모집 기간 : 2008년 12월15일 ~ 2009년 1월4일까지

 선발과정 중 기술 면접은 자신이 직접 만든 작품을 가지고 면접관들 앞에서
그 작품에 대해 설명하고 질문에 답하는 구술 면접 형식으로 이루어집니다.
발표작품은 독창적이며 기술적인 면이 돋보이는 작품이 좋은 평가를 받습니다.

http://www.secmem.org/200809_popup.html

* Contact
   - 부산멤버십 담당 연구원 : 최지영 ( jy48th.choi@samsung.com )

댓글을 달아 주세요

  1. BlogIcon 자수씨 2008.11.07 10:52 신고  Addr  Edit/Del  Reply

    나도나도~~