Feature: Story tags 🏷

barefoot-88 commented 2 years ago

Problem Currently we only have 3 topics for Stories (bitcoin, lightning, gaming)

Solution Let's create some more...

🎙 Podcast
💻 Workshop
🚦 Standup Report
🗓 Event

MTG2000 commented 2 years ago

hmm should we consider "Podcast" or "Workshop" to be a story's topic ??? I feel like they are more like a type or tag. because for example, a story will be a podcast about gaming with lightning. or about a Bitcoin event, and so on.

what do you think ??

barefoot-88 commented 2 years ago

Hmm, I kind of agree, but if that's the case why do we have tags & topics? Aren't they kind of one and the same? @johnsBeharry care to enlighten us?

MTG2000 commented 2 years ago

I'm myself more confused now... 😅 maybe the topic should be more like the category of the post, so it is one of: ( Finance, gaming, media & news, shopping, arts, ...etc) & the tags can highlight what things are mentioned in the post, like: (bitcoin, lightning, lnurl, lnbits, podcast, event, course, ...etc)

johnsBeharry commented 2 years ago

It wasn't my decision to have tags, topics, and categories I think it's just something that came out of no design QA.

Categories of stories should be mapped to the ones in the products listing.

Tags/Topics perhaps we merge these two?

barefoot-88 commented 2 years ago

Does categories actually make sense for stories in that case? Seems more useful to develop the topics feature.

A story is very different from a product and might not fit into one of those categories, or more likely fits into more than one!

johnsBeharry commented 2 years ago

That's fair, so in the end we only have one taxonomy, and they are shown as badges on the post.

What we call it, we will need to decide on but fundamentally we will keep it flat and simple with just one way of grouping. Otherwise this bike-shedding will continue.

MTG2000 commented 2 years ago

So you mean that there is no post's topic anymore, only tags ?? (& by tags we actually mean topics ,right??)

barefoot-88 commented 2 years ago

Sounds good. So we are left with the decision:

what to call these topics/tags?
How do we display them and allow users to filter through them...

Potential Solutions

Solution 1

On the left column we display a "Popular topics" list (these could be topics that have over a certain number of hits each).

For popular topics we could assign them emojis and display it the same way we currently do Categories...

solution 2 We display all tags ever created on the left menu with a search bar, users can select one or more tags and it can filter search options accordingly

MTG2000 commented 2 years ago

I like the first solution better. But we only need to figure out how we will handle the emojis for them, cause the topics/tags are not pre-created by us, they can be created on the fly by users. so how can we assign emojis for these popular tags when they become popular ??

johnsBeharry commented 2 years ago

Been looking into how our main inspiration dev.to does it, and I've come up with this.

Given dev.to has multiple "post types" (post, question, listing, podcast, etc)

Tags are universal but are not necessarily always selectable in each post type. Listings for example only has #paid and #temp tags
Listings also has additional custom fields which can help with display and filtering (categories list, location, expiration date)
All post types seem to have tags
Some tags are "official" where they have a custom logo, description, colour, and posting/moderation guidelines
There is a podcast tag for posts but it doesn't change the way the post is displayed, there is a specific podcast post-type for that.

But we only need to figure out how we will handle the emojis for them, cause the topics/tags are not pre-created by us, they can be created on the fly by users.

see point 4 @MTG2000

Below is an example of an "official tag" 👇

Conclusion:

This way dev.to is using is inline with solution 1 that @barefoot-88 posted. Extending the solution; the sidebar does not have to be dynamic, we can select some specific official tags to show here.
"Capabilities" were originally suggested to display on products as a technology lookup, which we could then create different directories from AND we can also generate some stats on the kinds of functionalities applications are adopting. Perhaps we can ignore this taxonomy for now though, it seems like something else that's not tags. More along the lines of "built with"
~~Should products also use tags?~~ lets leave this one for a later discussion

barefoot-88 commented 2 years ago

Nice work, Johns. Seems to be reasonably clear to me.

So to clarify, users add tags to their post, allowing it to be easily discoverable using a filter search tool. One question I have is how the user goes about doing this.

Potential issue: HMW avoid users "missing out" on a certain tag by mis-spelling it if they have to enter it by typing manually?

Potential solution: Displaying pre-selected popular options in a dropdown menu when the user selects the type field, or displaying them as badges/chips below the search field. However this latter option might seem confusing with the current design.

