Free Self-Hosted Zendesk & Help Scout: Architecture, Design and Usability

FreeScout
8 min readNov 3, 2018

On November 1, 2018 FreeScout 1.0.0 has been officially released: https://github.com/freescout-helpdesk/freescout

FreeScout is an open source help desk & shared mailbox — it is a free Zendesk & Help Scout alternative. Application is licenced under AGPL-3.0 licence. And here is the short story of the FreeScout…

Intro

For years I’ve been using a free Help Scout account for my projects, but one day service decided to force all free accounts to upgrade to the paid plan, so developing a free open source alternative became kind of urgent.

When looking for a free alternative to Help Scout I did check Zendesk, Freshdesk and Zammad. Zendesk did not offer a free plan at all, so I just played with their trial and that was it. Freshdesk appeared to be something just too complicated and non user-friendly. Zammad felt like a monster in terms of architecture, I spent a day trying to install it and finally gave up and had to use their online trial to test it. I needed something really simple, so finally decided to start developing own self-hosted free Zendesk / Help Scout.

FreeScout in numbers:

  • Developers: 1 leading developer and 3 contributors.
  • Time spent on development: 4 months
  • Lines of code written: 20646
  • Build size: 14.2 Mb

Application is created with focus on user-friendliness, usability and simplicity. FreeScout is and will be used by individuals and companies who need a free professional email based customer support system, but can not afford Zendesk or Help Scout. FreeScout is also a perfect fit for those who does not want to give up privacy or lock themself in a service which they don’t control. With FreeScout you will never see such thing in the middle of your working day:

FreeScout Architecture

FreeScout is super lightweight and fast, it does not require Node.js, Redis, memcached, composer or anything else to run, only web server, PHP 7.0+ and MySQL/Maria DB 5.0+. Thus it can be easily installed on any shared hosting.

FreeScout uses Laravel 5.5 as a backend framework. I was not familiar with Laravel before, so had to develop FreeScout from sratch and learn Laravel at the same time. Laravel framework is just awesome…

The most important part of any help desk is the reply editor, this is the heart of the whole system. Summernote has been chosen as the most suitable and flexible among many other open source WYSIWYG editors. Summernote was started back in 2013 and has huge community on GitHub (more than 1600 forks). It supports out of the box all the features which were needed for the help desk.

To display real-time menu notifications and browser push notifications FreeScout uses Polycast which emulates web sockets via ajax and works like a charm.

To allow a hassle-free installation experience, the web installer has been implemented using LaravelInstaller (by rashidlaasri). Installer guides you through the installation steps and checks file system permissions, PHP extensions and DB access.

If you need some extra functionality you can extend FreeScout using modules (just like WordPress plugins). Modules are developed using Laravel-Modules v2 package. Modules interact with the application via wordpress-like hooks (actions and filters) implemented using Eventy package. Modules can even add their own composer packages to the project.

If you want to be notified when new awesome modules are released, you can subscribe here.

Design and Usability

The most irritating “feature” of Help Scout is how it displays conversation status and assignee. When you open a conversation in Help Scout you do not see it’s status and assignee, besides conversation status and action buttons are mixed together.

It was very unpleasant, you feel like you are blind. Conversation status and assignee is the most important information and it has to be always available. Yes, there is a status badge next to the conversation title:

But believe you or not, I never saw it before I started development of FreeScout. I was automatically looking for the status in the status dropdown, there where you change the status. Now in FreeScout you can see conversation assignee and status right away:

When I was just starting to use Help Scout I needed to set up a mailbox. I needed a grey signature for the mailbox. But to my surprise I could not find a “Font color” button in the Help Scout toolbar and I had to open Photoshop, find the color, manually edit HTML of the signature. So now in FreeScout you can easily set font color for your mailbox signature:

Next Help Scout drawback which is fixed in FreeScout and which has been often mentioned in reviews and forums. After you assign conversation to yourself, you have to stay in this conversation, it just feels natural, but Help Scout is redirecting you to the next conversation…

As a web developer I was using Help Scout for different projects and was working as a support agent in several Help Scout accounts, so I often had to switch between Help Scout accounts. But by some reason Help Scout in it’s interface does not show me who I am:

You just see the “user” icon and you have to click on it to find out under which account you are logged in. Why is it so? Help Scout interface is not responsive and there is plenty of space in the navbar to show me my name… That is why in FreeScout now you can see right away the account under which you are logged in:

After using Gmail for many years, if you need to insert image into the reply you just drag and drop image and it appears in the reply. When using Help Scout I was doing automatically same way (every time!), but image was added as attachment instead of going into the reply area. So in FreeScout you can finally add image by dragging it into the reply area:

In FreeScout you will also find another Gmail feature which I was missing in Help Scout — “starred conversations”. It is extremely simple, powerful and time-saving:

Now comes the detective part of the story :) In Help Scout you can delete conversation, but are you able to find deleted conversation afterwards? Once I had to find a deleted conversation, but I could not. I was almost desperate. In fact to open “Deleted” folder, you have to open “Closed” conversations, scroll to the very bottom and find small “Recently Deleted” link. This is very tricky and unintuitive, but when you find it you feel like a Sherlock Holmes. So in FreeScout this behaviour has been changed: you just open “Closed” conversations and immediately Deleted conversation folder appears.

In Help Scout when you open a mailbox, you see the following buttons:

Can you tell what does the right icon mean? I had no idea what this icon depicts, so I never used it (later found out that this button means “New Conversation”).

Much better in FreeScout? Isn’t it?

Now I have a riddle for you. When you see the screenshot above, what can you tell about statuses of these users? You may think that the first user is active and the second one is not. But in Help Scout it means the opposite: second user without a mark is active and the first one is not active yet (green “tick” mark means that invitation has been sent to the user). In FreeScout everything is obvious and you don’t have to solve the riddle:

Sometimes you receive a forwarded email and you have to create a new conversation and copy paste content of the forwarded email. To solve this issue the “New Conversation” button has been added to the FreeScout:

This button is supposed to create a draft with the text of the forwarded message, so that you can reply without manually copy pasting it. But this feature is not implemented yet, it is in todo-list. What is funny, around this time exactly the same button appeared in Help Scout:

But it is functioning in a quite strange way: when you click on it, it immediately sends current message back to the customer. What is the purpose of this? Who knows.

Help desks are used by developers and companies all over the world, and their support agents not all are English speakers, so FreeScout allows to translate itself into other languages via built in translation interface, implemented using Translation Manager package.

Final Words

FreeScout already provides all the base functions needed to organize an email customer service, it is used in production systems of several commercial and non-profit companies. Many features are still to be implemented and here you can suggest features or vote for features to be added.

Thanks and good luck,

Miroslav Janko

https://freescout.net

UPD

On November 4, 2018 FreeScout repo became a top trending PHP repository on GitHub:

--

--