Create a powerful, rich text editor for our communities.

When we released our first communities years ago we believed that formatting options should not be widely available. We allowed styling through BBcode, discouraging ‘trolls’ and 'novice' users to create ugly screaming posts. Advanced users, who were willing to take the time to write long-reads, do know how to make use of the BBcodes.





Times have changed, users learn and the demand for easy and usable products is high. Using BBcode does not satisfy users, therefore I'm happy to say that we are working on a new editor for our communities. In this article, I'll share insights on this process.





The challenge: formatting a topic or comment is painful


Formatting a post requires time and effort. Common scenario’s such as inserting a list or pasting an URL can be a struggle. BBcode is sensitive to human errors such as type mistakes or unclosed tags. Only after publishing you will see how your post turns out. We feel the pain too.





The goal(s): allow a user to post with minimum effort & pain


In the end, the ultimate goal is that a user can post something to your community. That post can be a topic or a simple comment. Some goals we defined:

• Have an optimised editor for different scenario’s
  
  
• Make post-formatting powerful, usable and future-proof
  
  
• Make post-formatting a delightful experience

The process: understand, research, design and test


First, we identified various use cases in which an editor will be used. There is a big difference whether a user is sending a private message or if he is writing a review. Do your users send spoilers and quotes in private messages? Probably not. We identified the following three use cases:

• Create a topic (start conversation, ask a question, submit idea etc.)
  
  
• Write a reply (to a topic or comment)
  
  
• Send a private message

We analysed other editors such as Medium stories, Facebook notes, Linkedin articles and some more. Analysing other editors gave us insight that bold, italic, underline, URL's, media, emoji and @mentions are the most important formatting options, and should be directly accessible at all times. Other formatting options such as strikethrough, coloured text and three different heading sizes seem not that valuable. We’d love to get your opinion on that.

During the design phase, we sketch the behaviour and look and feel of the editor. Applying a bold format to a text is not rocket science but scenario’s like inserting images and URLs require more work. Next to that we have to deal with multiple devices and their behaviour. Within a mobile environment you’ll always have access to emoji from your built-in keyboard. On desktop this isn’t the case. Small details like these should all be taken into account.





Up next: build, test, iterate


To deliver a delightful experience we’re going to test the editor with users. At this stage we started building the editor. We started small: support basic formatting options such as bold, italic and underline. We will add extra formatting options one at the time. As soon as we have the more complex scenarios in place (image upload, embed video) we will test the experience to verify that the new editor allows you to post something with minimum effort.





In the end you can expect an optimised text-editor that will support almost all formatting options that you are currently used to.





Sounds great, can we help?


Glad you asked, yes you can 🙂 We’d like to hear your thoughts and feedback on a new editor, especially on the following matters:

• Which formatting options do you consider most important and most used in your community?
  
  
• What is the biggest struggle you are experiencing with the BBcode editor?

Hopefully this article gave you some insights on what we’re working on and what you can expect. We’d love to hear your feedback.





Best,


Yoeri