TLDR; I designed my first app, I corrected my mistakes as developer, I used some amazing analysis tools, We launched on PH and we contributed to OSS 😍
A random thought turned into a tool - RevealUrl, which helps you to find spammy links in any page, literally. Through the journey from the initial discussion until this blog, there are some learning I'd want to share with the community, in brief.
So, the guy behind the idea and did the heavy lifting with the back-end is Gaurav shankar and I am the guy who worked on the web page design, Development and browser plugins. So, this blog post will cover my contributions.
For a clear understanding, this article is divided into 3 sections - Designing, Development, and Publishing.
🎨 Designing
Though I experiment with designs, I am not completely from a design background. I explore design tools in my free time and this time its Adobe XD - A free, almost SketchApp-ish alternative and it is amazing with inbuilt prototyping.
App Designing
I have the least idea on the UX from a perspective of a designer, so ideally I made a page which I feel like using - A one-page app. And I prefer apps that are simple and easily adaptable to use. It started with a simple just a wireframe -
And coloring it followed next
In the process, a thought struck - 'Why can't I make it a little dynamic?' and the result is the iteration of the primary color amongst the below every-time when you load the app.
and the final result is the below UI -
Logo Making
I must say, Logo making, is the hardest part of the whole process, why - too many thoughts, less possibility with adobe XD and way too much creativity needed. The solution, Download a free SVG and edit 🤷♂
Tools used
Hero Patterns
Flaticon
Coolors
👨💻 Development
I sometimes feel frameworks are making us lazy & bad and this was one such time. You may not agree, but well feelings are not mutual. The reason, basic requirements like editor-config, linting and distributing never occurred to me while coding.
Coded in plain 'Ol HTML, the only time to make decisions were
-
reboot.cssornormalize -
jQueryor not ended up withreboot and jquery. Let us try its just a simple tool !!
The only challenge during development was the making of Browser plugins. Started with Chrome plugin I wanted to use the same code for Firefox as well. After a little reading, for my usage (Storage, notifications, and active tab), I just need to replace the window.chrome API with window.browser for firefox to work. That's all and there comes my first semi-cross browser plugin 😄
You can download it here - Firefox | Chrome
Tools used
Semantic Versioning
EditorConfig
Grunt
Publishing
When you are publishing your plugins the browser stores, you need a one-time fee of $5 to be paid for Chrome store and Firefox 🦊 is free and friendly always. The submission was little time taking and there are too many policies for the safety of addon-user in Chrome and in Firefox they just need your code. Simple right?
As a simple tool which doesn't collect any of the personal or sensitive info from visitors, we had a curiosity to learn about visitor interactions in the app. So, in the process, we learned the basic usage of the following tool -
And finally, Our preferable platform to launch is Product hunt (obviously 😁) along with little drum-roll 🥁 on our social handles. PH works on PST, and if you launch a product at later part of the day it will be automatically scheduled to release next day. On PH, activity is more during the day than on night so PH does this to bring more audience. Thanks 🙌 PH for that.
And finally, it was a 3rd product of the day.
So, final thoughts.
Sidekicks are much required for any developer. There is a possibility to learn something new through them.
We ❤️ OSS and made the [code public(https://github.com/team-underscore). Do share hugs or bugs.
Cheers, KD 🤘
-- Posted here initially --
Top comments (2)
👍 I like what you do. And strongly dislike extensions because they in wide use for fingerprinting, and due to low control and pure usability. And it seems users don't like them too. I think PWA would be a better solution.
Good to know your thoughts. In our case browser plugins were most requested so we have provided them, turns out not every user dislikes them. And I am happy to learn to code browser plugins. Not sure f such small app needs PWA way of implementation. But yeah, glad for the suggestion :)