본문 바로가기

디자인/신입 UIUX디자이너의 일기

탈퇴, 삭제 버튼은 꼭 강렬한 빨간색이어야 할까?

반응형

오늘 디자인 시스템 회의를 하다가 개발자 동료가 이런 질문을 했다. "탈퇴, 삭제 버튼은 꼭 빨간색이어야 할까요? 프라이머리 컬러 사용하면 안돼요?" 곱씹을 만한 질문이다. error, danger 를 상징하는 레드 계열의 컬러는 너무 강렬한 나머지 자칫 사용자에게 시각적 피로감 또는 부담감을 남긴다.

 

동료는 제안했다. 하나는 프라이머리 컬러 필 버튼(filed btn) 로 하고, 나머지 하나는 텍스트 버튼(text btn)으로 놔두자고.  그런데 쉽게 대답하지 못했다. 어떤 상황이냐에 따라 다르기 때문에 이 부분은 주말에 조금 더 관련 자료들을 찾아본 다음에 답하기로 했다. (추후 이 포스팅에 버튼 컬러 관련해 찾은 레퍼런스 붙일 예정) 신입 UIUX디자이너 과로사할 예정...🥲

 

버튼 관련해 이런 피드백도 남겼다. 

상황은 이렇다.
1) 웹페이지
2) 문의 게시판
3) 버튼 두개 : (a) 취소/그레이 컬러/왼쪽, (b) 확인/프라이머리 컬러/오른쪽
4) 상태 : 게시판 하단 중앙에 배치

대안1) 게시판 중앙 하단에 놓인 (a), (b) 버튼 세트를  '우측 하단'에 놓으면 좋겠다.
사람 손과 마찬가지로 마우스도 우측 하단이 더 선택이 쉬우므로.
만약 이렇게 된다면 앞서 말한 내용처럼 (b)버튼은 필드 버튼, (a)버튼은 텍스트 버튼으로 진행하면 좋겠다는 말과 함께.

대안2) 우측 하단이 아니라면, (a), (b) 버튼 두 개를 에 오른쪽, 왼쪽 하단으로 각각 찢어서 배치해도 좋겠다.
오토레이아웃 스페이싱 처리. 그랬을 경우 버튼과 버튼 사이의 간격이 넓으므로 프라이머리 컬러를 사용해도 되지 않을까란 말과 함께. 
 
 

 

 

그 밖에 오늘 들은 피드백 (개인적인 기록)

- alert는 디자인시스템에 있는 거 가져다 쓰면 좋겠다 (version.03)
- 테일윈드 컬러 시스템으로 색추출할 것
- 정보가 너무 적을 때는 서브 비주얼 넣기 (헤더(?)역할)
- 마찬가지로 정보가 적은 웹사이트는 푸터바 가운데 정렬하기보다는 ‘개인정보취급방침 등’ 채워넣어서 밀도 높이기
(주말에 다양한 푸터바를 찾아봐야 겠군)
- 이메일은 마스킹처리 해야 한다 (법적으로)...........근데 어떤 건 되고, 어떤 건 안되고? 
(이것도 주말에 공부하자)
- 모바일앱 고려해 작업하자 (넵넵, 알겠다고요. 3일 전부터 웹사이트 시작했거든요? 슽흩렡흐) 
반응형