프로젝트 개요
Took!은 교내 학생회 선거를 더 편리하게 치를 수 있도록 돕는 블록체인 기반 전자 투표 웹 서비스로, 구름톤 유니브 경기대학교 활동 중 진행했다. Klaytn을 이용한 암호화로 선거 과정과 결과를 조작할 수 없게 만들어 공정한 선거를 보장하는 것이 핵심이었다.
주요 기능
- 관리자 모드: 투표를 생성·관리하고 공지사항을 작성·수정한다.
- 학생 모드: 진행 중인 투표에 참여하고, 지난 투표 결과와 공지사항을 확인한다.
- 학생 인증: 카카오 소셜 로그인과 LMS 연동 로직으로 재학생 여부를 확인한 뒤 가입한다.
서비스 목표
온라인 투표 서비스의 가장 큰 목적은 간결하면서도 신뢰할 수 있는 투표 환경을 제공하는 것이었다. 사용자는 단일 선택, 다중 선택, 순위 기반 투표 등 다양한 형태의 투표를 생성할 수 있었고, 투표가 진행되는 동안 실시간으로 결과를 볼 수 있도록 설계했다. 프론트엔드에서는 사용자 경험 향상과 인터랙티브한 결과 시각화에 초점을 맞췄다.
기술적 도전과 문제 해결
이 프로젝트는 개발 협업 과정에서 예상치 못한 어려움이 있었다. 서버와 클라이언트의 통신 구조가 충분히 정의되지 않은 상태에서 개발이 진행되었기에, 백엔드 개발자들이 프론트엔드에서 어떤 식으로 데이터를 받아오고 보내는지를 명확히 이해하지 못한 상황이 발생했다.
이에 따라 정상적인 API 연동이 이루어지지 못했고, 나는 프론트엔드 단에서 로컬 상태를 독자적으로 관리하며 데이터의 흐름을 직접 처리해야 했다. 예를 들어, 사용자의 투표 선택 상태를 각 컴포넌트에서 수집해 하나의 결과로 통합하거나, 하나의 투표 세션을 여러 스텝으로 나누어 보여주는 로직을 직접 설계해야 했다. 이 작업은 단순한 UI 구현 이상의 복잡한 상태 관리 구조를 요구했고, 로컬 상태에서의 데이터 병합 및 가상 통신 시뮬레이션을 통해 테스트를 진행해야 했다.
이 과정을 통해 실시간 통신 UI 설계의 난이도와 명확한 API 명세 정의의 중요성을 깊이 체감할 수 있었다. 또한 백엔드와의 협의 없이 기능을 구현할 때 발생할 수 있는 구조적 비효율을 개선하기 위한 데이터 관리 패턴의 필요성을 학습할 수 있었다.
성과와 학습
이 프로젝트는 완전한 서버 연동까지 마무리되지는 못했으나, 프론트엔드 단계에서 복잡한 투표 플로우를 단독으로 완성했다는 점에서 의미가 있었다. 다양한 투표 단계를 인터랙티브하게 구현하고, 사용자 경험을 고려한 애니메이션과 차트 시각화를 설계하며 UI와 UX의 연결성을 높였다.
이를 통해 배운 점은 다음과 같다.
- 명확한 API 협의 및 문서화가 프로젝트 전체 완성도에 미치는 영향
API 연동 실패라는 한계를 겪으면서도, 데이터 흐름을 직접 다루는 경험을 통해 서비스 아키텍처를 더 근본적으로 이해하게 된 프로젝트였다.