최신 테마 Horizon 테스트에 함께해 주세요

[chapoi]

새로운 테마 Horizon을 소개하게 되어 매우 기쁩니다! Horizon을 내부에서 상당 기간 테스트해 왔으며, 이제 Meta에서 테스트를 시작하여 이 테마를 어떻게 계속 개선할지 여러분의 피드백을 받을 준비가 되었습니다.

이 주제에서는 Horizon의 목표에 대해 공유하고, 테스트 방법과 피드백 공유 방법에 대한 지침을 제공하겠습니다.

Horizon 알아보기

Horizon은 단순하고 아름다운 테마로, Discourse 사이트의 새로운 기본(out-of-the-box) 경험을 목표로 합니다.

Horizon은 여전히 실험적 테마로 간주됩니다! 따라서 커뮤니티에 설치하거나 피드백을 제공하기 전에, 이 테마에서 무엇을 기대해야 하는지 그리고 우리에게 피드백을 가장 잘 전달하는 방법에 대해 이해할 수 있도록 이 주제의 나머지 부분을 읽어 주세요.

→ Horizon Theme

Horizon은 누구를 위한 것인가요?

Horizon이 많은 커뮤니티에 적합하길 바라지만, 우리는 특정 사용자를 염두에 두고 Horizon을 만들었습니다 — 비기술적 관리자들과 일상적인 회원들입니다.

• 비기술적 관리자는 기술적 전문 지식이 제한적이고 디자인이나 개발 자원에 접근할 수 없는 커뮤니티 관리자입니다. 그들은 커뮤니티에 최적화된 Discourse의 외관을 커스터마이즈할 자원이나 노하우가 없지만, 여전히 Discourse가 자신의 커뮤니티에 적합하다고 믿습니다.

• 일상적인 회원은 일회성 방문객과 엘리트 파워 유저 사이의 어딘가에 위치합니다. 그들은 커뮤니티에서 정기적으로 읽고 게시하며, (대부분이 아니라면 전적으로) 휴대폰을 통해 Discourse를 방문할 가능성이 더 높습니다.

Discourse가 매우 유연하고 커스터마이즈할 수 있어 자랑스럽게 생각합니다. 우리는 기술적 전문 지식이나 자원에 관계없이 모든 커뮤니티에 대해 Discourse가 훌륭한 선택이 되도록 보장하고 싶습니다. Horizon은 디자인이나 개발자 자원에 접근할 수 없지만 여전히 회원들이 사랑할 만한 멋진 외관의 커뮤니티를 원하는 관리자들을 위해 만들었습니다.

Horizon의 다른 점은 무엇인가요?

우리의 기본(Default) 테마가 비교적 빈 캔버스라면, Horizon은 의견이 담긴(opinionated) 테마입니다. 이는 해당 테마를 사용할 때 Discourse의 외관과 작동 방식에 대해 특정 선택을 하여, 우리의 대상 사용자(위에서 설명됨)에게 훌륭한 전반적인 사용자 경험을 제공하기 위함입니다. 다음은 주목할 수 있는 몇 가지 변경 사항입니다:

• 토픽 카드의 정보 밀도가 낮습니다. Horizon의 가장 눈에 띄는 특징은 토픽 카드입니다. 토픽 목록이 깔끔하고 접근하기 쉽게 보이도록 가능한 한 많은 정보를 제거했습니다. 토픽 참여자 목록이나 토픽 태그와 같은 특정 정보는 토픽 카드에서 표시되지 않습니다.

• Horizon은 추가적인 커스터마이즈를 지원하지 않도록 설계되었습니다. Discourse의 외관이나 동작을 커스터마이즈할 수 있거나 관심 있는 대상이 아닌 사용자를 대상으로 하기 때문에, Horizon은 모든 테마 컴포넌트나 커스터마이즈와 잘 작동하도록 보장되지 않습니다.

  그럼에도 불구하고, 우리는 가장 인기 있는 테마 컴포넌트들과 Horizon을 테스트했으며, 지금까지 발견한 호환성 문제는 경미합니다. 우리는 시간이 지남에 따라 이를 해결하기 위해 노력할 것입니다. 현재로서는 Horizon과 함께 테마 컴포넌트를 활성화하거나 자체 커스터마이즈를 추가하는 것을 권장하지 않습니다.

