반응형 분류 전체보기39 우버 디자이너가 Figma에서 256개의 새로운 디자인 시스템 구성 요소를 프로그래밍 방식으로 구축한 방법 Uber의 Base 디자인 시스템은 Uber 제품 전반에 걸쳐 광범위하게 사용되는 일련의 지도 마커 컴포넌트를 제공하며, 사용자에게 지도를 제공할 때마다 표시된다. 우리는 최근, 지도 마커에 추가 컨텍스트를 표시해야 할 필요성을 알게 되었다. 이를 달성하기 위해 기존 기본 컴포넌트인 배지를 추가하기로 결정했다. 문제는 지도 마커와 배지에 다양한 변형이 있다는 것이었다. 마커는 크기, 바늘 길이, 아이콘 슬롯 및 레이아웃 동작에 따라 사용자 지정할 수 있으며 배지는 여러 크기, 레이블 및 아이콘 스타일을 가질 수 있었다. 배지를 지원하는 지도 마커의 최종 세트는 이러한 모든 옵션의 조합으로 총 256개의 새로운 컴포넌트를 만들어야 했다. 일반적인 접근 방식은 디자이너가 이러한 새 컴포넌트를 수동으로 생성하.. 2022. 3. 30. 고정 UI 요소를 디자인할 때 고려해야 할 사항 고정 요소는 무엇인가? 고정 요소는 페이지를 아래로 스크롤 할 때 브라우저 뷰포트 내에서 고정된 위치에 유지되는 모든 것이다. 일반적으로 고정 네비게이션에 사용되며, 상단에 고정되어 페이지를 탐색할 때 항상 표시된다. 화면 우측 하단에 고정되어있는 채팅 도움말을 본 적 있을 수도 있다. 어떤 문제를 일으킬 수 있을까? 어떤 한 요소를 지속적으로 표시하면, 주의가 산만해져서 유저가 찾고 있는 콘텐츠에 집중하기 더 어려워질 수 있다. 고정 요소도 마찬가지다. 화면에 클릭 유도 문구가 있어도, 고정된 채팅 아이콘이 화면 위에 있는 경우라면 그것을 놓칠 수도 있다. 이 문제는 키보드 네비게이션을 고려하거나, 고정 요소에 의해 집중되어야 하는 컨텐츠가 가려질 때 상황을 더욱 악화시킨다. 종종 간과되는 고정 요소의.. 2022. 3. 11. Figma의 인터랙티브 컴포넌트 기능 이해하기 Figma는 요즘 많은 신기능 개발에 박차를 가하고 있다. 그 중 내가 주목하는 것은 인터랙티브 컴포넌트다. 이 기능에 의해, 재이용 가능한 인터랙티브 컴포넌트를 빠르게 조립해 클릭 가능한 프로토타입으로 디자인에 생명을 불어넣을 수 있다. 이 기능이 개발되기 전에는 인터랙티브 프로토타입을 만들 수 있었지만, 인터랙티브 기능을 보여주기 위해 여러 프레임을 복제하고 조정하는 데 많은 노력이 필요했다. 업데이트를 할 때 효율적인 프로세스가 아니라고 할 수 있다. 신기능의 차이는컴포넌트 수준에서 Variants 간 인터랙션을 정의할 수 있다는 것이다. 그런 다음 이러한 인터랙션은 컴포넌트에 새겨져, 컴포넌트의 모든 인스턴스에서 사용할 수 있다. 이전에는 전체 프레임을 연결하여 프로토타입을 만들었다. 그 후 F.. 2022. 3. 9. Google I/O 2021 후기 - Material Design 중심 2020년 코로나로 인해 취소되었던 Google I/O가 Android 12와 함께 돌아왔다.(정말 반가움..) 디자이너로서 가장 눈에 띄었던 이슈는 역시나 'Material You'이다. 2014년 5.0Lollipop이 출시된 후 가장 큰 변화인데, 콘텐츠의 개인화를 뛰어넘어 디자인 시스템 자체를 개인화된 접근 방식으로 구축할 수 있다. 이는 디자인 시스템의 의미가 프로세스 효율성 추구를 넘어서 개인적, 개별적으로 운용하고 유연하게 확장성까지 고려할 수 있음을 보여준다. 따라서 사용자를 공동 제작자로 보고, 더 많은 표현과 개인 디바이스 제어에 대한 사용자들의 니즈를 반영했다. 색상과 쉐입, 빛과 모션에 이르기까지 그들의 전체적인 경험을 재고한다. 이를 What's new in Material Des.. 2021. 5. 24. 2020 디자인 코리아 국제 컨퍼런스 - Design Beyond Data: 디자인, 데이터를 그리다 후기 팬데믹 위기 속에서 새로운 문화로 자리 잡은 디지택트 시대를 맞아 온라인 행사들이 늘어나고 있다. 그중, 11월 19일 오후 1시부터 온라인 스트리밍 방식으로 개최되었던 디자인코리아 페스티벌(DKfestival) 국제디자인컨퍼런스에 참석했다. 한 달 전 정도부터 참가자 온라인 접수를 진행하였고, 행사 당일 메일로 온 링크를 통해 접속할 수 있었다. 그런데 이런 과정 없이도 홈페이지 가면 바로 영상을 볼 수 있었음.. 머쓱 203 인포그래픽연구소 장성환 대표님은 1965년 이후 급속도로 증가하는 빅 데이터와 인포그래픽을 언급하며, '정보와 디자인이 만날 때 행동으로 이어지게 한다. 데이터가 시각화되기 시작하고 변화하는 단계에서 좋은 인포그래픽은 정보를 이해하기 쉽게 하고, 매력적으로 행동과 실천 유도하는 .. 2020. 11. 19. 문래│문래창작촌 웨이브스 (Waves), 애프터워크클럽 (After work club) " 웨이브스(Waves) / 애프터워크클럽 (after work club) 요새 문래가 그렇게 핫하다면서요? 👀 운전면허학원 학과수업 마치고 찾은 문래스 몇 개의 저녁 후보 중에 추리고 추려 정한 웨이브스 a.k.a 문래의 하와이라고 정평이 나있길래 기대 기대 가게를 찾아가는 골목골목이 성수동과 비슷하지만, 문래만의 느낌을 풍겼다. 식물, 파도와 서핑보드! 가게 외관부터 하와이 냄새 폴폴 조각가로 활동하시던 분이 신혼여행지였던 하와이를 모티브로 만드셨다고 한다. 인사이트 짱짱맨 역시나 내부도 곳곳에서 느껴지는 하와이 바이브 우리는 오후 6시 20분쯤 도착했는데, 다행히 웨이팅이 없었다. (먹고 나올 쯤엔 줄줄이 소시지처럼 웨이팅이..) 좌석이 편안하지는 않았지만, 그런대로 분위기 따라 맛 따라 앉을만했다.. 2020. 11. 14. 이전 1 2 3 4 5 ··· 7 다음
