Visualizer v2

As teased and mentioned in the original topic, I made a massive overhaul to Visualizer. 🥳

When I originally made the tool, I was simply looking for a better way to share my shots - to be more dynamic than a simple screenshot. It was a quick - scratching my own itch - MVP. I didn't fuss over looks, I just wanted the functionality.

But it became way more than I ever thought/hoped it would be. There are over 100 registered users and over 4.000 shots uploaded as of this writing. In 2 months! These numbers are growing ever faster, and I imagine them even speeding up with awesome additions like the Upload functionality in Describe Your Espresso by

Enrique

and first-party DE1 Extension by

Johanna

. Not to mention that this forum / Decent user base is growing ever larger. 📈

With that in mind I started playing around with new UI/UX that I could build. Since this is my side project, I want it to be beneficial to me in some way so I wanted to learn some new technologies: mainly Hotwire (with Turbo and Stimulus) and Tailwind. I started poking the bear on Jan 18, and now, 12 days later, there's this huge diff. 59 commits, 93 files changes with 2,189 additions and 2,268 deletions. 😅

You already know what Visualizer is, and how it works, but if you don't go read on the original thread. The core of it, visualizing a shot, stayed mostly unchanged. I do plan on tackling that as well in the future, but don't know when or how. I need a bit of a break right now 😄

So what changed then, you might ask? Well, just about everything else 🙈 The UI looks and works much better, especially on mobile. It has it's own "feel" now. Everything looks like it belongs together, and not just a random compilation of spare parts. Let me take you through some of my favorite things:

The way accessing profile menu looks now:

And of course it adapts the way it looks if you have selected DSx (dark) theme:

The way table row adapts given how big your browser window is to show as much data as possible and have clear and well positioned buttons:

How nice and fast shot deletion is:

And of course the modal adapts to different theme:

Another cool thing when you delete the shot is that it's immediately gone from all the lists it's displayed at. Even if you have multiple browser windows opened, or if you've opened Visualizer on mobile and on desktop. It's gonna be gone everywhere immediately without the need to refresh the page. But on the browser where you did trigger the deletion, I also fetch a new shot and append it to the bottom of the table.

You can also navigate the modal with enter (to confirm) and esc (to cancel). While it's no bulk delete, it still makes deleting shots much faster and streamlined. You don't even need to move your mouse, just keep clicking and pressing enter 😂

And of course, the good old drag-and-drop bulk upload is still there, and it's as fast as ever, but even nicer:

And in case you're not aware, you can never upload a duplicate shot! I have a de-dup detection so if you upload same shot again, it'll simply be matched and all its data will be updated. 

Let's say you're using auto-uploader and you have your shot uploaded immediately when you pull it. The shot will be there for you to see, to share, and what not. Then let's say you go back to Decent, and edit Enjoyment and add some Notes. When you will upload that .shot file manually, Visualizer will simply find the original one and update the Enjoyment and Notes fields. Magic!

Support banner:

As I've said before the tool is becoming more and more popular. And while I absolutely love that, it does come with the problem of database storage. Because we're fast approaching the limit of the free db plan I'm on, I'll soon have to switch to a paid one. I do not want Visualizer to be a paid or freemium tool. It's my hobby project, not my job. But I would like my expenses to be covered by donations via GitHub sponsorships.

So, if you're a heavy user and have uploaded more than 100 shots you'll see the above banner on the top of every page. You are free to ignore it, and if it really bothers you, you can delete some shots to be under 100.

But, if you decide to sponsor the project, the banner will go away, and you'll get a very snazzy checkmark next to your name in the Decent People list:

Another way I'm tackling the ever-growing shot list - no more anonymous uploads:

They were great when the tool was used just for looking at one chart. But now that we're contrasting and comparing our (and other people's) shots, it makes little sense for a shot to be basically lost to the wind once it's uploaded. Especially since it stays in the db forever clogging up space. There is no user, so no one has the permission to delete it.

Registration is and will always be free and registered users are private by default. You could even sign up with a fake email, upload the shot, and then delete it when you don't need it anymore. That way it'll be gone for you, and for the database.

To make it extra clear I really care about privacy and will never share and/or sell your email and/or data I even wrote as clear of a privacy policy I could:

This is in no way a comprehensive list, and there's much more for you to discover. I'm absolutely in love with how nice the edit shot and edit profile forms look now, for example.

These are just some of the things that I think really make the whole thing much nicer to use. And now I have a nice base on which I can build new features on.

And I have a ton of ideas.

Feel free to pitch your own as well!

Or, even better, submit a PR 😅