Git Product home page Git Product logo

01joseph-hwang10 / cse333_hci_prototype Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 0.0 5.03 MB

UNIST CSE333 Introduction to Human-Computer Interaction 을 수강하며 제작한 본 팀의 low-fidelity prototype 중 하나입니다. 본 프로토타입은 iPad와 같은 태블릿에 해상도가 맞추어져 있습니다.

Home Page: https://01joseph-hwang10.github.io/CSE333_HCI_Prototype/

CSS 20.99% HTML 31.43% JavaScript 47.58%

cse333_hci_prototype's Introduction

UNIST CSE333 Introduction to Human-Computer Interaction 을 수강하며 제작한 본 팀의 low-fidelity prototype 중 하나입니다.

Important

본 프로토타입은 사용자의 디바이스가 아이패드와 같은 태블릿이라는 가정 하에 제작되었습니다. 프로토타입도 이에 맞추어 제작되었으며, PC로 열람하시는 경우 개발자도구를 통해 태블릿 화면으로 변경해주시기 바랍니다.

Note

강의의 전체 활동 기록은 여기를 참조해주세요.

Showcase

Untitled

Background

HCI 의 맥락에서 본 팀이 세운 문제는 다음과 같습니다.

음악을 연주할 때, 연주자는 악기를 연주하면서 종이로 된 악보를 넘기는 것이 어려우며, 이로 인해 연주의 흐름 방해, 연주 중단 등의 문제가 발생합니다. 또한 반복적인 악기 <-> 종이 악보간의 시야 전환으로 연주자의 주의를 산만하게 합니다.

이러한 문제의 해결을 위해 본 팀은 아래와 같은 프로토타입을 제작하였습니다.

  1. IPad와 그 전면 카메라를 활용해 악보를 바라보는 연주자의 시야를 잔상으로 남기는 기능을 추가해, 이를 통해 반복적인 시야 전환의 상황 속에서도 연주자가 이전에 보고 있었던 악보의 부분을 바로 찾을 수 있도록 합니다
  2. 악보의 특정 부분을 일정 시간 이상 보고 있으면 악보를 자동으로 넘겨주는 프로토타입을 제작하였습니다.

그러나 위 두 기능을 제대로 구현해내는 것은 꽤 오랜 시간이 걸리며, 여기에 본 팀의 가설이 틀렸을 위험도 있기 때문에, 우선 본 리포에 GH pages로 호스팅 되어있는 Wizard-of-OZ lo-fi 프로토타입을 제작해 사용자 테스트를 진행하였습니다.

테스트하고자 하는 것은 아래와 같았습니다.

  1. 사용자가 본 프로토타입 악보를 보고 연주할 때, 연주에 끊김이 있는가?
  2. 악보와 악기 사이에 시야를 고정하는데 얼마나 시간이 걸리는가?
  3. 연주자가 본 프로토타입이 연주를 더 편하게 해주는지에 대한 인식은 어떠한가?

이와 관련해 위 가설을 긍정하는 결과가 테스트를 통해 나왔고, 본 팀은 이에 기반해 다음 단계로 진행할 수 있었습니다.

Note

위 유저 스터디와 관련한 더 자세한 내용은 Final Report 페이지의 4) Computer Prototype ver 1 (Lo-Fi) 섹션을 참조해주세요.

cse333_hci_prototype's People

Contributors

01joseph-hwang10 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.