Learning by building
For me, the most fun way to learn a new technology is to build a project of my own. When I wanted to experiment with Vue.js and manipulating text on an HTML5 canvas, I didn’t set out to build a batch watermark app. But while working, the thought that this could actually become a useful tool really began to emerge. I got excited about the prospect of publishing something that others would find useful. So, my mindset began to shift from “What can I do with Vue and canvas?” to “How can I make this into a tool people would actually use?”
Not all features are necessary
Before I continued to build, I did a bit of research. Other online image watermarking apps were either outdated, had too many features, or didn’t let you add multiple images at once. Many were tough to use on mobile and touch screen devices. With this in mind, I decided to create a focused, easy-to-use tool to watermark a bunch of photos at once.
As I developed options and features, the UI design progressed naturally (above). It was fun to add lots of features—what if you could change the text color, add a text shadow, and adjust the letter spacing? But I quickly realized that too many options can be a bad thing. The UI became cluttered and the app lacked the simplicity that it previously held. In order to keep the product focused and true to my vision, I cut out unnecessary features.
In the current version of the app (above), I’ve been working on paring down the features. What are the minimum necessary options for the tool to be useful to someone trying to add a watermark to their photos?
Shipping soon
I've done a soft launch of the app under the name Tinymark. However, it's still a work in progress. The code can be cleaned up, the UI needs to be fine-tuned, and a little branding wouldn’t hurt. My next step, however, is going to be testing it with some real potential users. By doing user interviews, I think I’ll have the feedback I need to add a layer of polish and get this thing out into the world. ∎