Client.
대교
Work.
UI Design, Publishing
Production.
WEB
Device.
PC, Tablet
Period.
21.07
Project Overview.
대교 eyes on은 온라인 화상 회의 및 온라인 수업 서비스를 제공합니다. 카메라와 마이크를 사용해 참여한 후 화면을 공유하고 채팅 할 수 있습니다.







회의도 수업도 한 화면에서, '아이즈온(eyes on)'
아이즈온(eyes on)은 대교가 선보이는 비대면 교육 환경에 최적화된 화상 회의 및 수업 플랫폼입니다. 기존 범용 화상 회의 툴은 교육 특화 기능이 부족하고, 어린 학생이나 기기 조작이 서툰 사용자가 다루기에는 카메라 설정이나 화면 공유 과정에서 잦은 혼선이 발생했습니다. 이에 단순 화상 송출을 넘어 수업 몰입도를 높이고 실시간 소통을 강화할 수 있는 직관적인 교육 전용 환경 구축이 필요했습니다.
유엑스스토리(UXstory)는 접속부터 참여까지의 사용 동선과 수업 중심의 화상 레이아웃을 전면 설계했습니다. 복잡한 설정 없이 '링크 접속 → 미디어 사전 점검 → 입장'의 3단계로 진입 과정을 단축하고, 메인 화상 영역과 공유 화면, 참여자 목록, 채팅창을 최적의 비율로 배치했습니다. 또한, 카메라와 마이크 제어, 화면 공유, 손들기 등 자주 사용하는 기능을 하단 툴바에 직관적인 비주얼 아이콘으로 구성하여 원클릭 조작이 가능하도록 UX를 재설계했습니다.
장시간 모니터를 보아도 눈이 피로하지 않은 차분한 UI 컬러 팔레트와 고시인성 제어 툴바, 반응형 화상 그리드 컴포넌트를 정립하여 화상 교육 전용 디자인 시스템을 구축했습니다. 이를 통해 초기 접속 오류와 이탈률을 낮추고, 선생님과 학생 모두가 양방향 수업에 몰입할 수 있는 최적의 편의성을 구현했습니다.
Key Features
- 교육 특화 레이아웃: 메인 화상, 화면 공유, 참여자 목록, 채팅창을 배치한 멀티 뷰 인터페이스 구축
- 직관적인 제어 툴바: 카메라·마이크 온/오프, 화면 공유, 손들기 기능의 하단 원클릭 툴바 배치
- 간소화된 입장 동선: 링크 접속 및 입장 전 미디어 테스트 룸 점검을 통한 3단계 진입 프로세스
- 참여자 관리 및 소통: 실시간 대화형 채팅과 참여자 반응(손들기) 및 상태 관리 기능 제공
- 화상 전용 디자인 시스템: 피로도를 낮춘 UI 컬러 시스템 및 반응형 화상 그리드 컴포넌트 구축