Naver Perl Community & Study Cafe


2010.06.08 18:44

The Contents for Studying English using American TV Dreamas






올해 3월 말 부터 5월 초까지 약 한달반 정도 소요된

팀 프로젝트입니다.

영어공부를 하는데 외국 영화나 드라마를 가지고 공부를 많이 하는데 

이를 프로그램으로 구현해 보았습니다.


프로그램의 프로토 타입 구현에 대한 알고리즘은 아래 링크되어 있습니다.


위의 글과 같은 방법으로 SAMI 파일을 각각 parsing 하였고, 

각 장면별로 나눠주는 알고리즘을 만들어, 

상황별 이미지와 스크립트를 나눠주는 모듈을 만들었습니다.





영상에서 스크립트를 추출하여, 영어공부를 할 수 있는 모드를 설정하며,

각 상황별 스크립트, 영상, MP3 등을 추출하여 스터디와 게임을 할 수 있으며,

복습하고 싶은 부분을 아이폰에 전송하여 동일하게 공부할 수 있는 방법입니다.




원하는 부분의 MP3 를 Direct Show를 사용하여 추출하였으며,

영상과 MP3 를 분리해 따로 저장시켰습니다.



각각 추출된 영상과 MP3 파일을 XML 파일로 넘겨 아이폰에서도 

영어 스터디를 할 수 있도록 설정하였습니다.




Main은 WPF 로 꾸몄으며, 정적인 이미지 파일이라 보이지는 않지만

구름이 날아다니고 풍차도 돌아갑니다.

스터디 모드와 게임 모드 1,2 가 있고, OPTION 에는 아이폰으로 추출한 영상이나 스크립트를

전송을 할 수 가 있습니다.


- Study MODE



때의 화면입니다.

각 영상들을 추출하기 위해 로딩화면들을 구현하였습니다.



모든 영상을 다 추출하면 3D 뷰어로 이미지를 확인할 수 있으며 해당 이미지를 더블클릭하면

그 영상으로 바로 이동하여 플레이가 가능합니다.




오른쪽에는 각 스크립트별로 한글과 영어자막을 확인할 수 있으며,

자신이 원하는 부분을 체크하면,

그 자막에 대한 문제가 나오며, 답이 맞췄는지 틀렸는지 알리며,

Open API 를 사용하여 그 답에 대한 단어를 검색해줍니다.


- Game1 MODE




오리를 이용하여 영어 단어 맞추는 게임을 하는 Flying 게임입니다.

이 게임은 WPF를 사용하였고 Faseer물리엔진을 적용시켜

컨텐츠의 몰입도를 높히는데
중점을 두었습니다.


위에는 각 파싱된 영화나 미국 드라마의 대사가 한 줄 나오게 되며

페이스를 누르게 하여 그 구간의 영상을 볼 수 있습니다.


이는 어학습 게임진행에 차질이
없게 하기 위한 것이며,

질리지 않는 구성을 위해 6개의 아이템을 두어 게임의 난이도
를 두었습니다.


그리고 스코어와 체력, 시간이라는 개념의 도입과 맞춘 단어는

OPENAPI
를 활용하여 뜻을 보여 주는 등 학습을 위한 기능과

재미라는 요소를 버무리기 위해 노
력을 가하였습니다. 



아래 보이는 오리 머리의 Slider bar는 스테이지의 진행도를 보여 주며,
 
게임이 종료
되면 웹에 스코어가 등록되어

게임을 하는 사람의 승부욕을 자극하도록 구성하였습니다.


