Ever heard of the term MVP (Minimum Viable Product)? It stands for a minimalistic version of a concept that suits the user's needs to get feedback or answer questions. The goal is to deliver value fast and incrementally add features as you discover what is right.
In a previous article, I introduced PrivacyBlur, the app we recently created @MATHEMA. I didn't say the role I played in the making: I was the product owner. And so, we took the concept of incremental delivery very seriously, both because I believe in it and because it was a great learning experience for all the persons involved. Here's how the app gradually grew to its final form.
The MVP we created was very simple. It allowed you to load a picture, tap somewhere to create a pixelated area, drag the area across the picture and save the picture.
The goal of the MVP was to answer one question: can the technology we chose (Flutter) handle image manipulations with the performance we expect?
As you can see below, the project codename was #Pixelmonster.
It wasn't pretty in its very first version, but it did the job and answered our question: Flutter rocks!
The goal of v1 was to recreate the MVP as an App worthy of being pushed on the AppStores.
The developers rewrote parts of the application. We explored a few different UX (user experience) concepts, making the app more iOS-like. We added different screens and separated the image selection from the image edition. We added fool guards and error messages. We made sure it works with the privacy settings of the OS, etc.
The workflow was still very rough:
- load an image
- create a blurred area
- tweak it
- save it
But we learned a lot about what works and what doesn't. For instance, we learned that a settings page was not a good idea. Or that some decoupling of the views that made sense from an architectural standpoint made the UX miserable. Similarly, some tight-coupling that we thought was necessary prevented us from extending the code. We also experimented with the placement of the toolbox, blow, floating over the image, with text, icons, tooltips, etc. We moved buttons around like madmen and explored different crazy concepts that we thought might be good ideas until we could play with them. Finally, we reused the iOS "Photos" App concepts, and it felt instantly better.
Here's how v1.x looked like (I use v1.X because we had 3 releases of v1 with a few interesting bugfixes along the way):
The goal of v2.0 was to enable the creation of multiple blurred areas simultaneously and persist the changes only at the end. The developers had to refactor the code a little bit and faced some performance issues, but it went well. We also changed some UX constructs again, ditched the Apply/Cancel buttons and added a preview mode.
Finally, now that the UX was clean and the app could create multiple blurred areas, face detection came as the final feature. We explored a few frameworks and algorithms and finally settled on Google ML Vision API.
The only change in the UI between 2.0 and 2.1 is the "red smiley" in the bottom-right corner of the picture on the left and the smiley in the toolbox introduced with 2.1. This red smiley triggers the face detection on the whole image and places blurred areas over each face it finds.
And that's the "final" version you can see right now in the stores.
Using this incremental delivery, we were able to hit the AppStores in days, not weeks. We were able to crush a few badly conceived ideas I had. They sounded like good ideas at the beginning. But as soon as I was able to play with them, they felt clumsy. It would have been a bummer to realize this in the end, after weeks of development.
Last but not least, we were able to get real user feedback. My sister, who is running events with kids in Paris and publishes many images on Instagram, was delighted to start using it and her feedback influenced the way we designed v2.0.
And that's why you should focus on the incremental design of your products, and not layered or modular creation.
The App is available right now for free:
- Android: PrivacyBlur on the Android Store
- iOS: PrivacyBlur on the iOS App Store
- Sources on GitHub: PrivacyBlur sources on Github