Stellen Sie sicher, dass die Benutzer wissen, dass unter dem Bedienfeld eine Vorschau generiert wird

I’ve been onboarding new users onto our Discourse site and taking note of how they are interacting and where they get tripped up.

One big pain point I noticed was that new users easily miss that a preview of their post is being generated to the right of the compose window because it’s completely covered up by the educational / yellow panel.


[Image Description: Screenshot of situation decribed above.]

For people new to markdown, something like
![Screenshot of Google Chrome (10-13-20, 2-49-45 PM)|690x197](upload://3OvVqVJ86INccIlpsOKv6ZbE98a.png)

or

[Write How We Communicate FAQ](https://hub.youthpowercoalition.org/t/write-how-we-communicate-faq/451/2)

especially when copied in from a different text, looks really odd and not intuitively like it would work because the preview isn’t showing. My new user copied something in and then immediately started editing out things like the * in *bolded text* . She never clicked esc in order to dismiss the help text and then discover that the odd characters actually resulted in the post that she wanted.

So, from a UX perspective, I think there should be something that makes it obvious that a preview IS being generated and the help text is dismissable. It’s not obvious enough right now.

12 „Gefällt mir“

Tagging in @tobiaseigen because we started this conversation outside of Meta.

This was Tobias’s initial response

I did not realize that it does not go away by itself because I always immediately use the X to close it. If people do not realize it can be closed and don’t close it, then indeed the composer functionality is going to be super confusing and hard to use. If you could add a reply to How to disable the yellow panels for first two posts? with this feedback, we can work on improving it. One thought I have is to have a close button on the popup, and to disallow typing until it is selected? Or to close it automatically after a little while?

What are your ideas?

5 „Gefällt mir“

How about positioning it horizontally above the edit / preview panes instead of over the preview pane?

5 „Gefällt mir“

Maybe a little transparency for the panel background?
I would also place (another?) Esc x button on the left side of the panel, the one on the right side, usual location, is really far from the “eye action” :grin:

1 „Gefällt mir“

Here’s a great write-up on potential solutions!

Could it be more of a modal that comes up from the bottom instead?


[Image Description: Screenshot from article that shows what I described above]

I wonder about this because I think there are a lot of places that put x’s on the upper right side. What I’d like is for the x and the esc shortcut to be a much darker color and for the x to match that x in a circle icon that I’ve come to expect. See the article above.

2 „Gefällt mir“

I like the idea of it coming up from the bototm.

3 „Gefällt mir“

I’m not sure how significant of an issue this is, because

  • there is a very clear close button and “esc” text in the traditional upper right area of the UI element

  • it only appears for your first two posts (and first two topics, if you are creating topics), anyway

Well you’re right, it’s objectively not a big deal, but I can testify that in some rare case where users are really not used to… any ui at all, everything is a mountain on the road to actually write something. The very subtlety of discourse that we all love can be perceived as frightening. I know my case is fringe but I had to convince some of my users to go from pen and paper directly to discourse without passing go! So yes, the panel was a (small) friction.
I think a two parts composer is a concept difficult (relatively of course) enough to apprehended, the panel “murks” a little bit the first impression (by hiding only the part on the right, for a short time, I agree).

Oh yes about that :thinking: I’ve always thought it was weird that I still see this panel, as an admin, after hundreds of posts and topics, but it never bothered me that much…
but I’ve just checked, the summary says I’ve created -313 messages ! :anguished: A negative count ?

I’ve watched new users miss this more often than not.

New users are the people who will be most confused.

2 „Gefällt mir“

You’re also assuming these users will never post more than 2 times. Is that typically the case in your community?

We’re a small team at the moment and currently redesigning our forum, hence the 1:1 onboarding/user tests, so I’m not worried about our current users.

I think you’re underestimating how big a deal friction is for new users, though, especially for communities that exist only via a forum. Markdown can look very intimidating to people. I’m super tech savvy and I still rely heavily on the preview pane to know that I’m on the right track. People who are scared away from ever posting, well, of course they wouldn’t show up as users who post more than twice.

I changed my mind. I think it’s definitely worth trying if moving the x and esc to the left changes things for users. And, I’ve since noticed it on the left side for a lot more websites than I anticipated.

3 „Gefällt mir“

The other thing you could do is turn this message off entirely; then new users would only see the preview. I believe that’s possible today via existing Discourse site settings.

2 „Gefällt mir“

I’ll give this a shot and see what happens. Could you point me to the correct setting? I couldn’t figure out where exactly it lives.

1 „Gefällt mir“

I think it’s educate until posts

4 „Gefällt mir“

Thank you. I changed that setting to 0 and will see how things go.

3 „Gefällt mir“

Let us know if that doesn’t work, since I think it is the easiest solution.

1 „Gefällt mir“

Can definitely confirm the issue. Just spent 5 minutes looking for an answer and found this topic googling.

Es ist einigermaßen klar, wie man das Panel schließt. Aber das Problem ist nicht, dass der Benutzer versucht, das Panel zu schließen und nicht herausfindet, wie. Stattdessen sieht der Benutzer keinen Grund, es zu schließen, weil er nicht weiß, dass sich dahinter etwas Interessantes verbirgt. Dann ist er von der Bearbeitung der Markdown-Syntax ohne Vorschau überwältigt.

Ich denke, das ist ein potenzielles Stolperstein für Benutzer, die mit Markdown-Editoren nicht vertraut sind, und die ersten paar Beiträge sind genau dann, wenn die Erlernbarkeit der Benutzeroberfläche am wichtigsten ist.

4 „Gefällt mir“

Es ist möglich, dass wir ein “Just-in-Time”-Bildungspanel beim ersten Aufruf des Editors durch den Benutzer einrichten könnten. Aber das ist ja der Sinn dieses Panels… es findet bereits eine “Just-in-Time”-Bildung statt, um die Leute zu ermutigen, sich bei der Teilnahme höflich zu verhalten, wenn sie mit dem Schreiben ihrer ersten Antwort beginnen:

Hier steht:

Willkommen bei {sitename} – danke für deinen Beitrag!

  • Verbessert deine Antwort das Gespräch in irgendeiner Weise?
  • Sei freundlich zu deinen Mitforisten.
  • Konstruktive Kritik ist willkommen, aber kritisiere Ideen, nicht Menschen

Mehr dazu findest du in unseren Community-Richtlinien. Dieses Panel erscheint nur für deine ersten 2 Beiträge

Das sind… sehr, sehr wichtige Ratschläge. Einige der wichtigsten, die wir geben. Nun, dieses Ratschlagspanel sollte übersprungen werden, wenn du während des anfänglichen Onboardings angibst, “Die Neuling-Sachen überspringen” zu wollen, so wie hier – diese Einstellung wurde in Discourse 2.6 Ende 2020 eingeführt:

Sie ist auch als Benutzereinstellung verfügbar.

Davon abgesehen habe ich nicht das Gefühl, dass das Tippen von Wörtern, wie ich es hier tue, normalerweise viel (oder überhaupt?) Formatierung erfordert, und die Leute sind heutzutage, nach über 30 Jahren, im Allgemeinen damit vertraut, Wörter in Kästchen im Internet zu tippen.

(Tatsächlich sind die wichtigsten “Formatierungen” in den meisten Beiträgen das Hinzufügen von Bildern, was durchschnittliche Leute jeden Tag auf ihren Handys und Geräten tun; ich nehme an, die überwiegende Mehrheit der Welt versteht, wie das geht, indem sie auf die Schaltfläche “Bild hinzufügen” in der Symbolleiste oder im Editor klicken.)

2 „Gefällt mir“

Nun, ich komme gerade von einer neu implementierten Discourse-Seite, die zwei ältere Seiten ersetzt. Wir stimmen sie noch ab und eines der ersten Dinge, auf die ich gestoßen bin, war, dass ich keine Vorschau finden konnte. Ich meine, jede vernünftige Seite zum Posten von Text hat eine Art Vorschau und ich habe verzweifelt nach einer Schaltfläche gesucht, um sie anzuzeigen. Ich wage zu behaupten, dass ich ein erfahrener Forennutzer bin, aber es dauerte Minuten, bis ich auf die Idee kam, die gelben und die nachfolgenden blauen (ähnliche Themen) Panels zu schließen.

Wir haben oft Benutzer, die lange Code-Schnipsel oder falsch formatierte URLs einfügen. Eine Vorschau ist bereits und besonders für Erstbenutzer erforderlich. Bitte behandeln Sie dies als Benutzerfeedback und nicht nur als eine obskure Idee.

Eine (vermutlich) einfache Lösung besteht darin, das Willkommens-Panel auf 2/3 seiner Breite zu verkleinern, um den darunter liegenden Vorschau-Bereich sichtbar zu machen. Dann wird klar, dass das Schließen des Panels tatsächlich etwas bewirkt.

5 „Gefällt mir“