• Horizon에는 관리자가 활성화하여 회원들이 커뮤니티 경험에 대한 더 큰 제어권을 가질 수 있는 새로운 색상 팔레트가 포함되어 있습니다. 관리자 Color Palette 설정을 통해 활성화되면, 회원들은 맞춤형 룩 앤 필을 위해 6가지 테마 전용 색상 팔레트 중 하나를 선택할 수 있습니다.

  

• 읽기 영역의 더 큰 텍스트. Horizon의 읽기 영역(즉, 토픽)은 인터페이스의 나머지 텍스트보다 약간 큰 텍스트를 가지고 있음을 알 수 있을 것입니다. 우리는 이 차별화된 텍스트 크기를 실험하고 있으며, 토픽을 더 쉽게 읽을 수 있게 하면서도 사이드바 링크와 같은 덜 중요한 텍스트는 더 미니멀하고 방해가 되지 않도록 유지하기를 바랍니다.

테스트 및 피드백 공유

사이드바 하단의 테마 전환기를 사용하여 Meta에서 Horizon을 살펴볼 수 있습니다:

Meta에서 또는 자체 커뮤니티에서 테스트하는 동안, 시각적 디자인 문제나 특정 테마 컴포넌트 또는 커스터마이즈와의 호환성 문제가 발생할 수 있습니다. 그런 경우, 우리에게 알려 주세요. 여러분의 피드백은 Horizon을 개선하여 더 광범위하게 제공할 수 있도록 시작하는 데 도움이 될 것입니다.

이 시점에서 우리가 받는 모든 피드백을 해결하지 못할 수 있음을 유의해 주세요. 이는 여러분의 피드백이 무효하거나 가치 없다는 뜻이 아닙니다 — 단지 우리가 특정 아이디어나 디자인 결정이 대상 사용자의 요구를 어떻게 충족하는지 더 잘 이해하기 위해 계속 테스트하기를 원한다는 뜻입니다.

알려진 문제 / 진행 중인 영역

다음은 우리가 적극적으로 작업하고 있는 몇 가지 영역입니다:

• 접근성을 보장하기 위해 색상 팔레트 다듬기. Horizon은 더 정제된 색상 시스템(그리고 Lily, Clover, Royal, Marigold 등 새로운 색상 팔레트에도 영감을 주었음)을 가지고 있습니다. 우리는 Horizon이 접근성 있고 라이트 모드와 다크 모드 모두에서 적절한 대비를 갖추고 있는지 확인하기 위해 노력하고 있습니다.

[Muhammed_EKİCİ (mekici)]

[dfabulich (Dan Fabulich)]

@lindsey

토픽 카드의 정보 밀도가 낮습니다. Horizon의 가장 눈에 띄는 특징은 토픽 카드입니다. 토픽 목록이 깔끔하고 접근하기 쉽게 보이도록 가능한 한 많은 정보를 제거했습니다. 토픽 참여자 목록이나 토픽 태그와 같은 특정 정보는 토픽 카드에서 표시되지 않습니다.

수년 동안 Discourse를 사용해 왔지만, "토픽 카드"라는 용어를 들어본 적이 없습니다. 토픽 페이지의 목록 행을 말씀하시는 건가요?

표준 테마에서 토픽 페이지는 다음 컬럼을 가진 테이블입니다:

• 토픽: 제목 + 카테고리 + 태그
• 토픽에 게시글을 올린 아바타 목록
• 답변: 답변 수
• 조회: 조회수
• 활동: 타임스탬프, 예: 10분 전, 4시간 전 등

