archuive

디자인 토큰을 서드파티가 아니라 퍼스트파티 기능으로 사용하구싶다..! Design Tokens 훌륭한 플러그인! 하지만 디자인 토큰은 디자인 파운데이션을 전부 다 흔들어야하는 작업이라 플러그인이기 때문에, 피그마가 급격히 변화하기 때문에, 쉽게 손대기가 망설여지는 부분이다. 관련해서 피그마 커뮤니티에서 논의중인 토픽: Design Token support in Figma Design Token support in Figma We have been managing our design system(s) for Desktop, Mobile, and TV applications in Figma for some time now and the experience overall has been great (espec..

SpaceOne의 디자인 시스템은 Figma를 적극적으로 활용하여 작업 효율성을 극대화시키고 있습니다. Component에 properties 활용도가 굉장히 높은데, 활용성을 더 증가시키기 위한 중첩 컴포넌트를 만들 경우 컴포넌트 하위에 중첩되어있는 컴포넌트들에 설정된 프로퍼티 속성들에 접근하기 어렵다는 문제가 있었습니다. 이러한 문제점들을 감안하고라도 중첩 컴포넌트가 가진 장점을 포기할 수 없어 중첩 컴포넌트를 사용하고 있었는데, 피그마에서 이 중첩 컴포넌트를 상위 컴포넌트에서 제어할 수 있는 기능을 베타 런칭했습니다! 유저들은 간단한 설정만으로 베타 기능을 사용해볼 수 있습니다. 1. 베타로 지원하는 기능 사용하려면? 컴포넌트를 선택한 뒤 좌측 패널에서 설정 버튼을 클릭. Component prop..

개발자 혹은 다른 작업자들에게 피그마 파일을 공유했는데, 그들이 이미지나 에셋을 추출하지 못한다고 할 때 두가지를 확인해야합니다. 1. 에셋에 Export 설정을 했는가? 2. 파일 자체에서 복사나 공유가 제한되어있지 않은가? 이 중에서 2번, "파일에서 복사 및 공유가 제한된 경우" 해결 방법을 알아봅니다. 파일 복사 및 공유가 제한되면 can edit 권한을 가진 작업자들의 Inspect 패널에 "Export disabled - This file's editor has disabled exporting, copying, and charing" 메시지가 뜹니다. 이런 경우, 파일의 공유 설정이 제한되어있으니 설정에서 간단하게 해결할 수 있습니다. 파일 우측 상단의 share 버튼 클릭 팝업 오른쪽 하..

Dark mode, 다크 모드 피그마 데스크탑과 웹 모두 다크모드 지원. https://bit.ly/39bdarm Redesigned auto layout, 오토 레이아웃 재설계 이제 오토 레이아웃이 더욱 강력하면서 훨씬 간편해졌습니다. 새로운 것들은 아래와 같아요. → Properties 패널 → 캔버스에서 바로 조작 가능 → Layout 옵션 (absolute position, negative spacing 등!) https://bit.ly/3L0TfZk Component properties, 컴포넌트 속성https://bit.ly/3N5TyUg 컴포넌트에 빌트인 텍스트, 부울린을 추가하거나 인스턴스 커스터마이징이 가능합니다. 디자인 시스템을 심플하게 만들고 개발에 전달하는 과정을 더 유연하게 가져갈..

빠져드는 디자인 옵스. 이번에는 Rachel Posman의 A Pocket Guide to Design Operations 를 번역하고 읽어보았습니다. 다음은 Design Operations에 관심이 있거나 처음 접하는 사람들로부터 가장 많이 받는 질문 중 8가지에 대한 답변입니다. 1. 디자인옵스란? “우리 제품에서 훌륭한 경험을 하고 싶다면 우리는 만드는 경험에 대해 기분이 좋아야 합니다.” “If we want to make great experiences in our products, we have to feel great about the experience of making.” — Miles Orkin 디자인 운영 실무자는 제작 경험이 경험을 만드는 것만큼 중요하다는 것을 이해합니다. 디자인 ..

디자인옵스 대체 뭐지? 빠져든다 싶어서 계속 번역해보는 디자인옵스란?ㅎㅎ 요약: 디자인에 대한 조직의 투자 가치를 증폭하는 데 도움이 되는 DesignOps 요소 디지털 붐의 많은 방법론과 마찬가지로 DesignOps는 "순간"을 보내고 있습니다. 디자인옵스가 무엇인가요? DesignOps는 개인, 프로세스 및 도구의 오케스트레이션을 지원하여 창의성과 영향력을 대규모로 증폭하는 보다 강력한 디자인 팀을 구축하기 위한 인간 중심 접근 방식입니다. 민첩하고 반복적인 접근 방식으로 개발 프로세스를 혁신한 DevOps와 마찬가지로 DesignOps를 사용하면 조직이 팀 전체에서 설계 프로세스를 빠르게 확장하고 반복할 수 있습니다. 지금 DesignOps가 중요한 이유는 무엇입니까? 오늘날 조직은 보다 의미 있는..

요약: 디자인 운영(Design Operations)의 실무는 디자이너가 일관되고 품질 높은 디자인을 만들 수 있도록 지원하는 프로세스와 측정(조치)에 초점을 맞춥니다. DesignOps란 무엇인가? 정의: DesignOps는 대규모로 디자인의 가치와 영향력을 증폭시키기 위해 구성원, 프로세스 및 기술의 조정 및 최적화를 의미합니다. DesignOps는 다음과 같은 과제를 해결합니다. 성장하고 발전하는 디자인 팀 적절한 기술을 가진 사람들을 찾고 고용하는 것 효율적인 워크플로우 생성 디자인 결과의 품질과 영향 개선 DesignOps의 목표는 이러한 과제에 대해 확장 가능한 솔루션을 지원하는 프로세스와 조치를 수립해 디자이너가 디자인 및 리서치에 집중할 수 있도록 하는 것입니다. 모든 분야는 규모가 커짐에..

요약: DesignOps 팀의 구조는 팀의 특정 과제와 요구로부터 출발해야 합니다. 이러한 팀 구조는 DesignOps 팀을 지원할 수 있는 다양한 접근 방식을 보여줍니다. DesignOps는 일관되고 품질 높은 디자인을 가능하게 하는 것과 관련된 많은 요소들이 있기 때문에 광대한 기회를 가지고 있습니다. 조직이 DesignOps 실무에서 중점을 두는 것은 해당 조직의 요구와 목표가 반영된 것이어야 하며, 또한 DesignOps 팀이나 역할에 대한 해당 실무 구조도 반영해야 합니다. 이 기사에서는 DesignOps 팀의 일반적인 5가지 유형의 구조에 대해 설명합니다. 적합한 구조는 회사마다 정형화된 DesignOps 프로그램에 대한 전반적인 조직 구조, 목표 및 요구 수준에 따라 달라지며, 따라서 어디에..

수직 네비게이션에 대한 아티클을 읽다가 도무지 content-to-chrome 이라는 문구가 이해되지 않아 이 내용을 상세히 기술한 아티클에 도전한다. 들어가기 전, Chrome. 크롬이 도대체 무엇인가를 먼저 정의해야겠다. Chrome is the visual design elements that give users information about or commands to operate on the screen's content (as opposed to being part of that content). These design elements are provided by the underlying system — whether it be an operating system, a website, or..

역시 UX명가 닐슨노먼그룹 답게, 굉장히 좋은 아티클을 찾았다. 뼈에 새기기위해 직접 번역한 아티클! 원제: 데스크톱의 왼쪽 왼쪽 세로 네비게이션: 확장 가능하고, 응답성이 뛰어나며, 스캔이 간편. (Left-Side Vertical Navigation on Desktop: Scalable, Responsive, and Easy to Scan) TL;DR: 세로 내비게이션은 광범위(broad)하거나 성장하는 IA에 적합하지만, 가로 내비게이션보다 더 많은 공간을 차지한다. 왼쪽 정렬, 키워드 전면 로드 및 가시성이 있는지 확인해야한다. Information Architecture에 대한 UX 컨퍼런스 과정에서 광범위한 계층 구조(broad hierarchies)에 대해 이야기할 때마다 다음과 같은 두개 ..