Follow

How could I make this UI more... interesting..?

@Gargron In terms of classical graphic design perhaps think about balancing the elements. The button is wide, and the line of the copy is long (without line breaks). Centering may be an opion instead of aligning left. Cheers!

@Gargron perhaps use a drawing depicting how hashtags can be useful for finding and sharing interests, like two mastodonthingies in the same place together (I imagine a cloud for some reason) having stuff around like pictures and a big hashtag symbol

if you need specific UI elements that provide actual functionality... maybe display (more) hashtags with different sizes and/or colors?

@Gargron Just more characters in our profiles. Room for those hashtags to go in.

@drwho @Gargron the featured hashtags actually appear in the right column on the public profile, as you can see on attached screenshot.

@Gargron merge it with "edit profile" page so that it's not as wide

@Gargron Have you considered the use of skeleton dancing gifs? I remember that used to be the way people made things interesting... Back in the day.

@Gargron Make the text field inline with the "Hashtag" text that proceeds it, maybe change it to "New Featured Hashtag" and make the submit button also inline next to the text field (and let users press enter to submit). I think the reason it feels unbalanced is because everything is layered vertically when it doesn't need to.

@Gargron Typography also invloves pinching in, or extending, spaces between lines and letters. The space between the "pinned toot" and the name of the user could be pinched in. Likewise, in your image "featured hashtags" you may pinch in space in various places. In general, Mastodon needs urgent visual help. Cheers!

@Gargron I would also love to see a larger image on the user page, and for some reason I find the "byine" on all toots a little anonymous. But nothing a good graphic designer can't fix.

@Gargron in visual design, larger things are considered more important than smaller things. All the fonts in the screenshot are close to the same size so they all carry a similar value. Color can also bring attention to important elements. The button pops out but you might be able to use color to also highlight other parts of the page.

@Gargron fonts are tricky but can be used effectively to differentiate content. Don't use more than 2. Headlines generally are sans-serif and body content is serif fonts. Serif fonts are easier to read in general.

@Gargron Sorry I'm a bit late. I can't say about UI but I can speak of #UX.

In general, the main problem here is not the UI but the lack of comprehension about what this feature is supposed to do (hense all the confused replies this post is getting).

Here are some ways you could improve FTUE for this feature:

1) The intro text could be improved to say that these hashtags should be hashtag you used in toots. Because if you never use hashtags in toots, this whole feature is basically useless.

@Gargron
2) if the user never used any hashtag, instead of showing an empty area, you could write "Use an hashtag in a toot and it will appear here.

3) instead of "you might want to use one of these" emphasis that these tags comes from you, the users. "Here are hashtags that you've used often in the past:"

Don't hesitate to poke me if you have #UX questions :)

Sign in to participate in the conversation
Mastodon

Server run by the main developers of the project 🐘 It is not focused on any particular niche interest - everyone is welcome as long as you follow our code of conduct!