게시글
[브런치 04]
디자인 시스템 파운데이션 설계 시 고려해 볼만한 웹 접근성 기준에 대한 브런치 글을 발행했습니다! 관심 있으신 분들은 한 번씩 들러주세요 :)
https://brunch.co.kr/@ehdms27/4
[브런치 03]
가볍게 디자인 시스템을 도입하기 위한 개인적인 경험을 브런치로 작성했습니다. 관심있으시다면 가볍게 읽어주세요 🤓
https://brunch.co.kr/@ehdms27/3
뒤로 가기 버튼에 대해 고민하다 알게 된 내용
뒤로 가기의 종류
- 하이어라키 백: 하위에서 상위로 돌아가는 것
- 히스토리 백: 현재 경로에서 역순으로 되돌아가는 것
단순 '뒤로 가기' 버튼을 넣는 것이 아니라 기능 전체를 고려했을 때 화면에서 어떤 뒤로 가기를 제공하는 것이 유용할지 고민할 필요가 있다.
제품 디자이너를 위한 애니메이션 툴, Phase
새로운 툴을 발견해 공유한다.
프로덕트 디자이너인 나는 제품에 들어가는 이미지 모션 제작을 위해 종종 에프터이펙트를 사용하곤 했는데, 피그마를 사용하며 어도비 사용이 현저히 준 지금 에프터 이펙트를 위해 어도비 요금을 지불하는게 아깝다는 생각이 들었었다.
그 와중에 발견한 제품 디자이너를 위한 무료 애니메...
[모두를 위한 디자인 UD]
Skip Navigation(건너뛰기 링크)
: 스크린 리더기를 이용해 웹 페이지를 귀로 듣는 저시력자분들을 위한 기능으로 반복되는 메뉴를 들어야 하는 문제를 해결하기 위해 핵심 콘텐츠로 바로 넘어갈 수 있는 링크를 제공하는 기능
웹 접근성 준수를 위해 챙겨야 하지만, 놓치기 쉬운 부분이니 고려하기!
피그마 커뮤니티에는 좋은 자료들(빅테크 디자인 시스템 파일 등)이 많이 있는데, 최근에 발견한 유용한 파일을 공유합니다.
이미지 등 비율 유지가 필요할 때 비율을 유지할 수 있는 컴포넌트를 제공하고 있는데, 다양한 비율에 맞는 베리언츠를 제공해서 컴포넌트 제작 시 유용하게 사용할 수 있습니다. 특히, 커머스에서 자주 사용하는 카드 컴포넌트 제작 시 카드...
[배민 우아콘 우아한 공방]
배민 우아콘에서 배민의 디자인 시스템 우아한 공방에 대한 내용 중 인상 깊었던 점을 기록한다.
- 파운데이션 + 코어 컴포넌트 : 클레이
- 재료가 되는 클레이를 가지고 사업 성격(B2C, B2B)에 따라 UI에 사용하는 메인 컬러인 민트, 블루로 구분 : 클레이 민트, 클레이 블루
- 클레이를 가지고 도메인을 구성하는 ...
[의미있는 회의하기]
대부분 직장인의 워킹 타임은 하루 기준 8시간이다. 하지만 8시간 모두 task 단위의 업무를 하는데 쓰이냐고 한다면 아닌 경우가 더 많을 것 같다. 나의 경우에 동료들과 대화, 업무 관련 질의응답, 메신저 확인 같은 시간을 모두 제외한다면 하루 평균 6시간 정도의 일할 시간이 남을 것 같다.
하지만 여기서 하루에 평균 2-3건의...
[모두를 위한 디자인 UD]
저시력자, 고령자 등도 인식할 수 있도록 텍스트 콘텐츠와 배경 색의 명도 대비가 4.5:1 이상이어야 정보 접근성 기준을 준수할 수 있다.
해당 기준을 만족하기 위해 디자인 시스템 내 컴포넌트 점검 중 배경 컬러가 transparent인 경우를 유의할 필요가 있다는 걸 알게됐다. 예를 들어 badge나 button 같은 경우...
[가짜 계획]
우연히 보게 된 김경일 아주대 심리학 교수님의 세바시 강연에서 인상 깊었던 내용을 공유한다.
계획에 대해 누군가 결과를 물었을 때 두 가지 유형의 답변이 있다.
1) 했다, 못했다 2) 몇 퍼센트 했다
1번 답변을 하는 경우 계획이 아닌 ‘목표’만 세웠을 가능성이 높다.
2번 답변의 경우 본인의 목표를 잘게 나눠 진짜 계획을 가지고 ...
[모두를 위한 디자인 UD]
웹 접근성 준수를 위해 웹 내 사용한 이미지에는 Alt text(대체 텍스트)를 제공해야 한다. Alt Text란 Alternative Text의 축약으로 쉽게 말해 이미지 설명 문구이다.
Alt Text의 목적은 3가지로 나눌 수 있다.
1. 저시력자 등 스크린 리더기를 사용하는 유저들의 웹 이미지 접근성을 향상시킨다....