Horizon에서는 테이블이 없습니다. 각 행에는 다음이 표시됩니다:

• 제목
• 최근 게시글을 올린 사용자의 아바타 하나
• 해당 사용자의 사용자 이름, “답변” 또는 “게시” 및 활동 타임스탬프, 예: “lindsey님이 9분 전에 게시”, “tobiaseigen님이 11분 전에 답변”
• 좋아요 수. (이것은 _무엇_인가요? “토픽” 좋아요인가요? 토픽 전체에서 누군가가 다른 사람에게 준 좋아요의 총합인가요? 정말 이상한 숫자이고, 이렇게 눈에 띄게 강조하는 것은 특히 이상해 보입니다.)
• 작은 답변 화살표 옆의 답변 수
• 이제 가장 오른쪽에 있는 카테고리

제 생각은 다음과 같습니다:

1. 개인적으로, 가장 최근에 답변을 남긴 사람의 신원보다 토픽의 카테고리가 훨씬 훨씬 중요합니다. 카테고리를 왼쪽으로 다시 배치하고, "lindsey님이 9분 전에 게시"라는 문구를 활동 타임스탬프가 있던 가장 오른쪽으로 배치하겠습니다.
2. "조회수"를 제거하는 것에 동의합니다. 사후적으로 보니, 이렇게 눈에 띄게 표시할 숫자가 아니라고 생각합니다.
3. 다른 아바타를 제거한 것에 대해서는 확신이 서지 않습니다. 익숙해지면 좋아질 수도 있겠죠.
4. 눈에 띄는 “다시 오셨네요, 사용자 이름!” 메시지는 마음에 들지 않습니다. 헤더 공간은 소중합니다.
5. 이제야 토픽 목록의 행들이 둥근 모서리와 각 “카드” 사이의 가시적인 간격을 가진 "카드"가 되었습니다. 이 부분은 마음에 들지 않지만, 익숙해지면 좋아질 수도 있습니다. 토픽은 단순한 구분선으로 분리되는 것을 선호합니다.
6. 토픽 태그가 토픽 카드에서 완전히 사라졌습니다. 이는 나쁘다고 생각합니다. 즉, 토픽 태그를 보려면 토픽 페이지 자체에 들어가야 한다는 뜻이니까요.

[lindsey (Lindsey Fogle)]

@dfabulich

수년 동안 Discourse를 사용해 왔지만, “topic card(토픽 카드)”라는 용어는 처음 들어 봅니다. 토픽 페이지의 목록 행을 말씀하시는 건가요?

테마 컴포넌트를 통해 이에 대한 선행 사례가 약간 있습니다 — Topic Cards — 이 컴포넌트는 유사한 디자인을 갖추고 있습니다.

Default 테마와 Horizon 테마의 토픽 목록 디자인이 매우 다르다는 점은 정확합니다. 이는 의도적으로 그렇게 설계된 것입니다. 빠른 피드백을 주셔서 감사드립니다. 하루 이틀 지나서 초기 의견이 바뀌거나(또는 그대로이거나!) 하는지 궁금합니다. 나중에 다시 오셔서 알려주시면 좋겠습니다!

[lindsey (Lindsey Fogle)]

@Muhammed_EKİCİ

보고해 주셔서 감사합니다. 저희 팀에 전달하겠습니다.

(참고로, 이는 모바일에서 /categories 페이지 상단의 카테고리/태그 필터와 관련된 투명성 문제입니다.)

[alehandrof (Alex Armstrong)]

비기술 전문가들을 위한 포럼을 관리하고 있어, 이 접근 방식에 정말 기대가 큽니다.

“환영” 이미지에서 검색창 위에 이상한 아티팩트가 보입니다:

또한 닉네임보다는 이름으로 불러주셨으면 좋겠습니다.

[lindsey (Lindsey Fogle)]

@alehandrof

“환영” 이미지에 검색창 위에 이상한 아티팩트가 있습니다:

