devBlog
Design System 글 모음
기업 기술블로그의 Design System 관련 글 36개
달리는 기차 바퀴 칠하기: 7년만의 컬러 시스템 업데이트
토스의 디자인 시스템, TDS의 컬러 시스템을 7년 만에 전면 개편하며 마주했던 문제들과, 이를 해결하기 위해 토큰 시스템을 처음부터 다시 만들어간 과정을 공유합니다.
[디자인 시스템 어떻게 만들었어요?(2)] Radix Primitives와 Panda CSS로 유연하고 단단한 컴포넌트 만들기
2026년 버즈빌 디자인 스택, AI 전환을 준비하며
2026년은 버즈빌 디자인 팀에게 전환점이 되는 해입니다. 이제 도구 선택은 단순한 운영상의 결정이 아니라, 차세대 AI 기반 제품 개발을 지원할 수 있는 '코드와 연결된 통합 디자인 시스템'을 향한 전략적 행보입니다. 지난 몇 년간 버즈빌 디자인 팀은 철저한 디지털 다이어트를 감행했습니다. 군더더기를 걷어내고, 중복을 제거하고, 가장 결정적으로 Adobe…
[디자인 시스템 어떻게 만들었어요?(1)] 아이콘 라이브러리 만들기
Figma MCP로 프론트엔드 컴포넌트 자동 생성하기
작년 이맘때까지만 해도 프론트엔드 개발자가 AI를 사용하는 용도는 새로운 기술을 습득하거나 코드를 리팩터링하는 등 프롬프트를 기반으로 하는 코드 생성 작업이 대부분이었던 것 같은데요, MCP와 코딩 에이전트의 등장 후로는 훨씬 더 다양한 방식으로 AI를 활용할 수 있게 된 것 같습니다. AI의 활용 방법들 중 하나로, 이번 글에서는 Framelink…
Syrup 디자인시스템 개발: UX-FE로의 효과적인 핸드오프
왜 Design System이 필요한가? 개념부터 이해하기 다양한 환경에서 일관된 사용자 경험(UX)을 제공하는 것이 그 어느 때보다 중요해지고 있습니다. 하지만 디자인과 개발이 따로 움직이면, 스타일이 일치하지 않거나, UI/UX의 일관성이 부족해지고, 중복 작업이 늘어나는 등의 문제가 발생할 수 있습니다.이를 해결하는 방법이 바로 Design…
당신2 9하던 디자인 시스템? 0.5인 리소스로 효율적으로 구축하기
디자인 시스템 중 디자인 토큰을 여러 도구를 이용하여 자동화 하는 방법
…
프론트엔드팀의 디자인 시스템 재구축기
안녕하세요, 카카오스타일 지그재그 서비스 FE팀의 제이슨입니다. 2023년 초, 저희 팀은 비즈니스와 더불어 기술적인 개선이 필요하다는 것을 느꼈습니다. 그중에서도 특히 여러 지면에서 독립적으로 관리되고 있던 상품 카드 컴포넌트의 일원화 작업이 중요하게 여겨졌고. 이 문제를 해결하기 위해서는 단순 리팩토링을 넘어, 팀 전체의 UI/UX를 통합적으로 관리할 수 있는 디자인 시스템의 재구축이 필요하다고 판단했습니다.
OLEA? Storybook을 활용한 올리브영의 디자인 시스템!
안녕하세요! 올리브영에서 라이브관과 매거진관을 담당하고 있는 몌으니입니다🦦💙 올리브영의 백오피스(BackOffice)시스템(이하 BO)에 Storybook…
디자인 시스템, 디자인과 코드의 간극 줄이기
안녕하세요, 에잇퍼센트 웹 프론트엔드 팀의 김민정입니다. 프론트엔드 팀은 사내 EDS(Eight Design System)를 적용한 웹 서비스를 효율적으로 구현하기 위해 팀 내 UI 라이브러리인 eds-wc를 제공하고 있습니다. 디자인 팀과 프론트엔드 팀이 협업하여 디자인 시스템을 구현하는 과정에서는 고려할 사항이 매우 많습니다. 특히, 명세에 대해 디자이너와 개발자 간 이해의 차이로 인한 반복적인 커뮤니케이션은 대부분 경험하였을 것입니다. 또
Figma 플러그인, 디자이너가 직접 만들어 보기
Figma는 기존의 다른 툴과 비교했을 때 가볍고 다양한 플러그인을 업무에 적용할 수 있다는 장점이 있습니다. 이 글은 디자이너 시각으로 Figma의 장점을 업무에 적용하는 과정에서 ChatGPT와 Figma 공식 문서를 참고해 Figma 플러그인을 제작한 경험을 공유합니다. The post Figma 플러그인, 디자이너가 직접 만들어 보기 appeared first on 넷마블 기술 블로그.
사내 디자인 시스템 실패기 Part 1
사내 디자인시스템 개발 및 적용 실패기 Part1 : 설계/디자인 회고
Vibrant Design System 과 함께하는 크로스 플랫폼 개발기
Server Driven UI 설계를 통한 UI 유연화
웹과 달리 네이티브 모바일 앱은 빌드, 배포 후에는 수정이 불가능합니다. 만약 잘못된 위치에 버튼을 배치한 채로 스토어에 앱을 배포했다면, 그리고 사용자가 잘못된 버전의 앱을 설치했다면 버튼의 위치를 수정할 방법이 없습니다. 유일한 방법은 사용자가 스스로 스토어에 들어가 수정된 버전의 앱으로 업데이트하는 것 뿐입니다. 배포 후 수정이 불가능하다는 특성이 부딪히는 또 다른 상황은 A/B 테스트입니다. 소프트웨어를 사용하는 동안 일어나는 사용자의
디자인 시스템을 만들때 마주하는 고민사항 23가지와 32개 팁.
Figma 로 디자인하기
이 글은 피그마(Figma)를 이용한 온라인 홈트레이닝 서비스 콰트(QUAT)를 디자인하며 느낌점을 정리한 글입니다. 글을 시작하며 안녕하세요. 엔라이즈 프로덕트 디자이너 허형구입니다. 엔라이즈 디자인 시스템에 대한 글을 오랜만에 쓰게 되었습니다. 과거 포토샵에서 스케치로 전환하는 과정에 대한 글을 쓴 적이 있습니다.
페이지 2 / 2 (총 36개)