jonghokim27 / ssutoday

숭실대학교 스터디룸 예약 및 공지사항 확인 앱
MIT License
10 stars 0 forks source link

메인 텍스트 (제목, 본문)이 회색인 이유가 있을까요? #3

Closed HyunsDev closed 11 months ago

HyunsDev commented 11 months ago

공지사항이나 앱 UX/UI의 여러 부분의 텍스트 색이 회색인데 혹시 특별한 이유가 있을까요?

만약 특별한 이유가 없을 경우 시인성을 위해 검은색을 사용하는 것이 좋을 것 같습니다

jonghokim27 commented 11 months ago

디자인적인 요소에 있어서 색감의 조화를 이루기 위해서는 회색 계열의 색을 사용하는 것이 옳다고 판단하였습니다. 일부 강조되어야 하는 텍스트에는 이미 짙은 회색 계열의 색 또는 검정색을 사용하고 있습니다.

HyunsDev commented 11 months ago

image

디자인적 요소도 중요하지만 UI는 시인성이 더욱 중요하다고 생각합니다. 현재 디자인에서는 배경 색과 텍스트 색 간의 대비가 너무 적은 것 같습니다 위 사진은 주요 서비스의 제목, 본문 색과, WCAG 기준 통과 여부를 나타낸 표입니다. 인스타그램과 에브리타임의 경우 AAA 기준을 충족하고 있는데 슈튜데이는 AAA 기준을 충족하지 못했습니다. WCAG 기준을 만족하기 위해 본문 색을 조금 더 검은색에 가깝게 변경해주셨으면 좋겠습니다!

따로 수익이 발생하는 것도 아닌데 학생들을 위해 서비스를 만들어주셔서 감사합니다. 작은 의견이지만 서비스의 발전에 도움이 되었으면 좋겠습니다.

HyunsDev commented 11 months ago

@jonghokim27 closed 이슈라 알림이 가지 않을 것 같아 멘션해드립니다!

HyunsDev commented 11 months ago

WCAG의 색 대비에 있어서 좋은 글이 있어 함께 공유해드립니다!

요약 WCAG2 AA: 최소한의 수준을 넘어서 보다 향상된 접근성을 갖추기 위한 수준으로써 권장된다. WCAG2 AAA: 웹 접근성을 극대화 하고자 할 때 갖추어야 할 수준으로써 이 수준은 의무화 하기에 너무 어려울 수도 있다. 명암 대비 (향상): 다음과 같은 경우를 제외하고 문자의 시각 표현과 문자 이미지는 적어도 7:1의 명암대비를 부여해야 한다.(수준 AAA)

https://naradesign.github.io/wcag-contrast.html

jonghokim27 commented 11 months ago

대부분의 화면에 대해 시인성을 개선하여 앱 내 업데이트로 배포를 완료했습니다. 의견 주셔서 감사드립니다.