유저카드 리디자인 실험

[mattdm (Matthew Miller)]

@kynic

@seanblue

하지만 전체 배경을 연분홍색으로 만든 건 최악이에요.

네, 최악이에요. 왜 그렇게 만든 건지 모르겠네요.

저는 밝고 단색인 배경을 좋아해요 – 분홍색이든 아니든요.

[JammyDodger]

다크 모드 스크린샷에서 꽤 마음에 들었고, 꽤 화려해 보였습니다. 하지만 저는 다크 모드를 사용하지 않으니, 만약 색이 너무 강하게 튀면 그 의도와는 맞지 않을 수도 있겠네요.

[Lilly (Lillian)]

참고로, 우리 사이트에서는 이렇게 배경을 오버라이드하고 있어요:

공통 CSS

#user-card {
  background: #eeeeee;
...
}

[tobiaseigen]

저는 거의 모든 곳에서 다크 모드를 사용하며, 밝은 색상이 다소 산만하거나 과하게 느껴진다는 의견에 동의합니다. 제 생각에는 의도하지 않은 긴장감이나 긴급함을 더하는 것 같기도 합니다. 사용자가 카드를 여전히 아름답게 보이도록 하되, 색상을 좀 더 부드럽게 조정할 수 있는 방법이 있을까요?

개인적으로 이 실험이 정말 좋았으며, 이것이 코어 Discourse의 개선으로 이어지기를 바랍니다.

[seanblue]

@JammyDodger

스크린샷에서 다크 모드에 적용된 모습은 꽤 마음에 들었고, 꽤 세련된 느낌을 주었습니다. 하지만 저는 다크 모드를 사용하지 않거든요. 만약 큰 폭의 색상 변화가 있다면, 다크 모드의 본래 목적을 해칠 수도 있을 것 같습니다.

저는 특히 밤에 너무 밝은 화면에 민감하기 때문에 일부러 다크 모드를 사용하는데, 그러니 다크 모드의 목적을 확실히 해치는 셈이죠.

[twofoursixeight]

@seanblue

너무 밝은 화면에 민감한 편이라(특히 밤에) 다크모드의 취지를 무색하게 만드는 것 같습니다.

다크 모드에서 유저 카드에 어두운 색조를 적용해서 전체적으로 너무 밝고 거슬리지 않도록 하는 것이 좋을 것 같습니다.

[Canapin (Coin-coin le Canapin)]

@seanblue님의 카드에 밝기 필터를 적용하면 다음과 같이 보입니다:

원본

밝기 0.8:

밝기 0.6:

밝기 0.4:

[jordan.vidrine]

@seanblue

너무 밝은 화면에 민감해서(특히 밤에) 다크 모드를 부분적으로 사용하는데, 실제로는 다크 모드의 본래 목적을 무효화시키는 셈이네요.

위에 @Canapin님의 제안 덕분에, color-scheme이 다크 버전일 때 메타(meta) 쪽을 약간 조정했습니다. 배경색이 조금 더 어둡게 설정되어야 합니다. 이렇게 하면 더 나아졌는지 확인해 주시겠어요?

[darkpixlz (Pyx)]

응, 개인적으로도 그게 훨씬 낫다고 생각해. 나는 현재 배경이 있는 방식이 마음에 들긴 하지만, 그렇게 생각하는 사람이 많지 않으니 언젠가는 두드러진 색상을 사용하는 컴포넌트를 만들 계획이야.

[jordan.vidrine]

타임라인에 올라와 있고, 통합만 기다리고 있어요

[seanblue]

@jordan.vidrine

위에서 @Canapin 님의 제안 덕분에, 색상 스킴이 다크 버전일 때를 위해 메타에 약간의 조정을 했습니다. 배경은 조금 더 어둡게 설정해야 합니다.

음, 모바일에서 뭔가 문제가 생긴 것 같지 않나요? 이전과 똑같이 밝게(또는 비슷하게) 보이고, 더 이상 흐릿하게 처리되지도 않습니다.

어떤 방식으로 설정했는지 모르겠지만, 0.6 밝기 예시 정도가 적당할 것 같습니다.

[jordan.vidrine]

제 실수입니다. 해당 PR에 -webkit 접두사를 포함하지 않았는데, 이제 수정되었습니다.

[seanblue]

새 버전이 훨씬 좋아 보입니다.

[Lilly (Lillian)]

내 포럼에서도 업데이트가 수정되었어요. @jordan.vidrine 감사합니다. 그 실험적 사용자 카드 TC를 정말 좋아하는데, 이제 더 이상 실험적이면 안 될 것 같아요

[ondrej]

@Lilly

더 이상 실험적인 단계가 아니어야 합니다.

동의합니다. '실험적’이라는 꼬리표를 달아두고만 있을 만큼 좋은 것이 아닙니다.

[Don]

안녕하세요

위치 관련 문제를 발견했습니다. 첫 번째 사용자 프로필을 연 이후, 다른 모든 사용자 프로필에서 위치 URL이 유지되는 것 같습니다. 감사합니다

[jordan.vidrine]

와! 잘 잡았어요! 이 문제를 확인해 보겠습니다.

[rahim123]

안녕하세요, 사용자 카드가 화면 밖으로 일부 벗어나는 문제를 발견했습니다. 브라우저가 최대화되어 있고 확대 비율이 높거나 DPI 설정이 높은 경우에만 발생하는 것 같습니다.

Sam's Simple Theme

@Arkshine Hi, appreciate the reply. I think it happens when the zoom level is higher. I first noticed the issue on Firefox, where I have the default zoom set to 110%, and also layout.css.devPixelsPerPx set to 1.1 . But I can also reproduce it with Chromium’s default settings by just zooming in a bit (it appears to only happen when the browser is maximized): [image] Ah, ok. I think I’ll cross-post this issue there. It seems like the usercard component should take care of its own CSS to avoid …

샘의 심플 테마(Sam’s Simple Theme)에서 더 눈에 띄지만, 확대 수준과 자주 게시하는 사용자의 수에 따라 기본(Default) 테마에서도 발생하기 시작합니다:

[Arkshine]

설정값을 시도해 보았지만 재현이 되지 않는 것 같습니다.

확실히 하기 위해 질문드리는데, 사용자 카드 모달을 연 이후에 확대하고 계신 건가요, 아니면 아바타를 클릭할 때마다 스크린샷처럼 사용자 카드가 항상 그렇게 표시되나요?

[rahim123]

Hi @Arkshine, 저는 먼저 확대한 다음 아바타를 클릭합니다.

그러면 더 근본적인 문제일 수도 있습니다. 저는 운영 체제 수준에서 텍스트 확대 비율을 1.1로 설정하고 있습니다(그렇지 않으면 고해상도 화면에서 텍스트가 너무 작습니다). Firefox는 이 OS 설정을 따르지 않지만, Chromium은 따르는 것 같습니다. 그래서 공정한 비교를 위해 Firefox에서 130% 정도 확대하고 창을 완전히 최대화해서 시도해 보세요.