Setting up the Advanced Web Interface for Mastodon - Full use of wide screens

Mastodon has different modes of operation - a lot of users are mobile-centric, on the go and used to the tiny screens, glued to their devices.

Some of us are glued to our devices too, but they happen to be of the desktop or laptop variety. I can’t realy do the work I want to in a mobile device; for me, they are a compromise, a small and light device that’s useful when out and about, or which I can take easily when traveling.

Have now figured out a way to make my laptop settings for the mastodon Web Client really sharp – it is using the FULL screen width, but without the madness of the multi-pane, 3 pulsating Feeds running simultaneously which is kind of the Default when you enable it.

So, will show you a series of screen snapshots to explain how you can try to get yours set in a pleasant way too.

1. Enabling Advanced Web Interface :slight_smile:

This is done in the big Preferences panel, where so many other things have controls too.

  • From the top left side menu, select “Preferences”. It’s the Gear icon, as shown.

image

  • The window will change to the Full screen Preferences panel.

There’s one control only to be used here - the checkbox, to enable AWI - the Advanced Web Interface. Click on it, then scroll down to the “Save Changes” big button.

image

  • Done - now, go back to the Mastodon with the Top Left “Back to Mastodon” button.

image

2. Configuring the Advanced Web Interface to your liking.

When turned on, AWI will force the web client to allow the use of the FULL screen width. But there are choices to be made, it can be less or more occupied, depending on your tastes.

  • Here’s a Loaded display, will all 3 Feeds active and ticking. It’s hard to concentrate on anything for me, so I wouldn’t have it so. But the choice is yours. :wink:

  • The top right corner of each of those panels has a Control icon - the one with the Sliders.

image

  • when you select that, a panel with settings for that pane will drop down, and there’s various things you can do here.

  • These are the controls you get on the Notifications Panel. There’s choices for enabling or disabling Sounds for notifications, depending on their types. Here, I have turned sound off on all of them (to avoid distractions when busy, working on some task).

  • At the bottom Left corner, you also see, in this and other panels sometimes, the choice “+Pin” - which allows adding one more panel with a feed.

3. Using the Advanced Web Interface in Mastodon

For me, having the Local, Home and Federated feeds all on the screen at once is overwhelming. It’s like a Stock Trader’s desk, when the market is open and in full swing. :stuck_out_tongue_winking_eye:

  • So, let’s cut the clutter to a minimum. I enjoy the Local feed in any instance I am in - it’s the one our instance users are always posting in, and it has a flavour of its own, depending on the community’s focus, how active people are, what type of post gets made.

  • my favourite setup at this moment will have TWO wide panels, containing the Local Feed (center of the screeen) and at the right side, either a Notifications or a Reply panel, if I have clicked on some post in Local to interact with it.

Ok, now that we have the Local Feed and our Notifications panel on the screen, time for some work. From here, we can:

  • see if there’s any Notification that is cool, we want to Favourite it – which in Mastodon is the equivalent of the “Like” button used in other networks.

  • That can easily be done from the Notifications panel itself - you see the note, like it - Click on the Star and it gets Favourited right from there.

  • If there is a message in Notifications that is longer (doesn’t show the full Toot), or you want to see the image contents - Click on it, and it will expand and fill the Notifications panel completely. Now you can see much more of it.

  • To select that or any other message for interaction - you click on either any part of the written text on the message; OR, on the space at Left side of the image on the post, if there is NO Text at all (some people are like that).

  • Once you Click on the arrow either in the post at the Local Feed, or on one of the Notifications in the Right side panel, the Toot Editor will become Active.

  • it will show a quote box above, showing the text of the post you are replying to.

  • and the Toot Editor box will now contain the @ tags of any usernames included in the message you are replying to.

  • Click on the Toot Editor in a blank area to start entering your text. Finished? Hit the “Toot!” button and your reply is on its way.

That’s the basics of it, and I think very soon you will enjoy this setup. We are using our full window widths, and there is NO space lost in these examples.

  • In some instances, there might be some lost space, in the Right side, which we can’t occupy, unfortunately. That is likely due to the server’s configuration in that instance.

  • I have been able to use this awesome FULL width in two instances that I have accounts on. I have NOT been so lucky on another two, which look like this : :slight_smile:

That’s a pity, but at the moment I am not sure how this could be improved or fixed. Bummer.

But we are still better off with this setup than the default, I believe.

Hope this helps and you can configure your own Wide Interface to your liking, and enjoy it doing lots of good posting.

Thank you, please leave any comments or questions here in this thread.

RG @design_RG@qoto.org

And a NEW post, months after those last ones.

Still a passionate issue for me, someone got to push for Advancement. :sparkler:

Copied from a Mastodon post here.



@Sphinx

Sure, not a problem.

Pinafore displays Toot and notifications in a single vertical Panel, similar to the default Mastodon Web client in that sense.

What you see in your own Pinafore, it’s a single vertical Column, a Panel of information.

And on my 1600 pixels wide screen - sh1t, there’s SO MUCH wasted space, not even funny.


That is the main reason I don’t use Pinafore exclusively. It is light, fast, has great features and as i mentioned, it’s for Elite Users. I have about 10 instances fully configured – and can switch from one to another with ONE click. No kidding.

But… Proper use of a wide screen display is something I have lifted the flag for sometime ago. That topic is from December, 2019.

I went in person to Mastodon.social and wrote to Eugen there – showing my ideas. He saw and briefly commented, but he has too many things on his plate already.


My current solution is using the mastodon web client BUT — Turbo enhanced to max performance and Space usage.

What hopefully someday main stream Mastodon could be.

See 800 pixels screenshot here, in line below. Full size, 1600 pixels wide – for details

Masto-AWI-RG-800x412p


Notice a few things :

  • NO wasted space at sides!
  • TWO large, Wide panels, which can display Local and Notifications, or any other combination you like.
  • See the BIG Toot Editor, where I am writing this mega reply?

Yeah, that’s a Tool for Writers. :smiley:

I can’t live with the limitations of regular vanilla clients. Need Power Tools, for productivity.

#QotoJournal is adequate, this is an Important discussion to have
#mastodev #mastodon #UI


Recipe for above described Setup?

  • I am using here mastodon WebClient in AWI mode enabled.
  • and the Total Screen use is made possible by the Collapsed Mastodon Add-on for Firefox (also available for Chrome).
  • which is what give me the oh-so-great freaking BIG Reply box. Under Every Post I need. It won’t be so large, by default, but it EXPANDS as I type away.

Good ideas deserve to be Seen. Wish Eugen would consider those. Collapsed Mastodon is on a Git repository, it’s open sourced too.

Discourse Forum topic with details and illustrations


And I am adding a new post today, May 28, 2020

…5 months later, to add this Toot to it, with the Beautiful Formatting and inline images that Mastodon at this time can only dream off.

@freemo @n0btc@megadon.net

2 Likes