Work in Progress 2018

Watermark App


A side project built to experiment with Vue.js, canvas, and launching a digital product.

Vue.js Web App

In my spare time, I’ve been working on a web app that lets users add a text watermark to a batch of images. Working on the project has helped me flex my design, development, and digital product building skills. It’s a work in progress—I’m hoping to launch the first version soon.

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.

Launch App

And if you'd like, you can also View Source. ∎

Here's the scoop

I love building web projects, and even more so when I get to learn something new. If your company values learning by doing, feel free to get in touch.

Email Me
Next Case Study Graber Blinds