Popup UI Improvements & On-boarding Walkthrough for Steem Plus
Popup UI Improvements & On-boarding Walkthrough for Steem Plus
I implemented the following features/enhancements to Steem Plus:
- On-bording Flow
- Pop Up UI Improvements
The following information provides more info on what has changed:
1. On-bording Flow
I implemented a four step on-boarding flow which you easily add and remove steps in on popup.js.
The four steps that I implemented can be shown in this image here:
The aim of these steps is to help on-board new users by providing them some information about what Steem Plus has to offer when they first launch the chrome extension.
2. Pop Up UI Improvements
Pop Up Main Menu
The following shows the changes to the main menu:
Upvote Page
The following shows the changes to the upvote page:
Sign in page
The following shows the changes to the sign in page:
Options Area
The following shows the changes to the options page:
The commit can be found here: https://github.com/stoodkev/SteemPlus/pull/8/commits/67f75918a69fc1e06a9d74b3d62b325f8d636f01
This has been merged by the project owner:
A link to the pull request can be found here: https://github.com/stoodkev/SteemPlus/pull/8
The main changes were made within popup.html and pop.css to restyle the pop up, minor changes were made to popup.js to create the on-boarding process.
A link to the files that changed during this release: https://github.com/stoodkev/SteemPlus/pull/8/files
The on-boarding screens involved updating the html within the pop up based on a user's onboardingID as a user progresses through each of their steps their onboardingID will increase following the successful completion of a on-boarding flow I saved a marker within chrome.storage to indicate that the on-boarding process should not longer shown for that user. Additional steps can be defined within the within flow easily using the setOnboardingScreen function and making minor adjustments to onboard function to cater for newly created on-boarding steps.
Posted on Utopian.io - Rewarding Open Source Contributors
Thank you for the contribution. It has been approved.
You can contact us on Discord.
[utopian-moderator]
You got a 100.00% upvote from @votezilla courtesy of @tobias-g!
Good job! Thanks a lot for your work!
@tobias-g, Upvote for supporting you.
Your Post Has Been Featured on @Resteemable!
Feature any Steemit post using resteemit.com!
How It Works:
1. Take Any Steemit URL
2. Erase
https://3. Type
reGet Featured Instantly – Featured Posts are voted every 2.4hrs
Join the Curation Team Here | Vote Resteemable for Witness
Hey @tobias-g I am @utopian-io. I have just upvoted you!
Achievements
Community-Driven Witness!
I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!
Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x