FEConf 2025 [B4] 음성 인터페이스 개발에서 DX 향상하기: 모델 비교부터 직관적인 인터페이스 설계
FEConf 2025 B트랙 · YouTube
AI 핵심 요약
음성 채팅과 실시간 대화 기능을 프로토타이핑하며 Web Speech API의 브라우저·기기 호환성 한계와 모델 교체 때마다 반복되는 코드 수정 문제를 겪었다. 이를 보완하기 위해 Google Cloud STT와 네이버 클로바 등 클라우드 모델을 검토하고, 전략 패턴과 팩토리 패턴으로 STT·TTS 엔진을 교체할 수 있는 인터페이스를 설계했다. React 커스텀 훅으로 필요한 상태와 동작을 분리하고 비동기 상태를 시각화해 재사용성과 디버깅 편의성을 높였다. 발화 종료 판단처럼 기술만으로 해결하기 어려운 문제에는 푸시 투 토크와 응답 중 사용자 개입을 허용하는 UX로 대응했으며, 유연한 인터페이스 설계가 개발 생산성과 사용자 경험 모두에 중요하다고 설명했다.
- 브라우저 Web Speech API는 구현이 간편하지만 브라우저·기기별 지원 차이가 있어 실제 대상 환경에서 호환성을 검증해야 합니다.
- STT와 TTS 엔진은 공통 생명주기를 인터페이스로 정의하고, 전략 패턴과 팩토리 패턴으로 교체와 추가를 분리할 수 있습니다.
- React 커스텀 훅에는 필요한 동작과 상태만 노출하고, STT·TTS 및 UI의 책임을 나누면 의존성과 인지 부담을 줄일 수 있습니다.
- 비동기 상태와 처리 시간을 시각화하면 모델별 동작을 파악하고 디버깅하기 쉬워집니다.
- 발화 종료 시점을 정확히 판단하기 어려운 경우에는 침묵 시간을 조정하는 데 그치지 말고, 푸시 투 토크처럼 사용자가 제어하는 입력 방식도 고려하세요.
소개
FEConf 2025 2025.8.23 11:00 ~ 17:40 세종대학교 광개토관 컨벤션센터 TRACK B-4 음성 인터페이스 개발에서 DX 향상하기: 모델 비교부터 직관적인 인터페이스 설계 김민수 | DevCra 음성 인식, 합성의 최근 기술 동향을 살펴보고 종합 핵심 키워드를 파악합니다. 음성 인터페이스를 만들기 위한 요구사항 분석 및 기술 검토부터 어떻게 구현할 수 있을지 고민해보고 Web API의 한계, 다양한 클라우드 서비스 모델 중 적합한 모델을 선택하기 위해 디자인 패턴을 활용했던 설계를 소개합니다. 그리고 좋은 사용자 경험을 제공하기 위해 에러 처리, 사용성을 고려한 엔지니어링, 유틸리티 등 경험을 공유합니다.
비슷한 학습 자료
컨퍼런스 if kakao
Preview AI_2 @if(kakao)2021
컨퍼런스 if kakao
if (kakao) 2021 컨퍼런스에서 AI 관련 기술 발표 세션을 소개합니다. 1. AI 장면 분석을 통한 비디오 인코딩 최적화 @darren.thkim 동영상 인코딩을 위한 최적의 설정을 어떻게 찾을 수 있을까요? AI를 활용한 인코딩 최적화의 실제 사례를 중심으로 최적화와 분산 인코딩에 대해서 알아봅시다. 2. DFerence, 클라우드 기반 AI 서빙 플랫폼 @bran.p 맨땅에서부터 k8s를 사용하여 GPU shared inference Platform 을 만든 과정에서 얻은 경험과 지식을 공유합니다. 3. 카카오엔터프라이즈 딥러닝 음성 합성 기술 @jeff.rey @taylor.martin @satoshi.2020 카카오엔터프라이즈에서는 더욱 자연스럽고 고품질의 음성을 만들어내기 위한 음향 모델과 보코더 기술을 개발하였습니다. 또한, 보다 사람 같은 음성합성을 위한 스타일 변환 기술도 소개합니다. 4. Tips for transfer learning @mic...
데브옵스 · 인프라 딥러닝 · 머신러닝 컴퓨터 비전
컨퍼런스 DAN 2025
[팀네이버 컨퍼런스 DAN25] 생성형 UI와 에이전틱 UX 리서치, AI 네이티브 디자인 프로세스의 가능성 기존 UX 디자인과 리서치 방식은 개인화된 사용자 특성과 빠르게 변화하는 AI 환경을 반영하기 어려웠습니다. 본 세션에서는 UI 디자인과 UX 리서치 과정에 AI를 접목해 새로운 디자인 프로세스를 실험한 경험을 공유합니다. Telecast(생성형 UI 플랫폼)와 EchoX(AI 페르소나 기반 UX 리서치 시스템)를 직접 구현하며, 디자이너들이 AI와 함께 도구를 만들고 역량을 확장해 나간 과정을 다룹니다. 이 과정에서 AI를 통해 UX 디자이너와 리서처의 역할과 협업 방식을 어떻게 재발견하게 되었는지, 그리고 앞으로 디자인 프로세스를 어떻게 재정의해 나갈 수 있을지 경험을 공유합니다. 목차 1. 기존의 디자인 프로세스와 자동화 시도 - 복잡함이 더해지는 사용환경 - AI 코딩을 활용한 작업 자동화 시도 경험 2. Telecast: Generative...
AI 코딩 UI/UX
컨퍼런스 SpringCamp 2025
스프링캠프 2025 [Track 2] 2. Amazon Q Developer와 함께 하는 생성형 AI시대 헤쳐나가기! (이상현)
컨퍼런스 SpringCamp 2025
🎙️ 이상현 (AWS) 🗓️ 스프링캠프 2025 Track 2 - 2 (2025년 06월 28일) 🧭 스페이스쉐어 삼성 📂 발표자료 : https://github.com/springcamp/presentations/tree/main/SpringCamp-2025-Presentations [🔗 스프링캠프 & KSUG] 스프링캠프 2025 웹 https://springcamp.ksug.org/2025/ 스프링캠프 페이스북 https://www.facebook.com/springcampkr/ 스프링캠프 유튜브 https://www.youtube.com/@springcampkr KSUG 웹 https://www.ksug.org/ KSUG 구글 그룹 https://groups.google.com/g/ksug KSUG 페이스북 https://www.facebook.com/groups/springkorea KSUG 유튜브 https://www.youtube.com/@wo...
AI 코딩 개발 도구
컨퍼런스 FEConf 2025 A트랙
FEConf 2025 [A4] 완전한 ZERO COST CSS-IN-JS, Devup-UI
컨퍼런스 FEConf 2025 A트랙
FEConf 2025 2025.8.23 11:00 ~ 17:40 세종대학교 광개토관 컨벤션센터 TRACK A-4 완전한 ZERO COST CSS-IN-JS, Devup-UI 오정민 | ㈜데브파이브 정말 티끌 하나도 코스트가 없는 CSS-in-JS 라이브러리 Devup-UI! 그러면서 반응형, 선택자, 테마까지 많은 기능을 제공하는 Devup-UI는 어떻게 이런 성능과 기능들을 모두 제공할 수 있을까? Next.js 의 서버컴포넌트 도입으로 하락세를 겪고 있는 CSS-in-JS 라이브러리에 대한 완벽한 대안기능 구현에 대한 아이디어부터 Rust와 웹 어셈블리를 통하여 개발하게 된 개발기 그리고 실제 작동까지! 어떤 라이브러리 보다 효율적이고(심지어 Tailwind CSS보다도!) 성능 이슈가 전혀 없는 완벽한 해결법을 향한 여정을 공유드립니다.
웹 개발 프론트엔드
컨퍼런스 FEConf 2025 B트랙
FEConf 2025 [B3] 중요하지만 긴급하지 않은 일, 그럼에도 계획해야 하는 웹 접근성
컨퍼런스 FEConf 2025 B트랙
FEConf 2025 2025.8.23 11:00 ~ 17:40 세종대학교 광개토관 컨벤션센터 TRACK B-3 중요하지만 긴급하지 않은 일, 그럼에도 계획해야 하는 웹 접근성 김무훈 | A11YKR 커뮤니티 모든 사람을 위한 웹 접근성 지원과 설계, 제대로 알아봅시다. 웹 프런트엔드 서비스에서 접근성 지원은 여전히 제도적으로 의무화된 항공사 웹 서비스와 정부/공공기관 외에 모범 사례가 흔치 않고, 확실한 정답이 정해져 있지 않은 분야입니다. - 혹시 웹 접근성이 장애 사용자만을 위한 특수한 경험이라고 오해하고 계신가요? 웹의 본연의 힘은 보편성에 있습니다. 장애와 관계없이 모든 사람의 콘텐츠 접근은 필수적이라고 생각합니다. - 웹 접근성을 지원하기 위한 UI 컴포넌트 설계에 막연함을 느끼시나요? 웹 접근성 표준을 준수하면서, 일관된 UI 제어 경험을 어떻게 설계할 수 있는지 제가 고려했던 사항을 소개합니다. 따라서 아래 명제에 대한 발표자의 생각이 궁금하시면 꼭 보러 와주세...
프론트엔드 UI/UX
컨퍼런스 FEConf 2025 B트랙
FEConf 2025 [B6] 그리드 기반 웹 에디터 / 빌더 구현기
컨퍼런스 FEConf 2025 B트랙
FEConf 2025 2025.8.23 11:00 ~ 17:40 세종대학교 광개토관 컨벤션센터 TRACK B-6 그리드 기반 웹 에디터 / 빌더 구현기 이선협 | 마플코퍼레이션 그리드 기반 에디터는 웹에 최적화된 자유도를 가진 에디터입니다. 이런 장점을 기반으로 노코드 웹사이트 제작, 사용자 정의 대시보드 등 다양한 제품에서 사용할 수 있습니다. 대표적으로 Squarespace, 큐샵과 같은 서비스에서도 사용하고 있습니다. 본 발표에선 그리드 기반 에디터에 대한 소개와 구현 전략, 구현 시 주의할 점에 대해 다룹니다.
웹 개발 프론트엔드