기기와 브라우저에 대한 몇 가지 세부 정보를 공유해 주시겠어요? 현재 제가 확인하기에는 해당 문제가 보이지 않지만, 다양한 영역에서 이러한 유형의 문제를 수정하고 있어 구체적인 세부 정보가 큰 도움이 될 것입니다!

@alehandrof

닉네임보다는 이름으로 호칭해 주셨으면 합니다.

사이트 텍스트를 편집하여 이 기능을 사용할 수 있습니다. 이는 최근 Discourse 코어에 추가된 기능으로, 여기에 대해 자세히 읽어보실 수 있습니다: Bringing popular features to Discourse: Header search, welcome banner, and category icons / emoji

[Jagster (Jakke Flemming)]

DiscourseHub와 모바일:

목표 사용자가 가장 숙련된 사용자가 아니라면(특히 모바일을 사용하는 경우), 새 주제를 시작하기 위해 사이드바 사용을 강제하는 것은 가장 현명한 선택이 아닐 것입니다.

[alehandrof (Alex Armstrong)]

@lindsey

기기/브라우저에 대한 세부 정보를 몇 가지 공유해 주시겠어요? 현재는 해당 문제가 보이지 않지만, 여러 영역에서 이와 유사한 문제들을 수정하고 있으므로 구체적인 세부 정보가 매우 도움이 될 것입니다!

14인치 MacBook Pro에서 macOS 15.3.2 최신 버전과 함께 Safari 18.3.1 (20620.2.4.11.6) 최신 버전을 사용 중입니다.

[tobiaseigen]

@Jagster

새 주제 생성을 위해 사이드바 사용을 강제하는 것

저도 이 문제에 대해 생각해 봤습니다. 데스크톱에서도 읽는 동안 사이드바를 숨길 수 있으므로, 새 주제로 자연스럽게 유도하는 또 다른 쉬운 방법을 제공하는 것이 합리적이라고 생각합니다. 어디에 두면 좋을지 잘 모르겠네요. 혹시 제안이 있으신가요? Google은 사이드바를 완전히 제거하지 않고 단순히 "최소화"할 뿐이므로, 새 이메일 작성 버튼을 항상 유지할 수 있습니다.

한편, Discourse에서 이미 사용법을 익힌 사람들을 제외한 사용자에게 새 주제 버튼은 얼마나 필수적일까요? 결국 우리는 커뮤니티의 신규 회원들이 기존 토론을 읽고 답글을 쓰면서 커뮤니티에 적응하는 시간을 보내기를 원하니까요.

[alehandrof (Alex Armstrong)]

@tobiaseigen

한편, 이미 사이트 구조를 잘 아는 사람들을 제외하고, 새로운 주제 버튼이 Discourse에서 얼마나 필수적이라고 보십니까? 결국 우리는 커뮤니티의 새 멤버들이 기존 토론을 읽고 답글을 남기며 커뮤니티를 알아가는 시간을 보내기를 원합니다.

이것은 아마도 커뮤니티에 따라 다를 것입니다. 저희는 소규모 비공개 커뮤니티를 운영하고 있으며, 새로운 사용자들이 자신이 만들거나 사용 중인 리소스를 공유하거나 도움을 요청하기 위해 주제를 게시하도록 장려하고 있습니다.

저는 “새 주제” 버튼이 어떻게든 계속 보인다면 좋겠습니다.

수정: 카테고리 알림 설정도 저희에게는 중요합니다. 우리는 이를 관심 그룹(서로 다른 카테고리로 표현됨)에 대한 즉석 멤버십으로 사용하고 있습니다. 현재 디자인은 이를 강조하지 않습니다. 이 설정이 더 명확하고 현재 카테고리에 분명히 연결되어 보이도록 하는 것이 더 좋겠습니다. 현재 상태로는 이것이 무엇을 가리키는지 불분명합니다:

이것은 “Documentation” 카테고리를 가리키는 것일 수 있습니다.