Journey: User types in a {tag} either manually or selecting from a list of pre-selected popular options. (see below)

Remaining question

What are the pre-selected "popular" tags we wish to offer users? Here are some ideas...

⚡️ Lightning
🪙 Bitcoin
🚦 Standups
✋ Help
🎨 Design
💻 Development
🎥 Media & News
🚀 Product
📱 Reviews
🎙 Podcast
🍿 Workshop
💸 Trading & Finance
🎓 Op-eds

Some of these e.g Workshops, Podcasts, etc might eventually get their own page, but for now might make sense to list as a popular tag instead! (take a look at the posts I created for the STW⚡️ workshops. Super basic but demonstrates the point.

Here is a design example of what our tag adding could look like...

Step 1

User sees Tags field with the pre-text "Search from popular tags or add your own by clicking Enter. You can add up to 5 tags to your post."

Step 2

User clicks the input field and sees a dropdown with "popular tags" appear. They either scroll and add these suggested tags or type in their own custom ones and add them by clicking enter. Once they click or tap 'Enter', the user sees the tag added below. They can use the 'X' icon next to the tag to remove it at any point.

Step 3

Once a user has successfully added up to 5 tags they should see an error message if they try to add more.

MTG2000 commented 2 years ago

so to close this discussion, what we reached is this:

We don't have an independent "Topic" field, so I'll remove its table from the DB
we will be using tags as the topics.
users can create new tags
but we will have some tags marked as "Official", & they will have an emoji associated with them.
on the feed page, we will show a filter listing of the most used official tags.

barefoot-88 commented 2 years ago

As the reader, if I select a popular tag on the left hand side menu, the header changes to show the user the new tag state has been activated. The user can unactivate this filter option by either clicking on a new tag, clicking for a second time on the activated tag (to "unselect it"), and finally, clicking the "Stories" text in the "Stories -> {Tag}" header. (see below)

johnsBeharry commented 2 years ago

Hey @barefoot-88 nice start to this list, gives us a good place to work from to see what options can evolve over time. For now, I'd say we start off with as little as possible and look at what we have so far. We have the posts from our YouTube, Substack, a few people from Qala that I've been reaching out to, MTGs article on lnurl-auth, and yours on authentication so I think we start from there and moderate the posts as more gets added.

⚡️ Lightning 🪙 Bitcoin

The community is about lightning and bitcoin so not sure if these would be so relevant to tag.

🚦 Standups

What would be the purpose of this one? The PPP? Maybe merge with #products

🚀 Product

A post connected to/about a product?

🍿 Workshop

As in a video of a workshop?

~~💸 Trading & Finance~~

I'd vote to have this one yet and don't really wanna attract too much trading content unless someone's making a trading app tutorial or something. We're in it for the tech :D

🎓 Op-eds

What's this one for?

Lastly I think stylistically what do you think about hashtags with hyphens instead of spaces and non-alphabet symbols?

Technical Note: Stories + Tags + Nostr Distribution

When we post stories to nostr we should not include the tags as our own tag moderators would be able to update them on behalf of the author on our platform, but since they won't have the private keys won't be able to make the change on Nostr. This an interesting point to highlight on an architectural standpoint. The tagging data we would "own" as a platform so we can better improve discovery for everyone, but comments, the markdown of the post itself, 🔥 sats, would be owned by the private key holder.

barefoot-88 commented 2 years ago

🚦 Standups Purpose would be to generate a template that users could post their PPPs from. To get the ball rolling. I know eventually these will want to be done from the profile.

🚀 Product Yup, if they're launching a product or just want to talk about something that is WIP they could attach a #product tag to it

🍿 Workshop Perhaps workshop isn't the best word to use. But yeah, something like a course, video, or instructional content for others to learn from.

💸 Trading&Finance Agreed. Could get cluttered with Chads discussing price movements.

🎓 Op(inion)-Ed(ucation) My auth article would probably be considered an Op-Ed... perhaps 🔬 Research would be more appropriate...

barefoot-88 commented 2 years ago

Great work on the deployment of tags @MTG2000

Here are some UI notes:

Are we using the # before the tag name (e.g #design). If so, should we put it in? Pls confirm @johnsBeharry
Please could we give the list-item / tag a padding of 4 pixels. This means that for the hover state, a padding of 4px should show around the around the edge. Currently it lies flush to the square (emoji) element and it looks a tad odd.

How it currently looks