# How best to develop this frontend customization / plugin?

**URL:** <https://meta.discourse.org/t/how-best-to-develop-this-frontend-customization-plugin/71440>\
**Category:** Development\
**Created:** [05.Октябрь.2017 04:16:53 UTC](https://meta.discourse.org/t/how-best-to-develop-this-frontend-customization-plugin/71440 "2017-10-05T04:16:53Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![mcwumbly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mcwumbly/32/103861_2.png) [@mcwumbly](https://meta.discourse.org/u/mcwumbly)\
**Post date:** [05.Октябрь.2017 04:16:53 UTC](https://meta.discourse.org/t/how-best-to-develop-this-frontend-customization-plugin/71440/1 "2017-10-05T04:16:53Z")

</div>

I’d like to experiment with a customization to change the UX for subscribing to topics.

I’d love some pointers on how I might approach this. I’m pretty sure it’s doable as a front-end only customization. I’m unclear as to whether to tackle it as a theme or a plugin and what best practices may be for testing and maintenance.

Also, feel free to comment on the idea itself (whether you love it, hate it or shrug it).

* * *

The goal is to have a UX closer to Github’s simple _Subscribe / Unsubscribe_ interaction:

 ![gh-subscribe](https://global.discourse-cdn.com/meta/original/3X/1/1/11fa7eab283a2cdb4a297f3433ff255e496f958f.png)  
 ![gh-unsubscribe](https://global.discourse-cdn.com/meta/original/3X/0/c/0c5ec3dbc9f364b960e9b952c038b479a75c6c86.png)

In order to achieve something similar, I’d like to:

1. Make the main button action a toggle and move the drop-down to an adjacent … button.
2. Change the button text to describe the _action_ the user is taking, rather than reflect the current state. (The current state is still described in the text next to the button).

The main button would have the following default state transitions:

#### Start Watching

When you are in _Normal_ mode, the call-to-action is to _Watch_ the topic:

![d-start-watching](https://global.discourse-cdn.com/meta/optimized/3X/2/2/22e97293ece5ecf46c853758158073d3be03ea03_2_690x45.png)

#### Stop Watching

When you are in _Watching_ mode, the call-to-action is to _Stop Watching_ the topic, which will set it back to _Normal_:

![d-stop-watching](https://global.discourse-cdn.com/meta/optimized/3X/a/c/ac882add2d66fa1ba3c1920ac306682e66019fa1_2_690x46.png)

#### Stop Tracking

When you are in _Tracking_ mode, the call-to-action is to _Stop Tracking_ the topic, which will set it back to _Normal_:

![d-stop-tracking](https://global.discourse-cdn.com/meta/optimized/3X/5/d/5de142426e5e00b1fcf5e98b9c4cca2fc70ce59e_2_690x44.png)

#### Unmute

When you have in _Muted_ a topic, the call-to-action is to _Unmute_ the topic, which will set it back to _Normal_:

![d-unmute](https://global.discourse-cdn.com/meta/optimized/3X/7/7/77a1164afd085de644f7bbd0501671caf4df24e5_2_690x46.png)

#### Select Notification Level

To select a different notification level, click the …, which will display all the _other_ options not currently selected. For instance, if you’re currently tracking the topic:

 ![d-select](https://global.discourse-cdn.com/meta/original/3X/a/9/a99ffbc92706c36e40f972d483117ccb2da8fc32.png)

(I’m also considering replacing the combo reply/notification button under the progress bar with this control… and perhaps something similar for the category subscription).

---

_[View the full topic](https://meta.discourse.org/t/how-best-to-develop-this-frontend-customization-plugin/71440)._