Velopers
모든 블로그
SK플래닛

SK플래닛

도메인techtopic.skplanet.com
주요 카테고리 AI · 프론트엔드

활동 요약

대표 인기 포스트2025 하반기 NEW! 기술 세미나 & 컨퍼런스 일정 정리! (ver.250713)495 조회
최근 30일
0개
평균 조회
65
누적 조회
4,647
전체 글
71개
마지막 발행
2026. 10. 14.
블로그 방문

SK플래닛 기술 블로그 글 (12)

프론트엔드

증강현실 기반 마케팅 솔루션 'play AR'을 소개합니다(feat. '춘식이는 홈런왕')

SK플래닛의 Web AR 마케팅 플랫폼 play AR과 전환 배경, 구현 기술을 소개했습니다. 앱 설치 없이 QR 스캔으로 접근성을 높이고 다양한 이벤트 템플릿을 제공했습니다.

#AR#Web AR#Vue.js
4500

프론트엔드

Chat DIC - 대화형 LLM 서비스의 프런트엔드 성능 개선기

Chat DIC 프런트엔드에서 SSE로 LLM 응답을 실시간 스트리밍하도록 구현했습니다. 버퍼와 Windowing을 적용해 비활성 탭 지연과 긴 대화 성능 저하를 개선했습니다.

#React#JavaScript#SSE
14800

프론트엔드

ChatGPT 질문 내역 바로보기 (익스텐션 개발기)

ChatGPT 대화가 길어질수록 이전 질문을 찾기 어려운 문제를 크롬 익스텐션으로 개선했습니다. 질문 모음 UI와 바로가기 기능으로 히스토리 탐색을 쉽게 만들었습니다.

#ChatGPT#Chrome Extension#UI/UX
12100

프론트엔드

[Figma MCP]를 활용한 효율적인 UI 컴포넌트 개발 및 실제 적용 경험을 공유합니다

Figma MCP를 Cursor와 연동해 디자인 시안을 React/Vue 컴포넌트로 옮긴 경험을 공유했습니다. 실제 업무에서 개발 시간을 줄이고 세부 튜닝에 집중한 사례를 소개했습니다.

#Figma#MCP#Cursor
15700

프론트엔드

[Syrup 디자인 시스템] 개발: UX에서 FE로의 효과적인 핸드오프

디자인 시스템을 통해 UX와 FE 간 Hand-off를 표준화하고 협업 효율을 높인 사례를 설명했습니다. Figma, Token, Storybook, NPM을 연결해 일관성과 재사용성을 강화하는 과정도 다뤘습니다.

#디자인 시스템#Storybook#Figma
3800

프론트엔드

Syrup Design System 개발 : UX에서 Front-End로의 효과적인 Hand-off

Syrup Design System은 UX와 프론트엔드를 하나의 기준으로 연결해 Hand-off 효율을 높였습니다. Storybook, Token, NPM 배포를 통해 일관성과 재사용성을 강화했습니다.

#디자인 시스템#UI/UX#Storybook
5500

프론트엔드

로딩 스피너는 이제 그만! UPTN Station UX 개선 사례

스피너 대신 스켈레톤, Transition, Tanstack-Query를 활용해 웹앱 UX를 개선한 사례를 소개했습니다. 상황에 따라 로딩 UI를 다르게 적용해 체감 속도와 개발 생산성을 함께 높였습니다.

#Vue.js#SSR#Tanstack-Query
4300

프론트엔드

웹앱 사용자 경험을 개선하는 기술 한 스푼

웹앱의 로딩 경험을 개선하기 위해 스피너, 스켈레톤, 전환 애니메이션, Tanstack-Query를 도입한 사례를 소개했습니다. 화면 특성과 지연 시간에 따라 로딩 방식을 나누고 공통 컴포넌트로 구현 비용을 줄인 점이 핵심입니다.

#UI/UX#스켈레톤 UI#SSR
5700

프론트엔드

Syrup 모바일 웹 속도 개선기: WebFlux, SSE, 그리고 Next.js

Syrup 모바일 웹의 응답 속도를 개선하기 위해 WebFlux, SSE, Next.js를 적용했습니다. 그 결과 API 요청과 응답 지연을 줄이고 초기 로딩 속도도 향상했습니다.

#WebFlux#SSE#Next.js
4000

프론트엔드

Syrup 모바일 웹 개선 사례

Syrup 모바일 웹의 느린 응답 문제를 해결하기 위해 웹 게이트웨이를 WebFlux와 SSE 중심으로 개편했습니다. 또한 Next.js의 SSG를 적용해 초기 로딩과 운영 효율을 함께 개선했습니다.

#WebFlux#SSE#Next.js
3300

프론트엔드

돈 버는 커뮤니티, OK캐쉬백 오글오글의 UX/UI 이야기

OK캐쉬백 미션 게시판을 포인트 기반 커뮤니티 오글오글로 리브랜딩한 UX/UI 사례를 공유했습니다. 보상, 미션, 리액션, C2C 구조로 참여를 유도했고 베타 오픈 후 활동 지표도 개선했습니다.

#UX/UI#커뮤니티#포인트
3100

프론트엔드

iOS 환경에서 비디오 최적화 및 성능 개선 사례

iOS 15 이후 비디오 전환 시 발생한 깜박임과 사이즈 튐 문제를 분석하고 해결한 사례입니다. 썸네일, 로딩 상태, object-fit, 버전별 분기를 조정해 자연스러운 전환을 구현했습니다.

#iOS#object-fit#CSS
3500