화살표 두개가 맞물리는 이미지인 싱크를 S에 적용한 SyncManager 프로젝트 이미지입니다.
SyncManager는 저희 팀이 서로 가진 불편함을 동시에 해결하기 위해 시작한 프로젝트입니다.
- 시웅: 웹버전 YoutubeMusic은 자막 싱크가 지원이 안되고 자막을 보기가 불편하다.
- 동연: Spotify pc 버전은 팝송 자막에 번역이 첨부돼있지 않아 아쉽다
둘 다 공통적으로 PC 플랫폼에서 불편함을 느껴 크롬 익스텐션 기능을 확용하기로 결정했습니다.
JavaScript - 크롬 익스텐션 개발 용도
FastAPI - 가사 DB 및 AI 번역 개발 용도
-
크롬 익스텐션란에 있는 SyncManager 버튼을 눌러 다음 팝업창을 띄울 수 있습니다.
- 윈도우는 기본적으로 화면 우하단에서 생성되며 임의로 크기 및 위치를 조절할 수 있습니다.
-
DB에 존재하는 노래는 다음과 같이 싱크에 맞게 가사를 제공합니다.
- 뮤직바의 재생시각을 매우 빠르게 동기화하기 때문에 재생 위치를 옮겨도 가사가 정상적으로 출력됩니다.
- 소절이 존재하지 않는 빈 시간은 간단한 음표 이모지가 출력됩니다.
- DB에 존재하지 않는 노래는 따로 데이터가 없다고 표시합니다.
- 팝송은 DB에 foreign으로 분류돼 자동으로 한국어 문맥에 최대한 자연스럽게 번역됩니다.
- 영어 가사 하단에 한국어 가사가 같이 나오며 번역 AI는 Google Gemini를 사용했습니다.
여타 가사 제공 프로그램 특성 상 DB에 없는 노래는 가사 지원이 어렵습니다 😓
- 알송, musixmatch 등을 포함한 노래 프로그램들은 유저들의 가사 데이터 지원을 받고 수정해나갑니다.
- SyncManager도 커뮤니티 사이트를 만들어 유저들의 지원을 받고 있습니다.
등록 페이지
-
닉네임, 노래 언어타입, lrc 파일 업로드 기능이 있습니다.
- 언어 타입으로 AI 번역 지원 여부를 결정합니다.
추천 페이지
DB에 저장된 노래들의 가사들을 볼 수 있습니다.
- 가사글 및 싱크가 더 정확한 데이터를 추천, 비추천으로 구분합니다. (최다추천 가사채택은 미구현)
- 검색 기능으로 원하는 노래가 현재 DB에 있는지 조회 가능합니다.
SyncManager project image: an "S" shaped sync icon with two interlocking arrows.
SyncManager is a project we started to solve two different pain points our team members had at the same time.
- Siwoong: The web version of YouTube Music doesn’t support subtitle/lyrics sync, and it’s inconvenient to follow lyrics.
- Dongyeon: The PC version of Spotify doesn’t provide translated lyrics for English songs, which is disappointing.
Since both of us felt friction on the PC platform, we decided to leverage a Chrome Extension.
JavaScript - For Chrome Extension development
FastAPI - For the lyrics database and AI translation development
-
By clicking the SyncManager button in the Chrome extension toolbar, you can open the popup window below.
- The window is created at the bottom-right of the screen by default, and you can freely adjust its size and position.
-
For songs that exist in the DB, synced lyrics are provided as shown below.
- Because playback time is synchronized with the music bar extremely frequently, lyrics continue to display correctly even when you seek to a different position.
- For empty time ranges where no lyric line exists, a simple musical note emoji is shown.
- If the song does not exist in the DB, it is displayed as having no available data.
- English songs are classified as
foreignin the DB and are automatically translated to sound as natural as possible in Korean context. - Korean lyrics are displayed under the English lyrics, and Google Gemini is used as the translation AI.
Since lyrics services typically rely on DB coverage, songs not in the DB are hard to support 😓
- Many lyrics apps/programs (including ALSong and Musixmatch) continuously improve by accepting and refining user-contributed lyric data.
- SyncManager also provides a community website to receive user contributions.
Submission page
-
Includes nickname input, song language type selection, and LRC file upload.
- The language type determines whether AI translation support is enabled.
Recommendation page
You can browse the lyrics stored in the DB.
- Lyric posts and data with more accurate sync can be categorized via upvote/downvote. (Most-upvoted lyric adoption is not implemented yet.)
- You can search to check whether a song currently exists in the DB.