- Game2 MODE



     

    Snake Game은 Study모드에서 학습 후 학습 한 문장 중 몇 문장만

    Game으로 복습할 수
    있도록 한 Game입니다.

    즉 Study 한 문장의 알파벳을

    일반적인 흔히 있는 Snake Game에
    접목시킨 것입니다.


    문장을 이루고 있는 알파벳들이 임의의 위치에 놓이게 되고

    Snake가
    움직이면서 그 문장의 알파벳순서대로 알파벳을 먹으면

    꼬리가 하나씩 늘어나게 되는
    방식으로 이루어집니다.




    게임을 시작하게 되면 좌측 상단에 왼쪽 그림과 같이 순서대로

    먹어야 하
    는 문장이 희미하게 표시 되며

    오른쪽 그림처럼 이 알파벳들이 임의의 위치에 놓이게
    됩니다.

    snake를 방향 키를 조절해서 움직여서 상단에 표시 된

    문장 알파벳 순서대로 먹기
    만 하면 됩니다.


    - IPhone





    프로그램을 시작하였을 때 뜨는 메인 화면입니다.

    English Study, Dictionary, Worm_Game,
    Flog_Game 기능을 지니고 있으며

    English Study를 실행시키면 주요 프로그램인 학습기
    능이 진행되고

    Dictionary에서는 사용자가 단어를 검색해서 볼 수 있는 사전기능이며,

    Worm Game 과 Sniper Game은 교육한 문장으로 게임을 하는 모드입니다.



    교육모드로 들어가게 되면 iPhone이 가지고 있는

    교육목록(XML파일의 목록)이 나오며
    사용자는 이 목록 중

    교육하고 싶은 것을 클릭하면 해당하는 교육으로 들어갑니다.

    좌측
    상단의 아이콘을 클릭 시 메인 화면으로 돌아가게 됩니다.



    교육을 선택하여 시작하기 전

    해당하는 MP3이 없을 때는 경고 창이 나타나면서

    다시 목
    록 선택하는 곳으로 돌아가게 됩니다.


    해당하는 MP3의 파일있을 때 위처럼 화면이 나오게 됩니다.

    아래에 자막이 나오고 우측
    상단에 PLAY 버튼을 누르게 되면

    해당하는 교육의 음성이 재생되게 됩니다.


    음성이 진행
    되는 정도에 따라 밑에 자막은 점점 올라가면서

    음성과 자막을 싱크가 맞게 자막이 올
    라갑니다.

    우측 화살표를 클릭하면 화면의 자막은 없어지면서 자막이 없이

    음성만으로 교
    육이 가능하고, 다시 우측화살표를 클릭하면

    사라진 자막이 다시 화면에 나오게 됩니다.


    좌측의 BACK 버튼을 누르게 되면 다시 교육 선택화면으로

    돌아가고 교육을 다시 교육을
    선택하여 교육을 진행합니다.



    사전은 사용자가 영어 학습에서 단어를 검색하여

    볼 수 있도록 하는 모드로 우측 흰색
    창에 단어를 입력하게 되면

    우측 화면에 해당 단어와 관련 단어들이 나타납니다.

    단어의
    정보는 발음 기호와 해설 두 가지의 정보를 보여 주며,

    우측 하단의 아이콘을 클릭하게
    되면 다시 메인 화면으로 돌아가게 됩니다.



    Worm 게임은 하나의 문장의 각 철자들이 화면에

    흩어진 단어를 먹는 게임입니다.

    게임은 가지고 있는 교육 자료 중 무작위로 추출한 뒤 

    하나의 문장을 화면에 임의로 나
    타냅니다.


    게임이 시작되면 문장은 좌측에 게재됩니다.

    각 알파벳들은 화면의 파란색 매트위에 임의
    에 위치에 나타나게 됩니다.

    사용자는 캐릭터를 이용하여 제한시간 60초안에 알파벳을 먹
    으면 되고,

    알파벳을 순서대로 먹게 되면 점수는 15점씩 증가하며,

    순서와 관계없이 먹
    을 때는 5점씩 증가합니다.

    먹은 알파벳은 캐릭터 뒤편에 꼬리로 달리면서 게임이 진행됩니다


    버튼을 클릭하여  속도 벡터
    의 방향을 4 방향으로 변경하여

    캐릭터의 움직임을 조종하는 방식입니다.


     




    게임을 시작하면 화면에 해당 문장은 하단에 게재되며

    알파벳들은 화면에 날아다니게
    됩니다.

    제한시간은 1분이 주어지고 1분이 넘으면 게임이 종료됩니다.

    각 알파벳들의 속도와
    방형은 임의로 지정되고,

    게임이 시작 되면 각 알파벳들은 화면에 날아다니게 됩니다.


    용자는 이 알파벳을 선택하여 드래그 하여 게재된 문장에 넣어서

    문장을 완성하는 게임
    으로 맞는 알파벳을 넣을 때는

    해당 알파벳이 화면에서 커지게 되고 점수가 30점씩 올
    라갑니다.

    아닐 경우에는 그 자리에 머물게 되며 점수가 10점 감소합니다.



    Sniper 게임도 Worm 게임과 같은 메뉴구성을 가집니다.

    왼쪽 상단에 메인 화면으로 돌아
    가는 버튼이 있고

    제한시간 점수 이렇게 구성 됩니다.

    중앙에 Start버튼을 클릭하면 게임
    은 시작됩니다.   




    - Web Server


    Web Server 를 구축하여, 본 프로그램을 소개 및 게임의 스코어를 공유하고,

    질문이나 프로
    그램 사용 만족도의 피드백을 받을 수 있는 공간을 마련하였습니다.

    Web Server 는 Apach 서
    버, 언어는 PHP로 이루어져 있으며 DB 는 Mysql 로 설정하였습니다.

    심플하면서 고급스러운
    Interface 환경을 위하여 Flex 를 이용하여 전체 Web Page를 제작하였습니다.





    로그인을 위한 사용자 이름과 Password 를 입력 할 수 있는 창이 있으며,


    이 창을 이용
    하여 로그인이 가능하도록 설정되어 있습니다.

    Description, Developer, Flying , Snake,
    Q&A , Guest Board 로 구성되어 있습니다.




    Description은 일반 사람들이 프로그램 사용 전에 이것이 어떤 프로그램이며,


    프로그램
    을 개발 한 목적을 알기 쉽도록 선정배경과

    개발 목적을 기술 하였습니다.




    Developer는 각자의 소개 , 그리고 맡은 파트

    그리고 전체적인 프로젝트 일정을 두어

    어떻게 제작되었는지 설명되어 있고,

    각 사용자에 따라 설문조사를 통하여 인기투표도
    진행됩니다.




    Game Score 는 Flying, Snake 2가지로 되어 있으며

    프로그램 안에 들어있는 게임의 점
    수들이

    Database 로 전송되어 그 결과 값에 따라서 순위가 매겨지는 시스템입니다.

    사용
    자 이름과 Score 그리고 간단히 할말을

    적은 Table 이 출력되는데 Score 에 따라

    랭킹
    이 매겨지며 1위에서 5위까지만 출력이 됩니다.





    사용자들이 프로그램을 사용하면서 버그에 대한 이야기나

    질문사항들을 받는 게시판으
    로 제로보드를 이용하여 제작하였습니다.



    사용자들이 의사소통을 할 수 있는 Guest Board 제공하였습니다.


      - 영상



    - 참고문헌

       
    - DirectShow 멀티 미디어 프로그래밍 - 한빛미디어, 신화선 저

       - Flex AIR BIBLE - 대림출판사, 윤훈남 저

       - Pro WPF in C# 2008 - WellBook, 메튜 맥도날드 저

       - C# Programming Bible - 영진닷컴, 최재규 저

       - 게임 물리 바이블 - 사이텍 미디어, 데이빗 H. 에벌리 저

       - Objective-C:맥과 아이폰 애플리케이션 프로그래밍 - 한빛미디어, 오기하라 타케시 저

       - 아이폰 프로그래밍 가이드 - 프리렉, 하기룡 외 1명 저

       - 시작하세요! 아이폰3 프로그래밍 - 위키북스, 데이브 마크 외 1명 저

신고
Trackback 2 Comment 3