Categories: Smartphone View Component

It would be useful to implement a theme component (categories: smartphone view) that allows displaying categories as smartphone icons, as shown in the example image below. What do you think?

2개의 좋아요

Hi Cristian, welcome back :v:

There wouldn’t be much space for titles and categories’ descriptions which are enabled by default for anonymous and trust level 0 users. A mockup using a “real world” example would be great to see how it would work.

That’s not the same but I’ve modified the mobile category page layout on my own forum from:

to:

But I think it could be improved even more with some grid view as you suggest and/or removing the three topics for each category.

OP’s mockup has same issues than smart phones have:

  • how to identify and remember what is what, and
  • when many is too many.

Hi :man_raising_hand:t3: It would be sufficient to allow this style (image below) in the smartphone view, with the possibility to disable the category description, the list of subcategories, and the list of latest posts. Then make the list of categories available just like the list of apps on our smartphone (Grid version - squares with rounded corners.).

Another useful feature could be “Custom category name in the smartphone view”, so as to shorten the name of a category, from Entertainment to ENT, for example.

This is an example I found on a forum but in a list style.

4개의 좋아요

Why would that work? No one knows what ENT means.

I can see contexts in which this would work — fans of some particular game or niche interest often have their own jargon and even iconography. Would it be the most discoverable and clear to new users? Probably not — but that’s not always a key value.

1개의 좋아요

Can you share the access link so I can refer them. Or you can check out my site at https://businesslab.vn I’m happy to share what I know and have done.
also you can refer to the theme page category page Air Theme, I found it similar to what you are looking for.

1개의 좋아요

I’m simply talking about the navigability of the categories page. Instead of scrolling down to discover the categories, it would be useful to see them all on one page, as described in my first post. It’s inevitable that in future versions of Discourse, this feature will be implemented, so why not anticipate it?

Yes, as in the last image I posted in the first post, it definitely partially solves the issue.
The theme component is GitHub - discourse/discourse-minimal-category-boxes · GitHub.

I’m not sure I understand this argument. Why is it inevitable? (And if it is, why rush?)

1개의 좋아요

우리는 이미 Customization > Theme 그리드 레이아웃의 섬네일에서 그런 기능을 어느 정도 갖추고 있습니다.

그래서 어떤 식으로든 가능할 것 같습니다.. 아마도 짧은 누르기/긴 누르기 또는 단일/더블 탭 아이디어를 사용한다면 설명이 팝업으로 표시되도록 할 수도 있겠네요.

@Canapin

사람들이 얼마나 유용하게 여기는지는 애플리케이션에 따라 달라질 수 있습니다. 솔직히 말하면 모바일에서 Customization > Theme 토픽 목록이 번거롭게 느껴집니다. 시각적으로 항목을 찾는 것이 더 어렵기 때문입니다.

하지만 OP가 더 단순화된 카테고리 이름과 텍스트가 아래에 있는 아이콘을 사용한다면 괜찮을 것 같습니다.

카테고리가 몇 개나 되는 말씀이신가요? 위 게시물을 확인하시고 섬네일과 함께된 토픽 레이아웃을 위한 Customization > Theme 링크를 확인해 보세요.

그렇네요. ㅋㅋ
원하는 효과를 달성하는 데 필요한 것에 따라 누군가가 #customization:theme-component를 만들거나 #customization:plugin을 만들 가능성이 필연적일 수 있다고 생각합니다.

그 점을 인지하고 있으며 논의 중입니다 :+1:

호기심이 생겨서 @derak 님이 원하시는 것과 비슷한 것을 만들려고 이 부분을 수정해 보았습니다:

.category-boxes, .category-boxes-with-topics {
    gap: 1em;
}
.mobile-view .category-boxes .category-box, .mobile-view .category-boxes-with-topics .category-box {
    width: 100%;
    flex: 0 0 calc(50% - 0.5em);
}
.category-boxes .description {
    display: none;
}
.category-boxes .category-box .category-box-inner .category-details .category-box-heading h3 {
    text-align: center !important;
}
.category-boxes .category-logo .category-notifications-button, .category-boxes-with-topics .category-logo .category-notifications-button {
    visibility: hidden;
}
.category-boxes .category-box {
     box-shadow: 0px 0px 8px rgba(0,0,0,.2);
}
4개의 좋아요

they look so minimalist, i will consider this version for another project ^^

2개의 좋아요