아마도 배너 자체의 왼쪽 위 또는 오른쪽 위에 배치할 수 있을까요?

[Jagster (Jakke Flemming)]

@tobiaseigen

어디에 있을지 모르겠네요.. 제안이 있으신가요?

우리가 이미 가지고 있는 이 기능에 무엇이 문제인가요? 왜 또 차를 발명하려 하시나요?

(언어를 바꾸는 수고는 하지 않았어요, 이 설정을 아시잖아요)

@tobiaseigen

반면에, Discourse에서 이미 잘 알고 있는 사람들이 아닌 사람들에게 새 주제 버튼은 얼마나 필수적인가요?

포럼의 목적이 단순히 읽을 것을 제공하는 것이라면, 새 주제 버튼은 전혀 필수적이지 않습니다. 하지만 꽤 많은 포럼은 일종의 Q&A(질문과 답변)를 제공하기 위해 만들어지는데, 그런 경우 새 주제 버튼은 정말로 필수적입니다.

또한, 기능의 아주 기본적인 것을 보여주는 것이 가장 필수적인 일이라고 생각합니다.

@tobiaseigen

데스크톱에서도 읽는 동안 사이드바를 숨길 수 있습니다.

이것은 단순히 읽는 문제만이 아닙니다. 저는 여기서 사이드바를 전혀 사용하지 않는데, 저에게 유용한 것을 아무것도 제공하지 않기 때문입니다. 이것은 그저 목적 없이 큰 화면의 빈 공간을 채우는, 주의를 분산시키는 또 다른 컴포넌트일 뿐입니다.

하지만 모바일에서는 항상 숨겨져 있습니다. 즉, 모바일 사용자는 이제 주제를 시작하기 위해 추가적인 터치 한 번을 해야 합니다. 데스크톱 사용자들이 원하는 것을 얻기 전에 몇 번의 클릭을 세어보고, 그 후에 최소한의 클릭을 제공하도록 최적화되었던 것처럼, 이제 주제와 게시글의 수를 세어볼까요?

[Stephen]

@Jagster

우리가 이미 가지고 있는 것에 무엇이 문제인가요?

이 문제에 대해 저도 같은 결론에 도달했습니다. 인터페이스 요소를 제거하고 토픽 카드를 사용하여 시각적 구분을 만드는 것은 당연히 좋은 방법입니다. 하지만 동시에 ‘새 토픽’ 버튼 같은 요소의 위치를 변경하면, 비기술적 사용자들이 다른 디스코러스 테마에 적응하기가 더 어려워질 수 있습니다.

[Arkshine]

드디어! 첫인상이 정말 좋습니다!
GitHub에서 이전 버전을 우연히 발견했고, 최종 버전이 궁금했습니다. 정말 잘 나왔네요!

바로 떠오르는 몇 가지 피드백을 드립니다:

• 메인 아웃렛 주위의 통합된 배경을 마음에 들어 합니다. 우아하고 콘텐츠에 집중하는 데 도움이 됩니다. 다만, 대형 화면에서는 콘텐츠의 경계가 명확하지 않아 눈이 금방 피로해집니다. 시선이 넓은 영역에 고정되도록 강제하기 때문입니다. Meta Branded 테마가 이 문제를 해결하는 좋은 예시입니다. 명확한 경계와 배경을 제공하면 균형 잡힌 느낌을 줍니다.

• 새 주제 버튼의 위치가 합리적입니다. 놓칠 수가 없죠. 모바일에서 어디로 사라졌는지 파악하는 데 몇 초가 걸렸습니다. 저는 Meta에서 모바일을 많이 사용하지 않지만, 이곳에 버튼이 있을 거라고 예상했습니다:
  

  

