Steem Notifier - New UI, More Notification Options, New Features and Bug Fixes

in #utopian-io2 years ago (edited)

Screen Shot 2018-01-15 at 19.22.25.png

Steem Notifier is a desktop app that uses your native operating systems notification engine to send updates about your Steem account.

Numerous updates in this release help to push Steem Notifier another step closer to what I want out of a desktop client. I’ve redesigned the UI, added new features, improved old features and fixed a couple issues. You can see and download the project on github. Continue reading to learn more about the work I’ve done in this update.

Redesign

I’ve split the app into two screens, an initial input screen and an information screen that controls notifications. As you can see the new design is quite different although still aims to be minimal. New animations help to create a fluid feel loading and moving between screens. Electron apps are built using html, css and javascript so I made use of css3 animations. You can see the old version on the left and the new two screen version on the right.

v2-v3.jpg

Relevant commits - b2fddfb97 - 21bcf310 - f87a08339

New Features

Added four new notification types - curation reward, new follower, reblog, vote Power at 90% and 100%.

Vote power needed a new custom implementation as it is outside of the transaction data. I opted to poll the server for the lastest vote power of the user, keeping a store of the old value and comparing both to see if a threshold has been reached. The user can choose from notifications at 90%, 100% or both, I find these values most useful myself. [eaa4faf772]

Screen Shot 2018-01-15 at 22.37.06.png

Follower & Reblog are part of the transaction data but are stored in the custom_json so it took a little investigation to find those values. [60c046]

Curation Reward was the same as previous notifications and was a quick win [83aef6e304]

Added a user profile screen information along with vote power bar.

Screen Shot 2018-01-15 at 22.30.17.png

The vote power bar is an SVG circle, it's stroke wraps around the outside of the profile image, onload it animates to the correct % of the circle. Vote Power is one thing missing from the Steemit interface that people use other sites to check regularly. The user information helps to make the app feel more personal. [6d5cfec13ad82]

New UX flow - in the previous version you would need to select all the checkboxes you wanted and then click enable. I opted to update the notifications with each check/uncheck of a select box.

Screen Shot 2018-01-15 at 22.31.30.png

Custom icons for each notification type to make identifying incoming actions more quickly. Easily differentiate between transfer/follows/votes etc at a glance. [fc17bb5]
Screen Shot 2018-01-15 at 19.11.13.png
Screen Shot 2018-01-15 at 19.09.38.png

Improvements

  • Change how I show the user the app is running, I did not like the dropdown notification I made in the previous version, opting to keep it minimal with an pulsing green icon.
  • Stoping and starting now happens automatically so I could remove the enable/disable button.

Bug Fixes

Fixed an issue that would cause app to crash when computer would sleep. Fix - Steem Notifier streams transactions from the blockchain, I needed to add a handler to the sleep/wake events to start and stop the streams respectively. [b35627fd] & [0024e6f5]

The comment reward notification was not firing. Fix - It turned out to be a simple reference error to a specific variable used

Contributions welcome

Ideas, comments and pull requests are welcomed and encouraged, would be great to know what you all think. If anyone has the ability to test on windows/linux it would be appreciated. Are there any featurs you would like to see added?

Thanks for taking the time to look at Steem Notifier. ✌️



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Thank you for the contribution. It has been approved.

Looking for more good contributions from you in future.

You can contact us on Discord.
[utopian-moderator]

Thanks for your time reviewing my project @ms10398 👏

I'm going to cry right now, I've been searching for days how to work with javascript and gather some data out of that blockchain, thanks to Amos lead me here.
Screen Shot 2018-01-16 at 01.48.23.png
I've just read your first tutorial about that bot, so simple and clean it's bad that you already get your payout on that (not that i'm a whale but every penny counts, right) :)
Well, hope after your tutorials I could get my feet on the ground and maybe contribute on this on. I was planning to get comment/upvote notification of people I'm following. Otherwise my feed is looks like dead inside.
Thank you for your beginner friendly tutorials. Yeah thank you :)

Glad I could help, haha! Also @sambillingham I will download it tomorrow and test it out on Ubuntu for you, it looks really good!

appreciate the shout out Amos 👊

Also, thanks for offering to test, let me know if it runs okay. I'm wondering if it might need OS specific design, it's very mac right now. I'm going to see if I can replace the notification system later in the week, it uses a rebuilt custom binary of terminal-notifier which I think would cause a warning/error on install if I packed it up as an executable. Once i've got that figured out I can set it up so people can download and install easier, not quite for everyone yet when you have to start it from the terminal.

Super glad I can help out. See how you find the three tutorials I have posted and make sure to comment if anything doesn't make sense or you get stuck. I'm happy to help. I'll have more tutorials out later in the week.

I agree sometimes it feels like nothing is happening on steemit because there is no kind of notifications.

this looks awesome, can i run it on a windows pc too or is it just for mac?

Thanks. yeah, it will run on windows although it's untested. A slight caveat that it's not packaged as an executable yet so unless you're a developer with the tools installed already there is some setup required. I'm aiming to get a packaged version out once it's been tested and I've got a couple extra features in, probably at the weekend.

Ah i see im not a developer sadly. Just a photographer who hopes to get some notifications on steemit😂😂

I think I'll try that

ayyyye thats pretty cool