• 주제 목록에서 행의 디자인이 훌륭합니다. 단순하고 핵심에 집중합니다. 두 가지 점이 신경 쓰입니다:

  • ‘인기(Hot)’ 상태 표시의 위치가 다소 혼란스럽습니다. 이전 행과 너무 가깝기 때문입니다.
  • 전체 테두리에는 큰 매력을 느끼지 못합니다. 개별적으로는 매우 보기 좋지만, 여러 개가 쌓이면 실제 제목을 읽는 데 더 많은 노력이 듭니다. 특히 스크롤할 때 그렇습니다. 약간 산만하게 느껴질 수 있습니다. 여백을 더 확보하거나, 더 은은한 테두리를 사용하는 것이 도움이 될 수 있습니다. (저도 적응해야 할 것 같고, 나중에 피드백을 수정해야 할지도 모릅니다.
    수정: 공정하게 말하면, 테두리보다는 제목 아래의 아바타 때문에 읽기가 더 어려워지는 것 같습니다. 모바일 뷰에서는 제목 위 카테고리 및 아래 아바타로 인해 이 문제가 더 두드러집니다.)

• 팔레트 색상이 훌륭합니다.

• (별개의 이야기) 이 테마에서 작성기(Composer)의 피크(peek) 모드가 꽤 좋습니다.

• 향후 개선 사항을 기대하겠습니다!

[ondrej]

좋은 테마네요! 시각적으로 적응하는 데 시간이 좀 걸리긴 합니다 (적어도 저에게는요).

/categories 페이지를 Air Theme처럼 보이게 하는 것도 좋을 것 같다는 생각이 들었습니다. 이 Horizon 테마에서는 모든 것이 박스 안에 있는 것 같은데, 기본 모양의 카테고리 페이지가 보여서 제 생각에는 좀 이상해 보이거든요.

[lindsey (Lindsey Fogle)]

아, 알겠습니다. 해당 버전의 Safari에서는 재현이 가능하지만 최신 버전(18.4)에서는 재현되지 않습니다. 업데이트 후에도 문제가 지속되는지 확인해 주시겠어요?

[NateDhaliwal]

이 테마는 정말 현대적이고 세련되며 훌륭해 보입니다! 라운드 버튼, 토픽 목록 등 여러 가지 요소가 정말 마음에 듭니다.

다만, 4가지 작은 문제를 발견했습니다. 모든 문제는 모바일 환경에서 Chrome을 사용하여 Discourse를 열람하던 중 발생했습니다.

1. 읽지 않은 상태임에도 불구하고 토픽이 파란 점과 함께 '새로움(new)'으로 표시됩니다.
   

   

2. 작성기(composer)가 열려 있을 때 기계 번역 버튼이 매우 크게 커집니다.
   

   

3. 게시글 미리보기의 모서리가 흰색으로 보이며, 게시글 버튼 영역이 연결되어 있지 않습니다 (스크린샷 참조).
   

   

4. 투표 카운터와 버튼이 토픽 제목과 정렬되어 있지 않습니다.
   

   

[Lilly (Lillian)]

여기서 어떤 높이 관련 이상한 일이 일어나고 있습니다:

콘솔 코드를 잠시 살펴봤지만, 아마추어 수준의 CSS 실력으로 인해 바로 특이한 점을 찾지는 못했습니다.

[cultiv (Sebastiaan Janssen)]

@Lilly

여기서 뭔가 높이에 관한 문제가 일어나고 있어요:

이거 언급하려고 했는데, 사용자 이름이 줄바꿈되는 바람에 그런 거예요. 아래 목록에서 두 번째 주제에서도 확인할 수 있어요. CSS를 조금만 수정하면 해결될 것 같습니다.

[NateDhaliwal]

이상하고(또는 약간 짜증나는) 이유로, 이 테마를 선택한 후 다른 테마를 선택해도 테마가 변경되지 않습니다. 색상은 그대로 유지되어, ‘접근성 대비(어두운)’ 테마가 매우 어둡고 ‘메타 브랜드’ 테마와 색상이 거의 차이가 없습니다.

이 새로운 색상은 ‘메타 브랜드’ 테마가 제공했던 색상보다 너무 어둡습니다. 빨리 수정해 주세요!